@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
@@ -279,7 +279,7 @@ like `<b-navbar-brand>`, they'll automatically be aligned to the far right. Reve
279
279
  will reverse the placement of the toggler.
280
280
 
281
281
  See the first example on this page for reference, and also refer to
282
- [`<b-collapse>`](/docs/components/collapse) for details on the collapse component.
282
+ [`<gl-collapse>`](?path=/docs/base-collapse--docs) for details on the collapse component.
283
283
 
284
284
  Internally, `<b-navbar-toggle>` uses the [`v-b-toggle` directive](/docs/directives/toggle).
285
285
 
@@ -322,12 +322,11 @@ Navbars are hidden by default when printing. Force them to be printed by setting
322
322
 
323
323
  ## See also
324
324
 
325
- - [`<b-collapse>` component](/docs/components/collapse)
325
+ - [collapse](?path=/docs/base-collapse--docs)
326
326
  - [`v-b-toggle` directive](/docs/directives/toggle)
327
- - [`<b-nav>` documentation](/docs/components/nav) for additional components and sub-component
328
- aliases
327
+ - [nav](?path=/docs/base-nav--docs) for additional components and sub-component aliases
329
328
 
330
- Refer to the [Router support](/docs/reference/router-links) reference page for router-link specific
331
- props.
329
+ Refer to the [Router support](?path=/docs/base-link--docs#router-link-support) reference page for
330
+ router-link specific props.
332
331
 
333
332
  <!-- Component reference added automatically from component package.json -->
@@ -61,7 +61,7 @@ Twelve options are available for positioning: `top`, `topleft`, `topright`, `rig
61
61
  `rightbottom`, `bottom`, `bottomleft`, `bottomright`, `left`, `lefttop`, and `leftbottom` aligned.
62
62
  Positioning is relative to the trigger element.
63
63
 
64
- <div class="bd-example bd-example-popover-static">
64
+ <section class="bd-example bd-example-popover-static">
65
65
  <div class="popover b-popover bs-popover-top bs-popover-top-docs">
66
66
  <div class="arrow" style="left: calc(50% - 8px)"></div>
67
67
  <h3 class="popover-header">Popover top</h3>
@@ -163,7 +163,7 @@ Positioning is relative to the trigger element.
163
163
  </div>
164
164
 
165
165
  <div class="clearfix"></div>
166
- </div>
166
+ </section>
167
167
 
168
168
  ## Triggers
169
169
 
@@ -887,8 +887,8 @@ interacting with it (keeping focus inside the popover until it is closed by the
887
887
 
888
888
  **Note:** The animation effect of this component is dependent on the `prefers-reduced-motion` media
889
889
  query. See the
890
- [reduced motion section of our accessibility documentation](/docs/reference/accessibility) for
891
- additional details.
890
+ [reduced motion section of our accessibility documentation](?path=/docs/base-tooltip--docs#accessibility)
891
+ for additional details.
892
892
 
893
893
  ### Making popovers work for keyboard and assistive technology users
894
894
 
@@ -2168,7 +2168,7 @@ Setting the prop `filter` to null or an empty string will clear local items filt
2168
2168
  ### Debouncing filter criteria changes
2169
2169
 
2170
2170
  <span class="badge badge-warning small">deprecated in v2.1.0</span> Use the `debounce` feature of
2171
- [`<b-form-input>`](/docs/components/form-input#debounce-support) instead.
2171
+ [form-input](?path=/docs/base-form-form-input--docst#debounce-support) instead.
2172
2172
 
2173
2173
  If you have a text input tied to the `filter` prop of `<b-table>`, the filtering process will occur
2174
2174
  for each character typed by the user. With large items datasets, this process can take a while and
@@ -2198,7 +2198,7 @@ at a time by setting the `per-page` prop to the maximum number of rows you would
2198
2198
  use the `current-page` prop to specify which page to display (starting from page `1`). If you set
2199
2199
  `current-page` to a value larger than the computed number of pages, then no rows will be shown.
2200
2200
 
2201
- You can use the [`<b-pagination>`](/docs/components/pagination) component in conjunction with
2201
+ You can use the [`<gl-pagination>`](?path=/docs/base-pagination--docs) component in conjunction with
2202
2202
  `<b-table>` for providing control over pagination.
2203
2203
 
2204
2204
  Setting `per-page` to `0` (default) will disable the local items pagination feature.
@@ -2415,9 +2415,9 @@ of records.
2415
2415
  respective `no-provider-*` prop set to `true`).
2416
2416
  - The `no-local-sorting` prop has no effect when `items` is a provider function.
2417
2417
  - When using provider filtering, you may find that setting the
2418
- [`debounce` prop on `<b-form-input>`](/docs/components/form-input#debounce-support) to a value
2419
- greater than `100` ms will help minimize the number of calls to your back end API as the user
2420
- types in the criteria.
2418
+ [`debounce` prop on `<gl-form-input>`](?path=/docs/base-form-form-input--docs#debounce-support) to
2419
+ a value greater than `100` ms will help minimize the number of calls to your back end API as the
2420
+ user types in the criteria.
2421
2421
 
2422
2422
  ### Force refreshing of table data
2423
2423
 
@@ -4,7 +4,7 @@
4
4
  > cards internally, and provides full keyboard navigation control of the tabs.
5
5
 
6
6
  For navigation based tabs (i.e. tabs that would change the URL), use the
7
- [`<b-nav>`](/docs/components/nav) component instead.
7
+ [nav](?path=/docs/base-nav--docs) component instead.
8
8
 
9
9
  ## Basic usage
10
10
 
@@ -91,7 +91,7 @@ When `<b-tabs>` is in `card` mode, each `<b-tab>` sub-component will automatical
91
91
  **Note:** Setting the `no-body` prop on `<b-tab>` will have no affect when `<b-tabs>` is not in
92
92
  `card` mode (as the `card-body` class is only set when in `card` mode).
93
93
 
94
- Refer to the [Cards documentation](/docs/components/card) for more details on card components.
94
+ Refer to the [Cards documentation](?path=/docs/base-card--docs) for more details on card components.
95
95
 
96
96
  ## Pills variant
97
97
 
@@ -22,7 +22,7 @@ under the toast.
22
22
 
23
23
  ```html
24
24
  <template>
25
- <div class="p-3 bg-secondary progress-bar-striped" style="min-height: 170px;">
25
+ <div class="p-3 bg-secondary" style="min-height: 170px;">
26
26
  <b-button class="mb-2" variant="primary" @click="$bvToast.show('example-toast')">
27
27
  Show toast
28
28
  </b-button>
@@ -36,8 +36,8 @@ under the toast.
36
36
  ```
37
37
 
38
38
  **Note:** we are using the `static` prop in the above example to render the toast in-place in the
39
- document, rather than transporting it to a `<b-toaster>` target container. And we have added classes
40
- `bg-secondary` and `progress-bar-striped` to the outer `<div>` for illustrative purposes of toast
39
+ document, rather than transporting it to a `<b-toaster>` target container. And we have added class
40
+ `bg-secondary` to the outer `<div>` for illustrative purposes of toast
41
41
  transparency only.
42
42
 
43
43
  ### Toast features and notes
@@ -535,7 +535,7 @@ for generating more complex toast content:
535
535
  In some cases you may need just a simple alert style message (i.e. cookie usage notifications,
536
536
  etc.). In these cases it is usually better to use an fixed position alert instead of a toast, by
537
537
  applying a few Bootstrap [utility classes](/docs/reference/utility-classes) and a small bit of
538
- custom styling on a [`<b-alert>`](/docs/components/alert) component:
538
+ custom styling on a [`<gl-alert>`](?path=/docs/base-alert--docs) component:
539
539
 
540
540
  ```html
541
541
  <template>
@@ -615,7 +615,7 @@ that can impact both people with and without disabilities. The following list, w
615
615
  provides general guidelines when using toasts.
616
616
 
617
617
  - If the information needed is important for the process, e.g. for a list of errors in a form, then
618
- use the [`<b-alert>`](/docs/components/alert) component instead of `<b-toast>`.
618
+ use the [`<gl-alert>`](?path=/docs/base-alert--docs) component instead of `<b-toast>`.
619
619
  - `<b-toast>`, by default, sets the attributes `role` to `'alert'` and `aria-live` to `'assertive'`.
620
620
  If it's an important message like an error, this default setting is appropriate, otherwise set the
621
621
  prop `is-status` to `true` which will change the attributes `role` to `'status'` and `aria-live`
@@ -64,7 +64,7 @@ Twelve options are available for positioning: `top`, `topleft`, `topright`, `rig
64
64
  `rightbottom`, `bottom`, `bottomleft`, `bottomright`, `left`, `lefttop`, and `leftbottom` aligned.
65
65
  The default position is `top`. Positioning is relative to the trigger element.
66
66
 
67
- <div class="bd-example bd-example-tooltip-static">
67
+ <section class="bd-example bd-example-tooltip-static">
68
68
  <div class="tooltip b-tooltip bs-tooltip-top bs-tooltip-top-docs" role="tooltip">
69
69
  <div class="arrow" style="left: calc(50% - 6px)"></div>
70
70
  <div class="tooltip-inner">Tooltip on the top</div>
@@ -113,7 +113,7 @@ The default position is `top`. Positioning is relative to the trigger element.
113
113
  <div class="arrow" style="top: 0px"></div>
114
114
  <div class="tooltip-inner">Tooltip on the leftbottom</div>
115
115
  </div>
116
- </div>
116
+ </section>
117
117
 
118
118
  Refer to the [Tooltip directive](/docs/directives/tooltip/#positioning) documentation for live
119
119
  examples of positioning.
@@ -553,7 +553,7 @@ with the auto generated ID of the tooltip.
553
553
 
554
554
  **Note:** The animation effect of this component is dependent on the `prefers-reduced-motion` media
555
555
  query. See the
556
- [reduced motion section of our accessibility documentation](/docs/reference/accessibility) for
557
- additional details.
556
+ [reduced motion section of our accessibility documentation](?path=/docs/base-tooltip--docs#accessibility)
557
+ for additional details.
558
558
 
559
559
  <!-- Component reference added automatically from component package.json -->
@@ -44,8 +44,6 @@ export const NAME_NAVBAR_BRAND = 'BNavbarBrand'
44
44
  export const NAME_NAV_ITEM = 'BNavItem'
45
45
  export const NAME_NAV_ITEM_DROPDOWN = 'BNavItemDropdown'
46
46
  export const NAME_POPOVER = 'BPopover'
47
- export const NAME_PROGRESS = 'BProgress'
48
- export const NAME_PROGRESS_BAR = 'BProgressBar'
49
47
  export const NAME_TAB = 'BTab'
50
48
  export const NAME_TABLE = 'BTable'
51
49
  export const NAME_TABLE_CELL = 'BTableCell'
@@ -1,12 +1,13 @@
1
1
  # Toggle
2
2
 
3
- > `v-b-toggle` is a light-weight directive for toggling the visibility of collapses,
4
- > and includes automated [WAI-ARIA accessibility](/docs/reference/accessibility) attribute handling.
3
+ > `v-b-toggle` is a light-weight directive for toggling the visibility of collapses, and includes
4
+ > automated [WAI-ARIA accessibility](?path=/docs/base-tooltip--docs#accessibility) attribute
5
+ > handling.
5
6
 
6
7
  ## Overview
7
8
 
8
9
  The `v-b-toggle` directive can be used on interactive elements, such as buttons and to toggle the
9
- visibility state of the [`<b-collapse>`](/docs/components/collapse) component.
10
+ visibility state of the [`<gl-collapse>`](?path=/docs/base-collapse--docs) component.
10
11
 
11
12
  Besides toggling the visibility of the target component, the directive automatically updates ARIA
12
13
  accessibility attributes on the element it is applied to so that they reflect the visibility state
@@ -141,6 +142,4 @@ via `v-model`, other controls with `v-b-toggle` directive, or CSS visibility).
141
142
 
142
143
  ## See also
143
144
 
144
- - [`<b-collapse>`](/docs/components/collapse) Collapsible content with accordion support
145
- - [`<b-navbar-toggle>`](/docs/components/navbar#b-navbar-toggle-and-b-collapse-is-nav) Navbar
146
- hamburger toggle button (based on `v-b-toggle` directive)
145
+ - [collapse](?path=/docs/base-collapse--docs) Collapsible content with accordion support
@@ -515,7 +515,7 @@ disabled.
515
515
 
516
516
  ## See also
517
517
 
518
- - [`<b-tooltip>` component](/docs/components/tooltip)
519
- - [`<b-popover>` component](/docs/components/popover)
518
+ - [tooltip](?path=/docs/base-tooltip--docs)
519
+ - [popover](?path=/docs/base-popover--docs)
520
520
 
521
521
  <!-- Directive reference section auto generated from directive package.json -->
@@ -135,10 +135,6 @@ export { BNavbarBrand } from './components/navbar/navbar-brand'
135
135
  // export * from './components/popover'
136
136
  export { BPopover } from './components/popover/popover'
137
137
 
138
- // export * from './components/progress'
139
- export { BProgress } from './components/progress/progress'
140
- export { BProgressBar } from './components/progress/progress-bar'
141
-
142
138
  // export * from './components/table'
143
139
  export { BTable } from './components/table/table'
144
140
  export { BTableLite } from './components/table/table-lite'
@@ -1,2 +0,0 @@
1
- export { BProgress } from './progress';
2
- export { BProgressBar } from './progress-bar';
@@ -1,128 +0,0 @@
1
- import { extend } from '../../vue';
2
- import { NAME_PROGRESS_BAR } from '../../constants/components';
3
- import { PROP_TYPE_BOOLEAN, PROP_TYPE_STRING, PROP_TYPE_NUMBER_STRING } from '../../constants/props';
4
- import { htmlOrText } from '../../utils/html';
5
- import { isBoolean } from '../../utils/inspect';
6
- import { mathMax, mathPow } from '../../utils/math';
7
- import { toFloat, toInteger, toFixed } from '../../utils/number';
8
- import { makePropsConfigurable, makeProp } from '../../utils/props';
9
- import { toString } from '../../utils/string';
10
- import { normalizeSlotMixin } from '../../mixins/normalize-slot';
11
-
12
- // --- Props ---
13
-
14
- const props = makePropsConfigurable({
15
- animated: makeProp(PROP_TYPE_BOOLEAN, null),
16
- label: makeProp(PROP_TYPE_STRING),
17
- labelHtml: makeProp(PROP_TYPE_STRING),
18
- max: makeProp(PROP_TYPE_NUMBER_STRING, null),
19
- precision: makeProp(PROP_TYPE_NUMBER_STRING, null),
20
- showProgress: makeProp(PROP_TYPE_BOOLEAN, null),
21
- showValue: makeProp(PROP_TYPE_BOOLEAN, null),
22
- striped: makeProp(PROP_TYPE_BOOLEAN, null),
23
- value: makeProp(PROP_TYPE_NUMBER_STRING, 0),
24
- variant: makeProp(PROP_TYPE_STRING)
25
- }, NAME_PROGRESS_BAR);
26
-
27
- // --- Main component ---
28
-
29
- // @vue/component
30
- const BProgressBar = /*#__PURE__*/extend({
31
- name: NAME_PROGRESS_BAR,
32
- mixins: [normalizeSlotMixin],
33
- inject: {
34
- getBvProgress: {
35
- default: /* istanbul ignore next */() => () => ({})
36
- }
37
- },
38
- props,
39
- computed: {
40
- bvProgress() {
41
- return this.getBvProgress();
42
- },
43
- progressBarClasses() {
44
- const {
45
- computedAnimated,
46
- computedVariant
47
- } = this;
48
- return [computedVariant ? `bg-${computedVariant}` : '', this.computedStriped || computedAnimated ? 'progress-bar-striped' : '', computedAnimated ? 'progress-bar-animated' : ''];
49
- },
50
- progressBarStyles() {
51
- return {
52
- width: 100 * (this.computedValue / this.computedMax) + '%'
53
- };
54
- },
55
- computedValue() {
56
- return toFloat(this.value, 0);
57
- },
58
- computedMax() {
59
- // Prefer our max over parent setting
60
- // Default to `100` for invalid values (`-x`, `0`, `NaN`)
61
- const max = toFloat(this.max) || toFloat(this.bvProgress.max, 0);
62
- return max > 0 ? max : 100;
63
- },
64
- computedPrecision() {
65
- // Prefer our precision over parent setting
66
- // Default to `0` for invalid values (`-x`, `NaN`)
67
- return mathMax(toInteger(this.precision, toInteger(this.bvProgress.precision, 0)), 0);
68
- },
69
- computedProgress() {
70
- const precision = this.computedPrecision;
71
- const p = mathPow(10, precision);
72
- return toFixed(100 * p * this.computedValue / this.computedMax / p, precision);
73
- },
74
- computedVariant() {
75
- // Prefer our variant over parent setting
76
- return this.variant || this.bvProgress.variant;
77
- },
78
- computedStriped() {
79
- // Prefer our striped over parent setting
80
- return isBoolean(this.striped) ? this.striped : this.bvProgress.striped || false;
81
- },
82
- computedAnimated() {
83
- // Prefer our animated over parent setting
84
- return isBoolean(this.animated) ? this.animated : this.bvProgress.animated || false;
85
- },
86
- computedShowProgress() {
87
- // Prefer our showProgress over parent setting
88
- return isBoolean(this.showProgress) ? this.showProgress : this.bvProgress.showProgress || false;
89
- },
90
- computedShowValue() {
91
- // Prefer our showValue over parent setting
92
- return isBoolean(this.showValue) ? this.showValue : this.bvProgress.showValue || false;
93
- }
94
- },
95
- render(h) {
96
- const {
97
- label,
98
- labelHtml,
99
- computedValue,
100
- computedPrecision
101
- } = this;
102
- let $children;
103
- let domProps = {};
104
- if (this.hasNormalizedSlot()) {
105
- $children = this.normalizeSlot();
106
- } else if (label || labelHtml) {
107
- domProps = htmlOrText(labelHtml, label);
108
- } else if (this.computedShowProgress) {
109
- $children = this.computedProgress;
110
- } else if (this.computedShowValue) {
111
- $children = toFixed(computedValue, computedPrecision);
112
- }
113
- return h('div', {
114
- staticClass: 'progress-bar',
115
- class: this.progressBarClasses,
116
- style: this.progressBarStyles,
117
- attrs: {
118
- role: 'progressbar',
119
- 'aria-valuemin': '0',
120
- 'aria-valuemax': toString(this.computedMax),
121
- 'aria-valuenow': toFixed(computedValue, computedPrecision)
122
- },
123
- domProps
124
- }, $children);
125
- }
126
- });
127
-
128
- export { BProgressBar, props };
@@ -1,56 +0,0 @@
1
- import { extend } from '../../vue';
2
- import { NAME_PROGRESS } from '../../constants/components';
3
- import { PROP_TYPE_BOOLEAN, PROP_TYPE_STRING, PROP_TYPE_NUMBER_STRING } from '../../constants/props';
4
- import { omit, sortKeys } from '../../utils/object';
5
- import { makePropsConfigurable, makeProp, pluckProps } from '../../utils/props';
6
- import { normalizeSlotMixin } from '../../mixins/normalize-slot';
7
- import { props as props$1, BProgressBar } from './progress-bar';
8
-
9
- // --- Props ---
10
-
11
- const progressBarProps = omit(props$1, ['label', 'labelHtml']);
12
- const props = makePropsConfigurable(sortKeys({
13
- ...progressBarProps,
14
- animated: makeProp(PROP_TYPE_BOOLEAN, false),
15
- height: makeProp(PROP_TYPE_STRING),
16
- max: makeProp(PROP_TYPE_NUMBER_STRING, 100),
17
- precision: makeProp(PROP_TYPE_NUMBER_STRING, 0),
18
- showProgress: makeProp(PROP_TYPE_BOOLEAN, false),
19
- showValue: makeProp(PROP_TYPE_BOOLEAN, false),
20
- striped: makeProp(PROP_TYPE_BOOLEAN, false)
21
- }), NAME_PROGRESS);
22
-
23
- // --- Main component ---
24
-
25
- // @vue/component
26
- const BProgress = /*#__PURE__*/extend({
27
- name: NAME_PROGRESS,
28
- mixins: [normalizeSlotMixin],
29
- provide() {
30
- return {
31
- getBvProgress: () => this
32
- };
33
- },
34
- props,
35
- computed: {
36
- progressHeight() {
37
- return {
38
- height: this.height || null
39
- };
40
- }
41
- },
42
- render(h) {
43
- let $childNodes = this.normalizeSlot();
44
- if (!$childNodes) {
45
- $childNodes = h(BProgressBar, {
46
- props: pluckProps(progressBarProps, this.$props)
47
- });
48
- }
49
- return h('div', {
50
- staticClass: 'progress',
51
- style: this.progressHeight
52
- }, [$childNodes]);
53
- }
54
- });
55
-
56
- export { BProgress, props };
@@ -1,164 +0,0 @@
1
- const { resolve } = require('path')
2
-
3
- // --- Constants ---
4
-
5
- const RX_UN_KEBAB = /-(\w)/g
6
- const RX_HYPHENATE = /\B([A-Z])/g
7
-
8
- // Path to index file when using bootstrap-vue source code
9
- const srcIndex = 'bootstrap-vue/src/index.js'
10
-
11
- // --- Utility methods ---
12
-
13
- // Converts PascalCase or camelCase to kebab-case
14
- const kebabCase = str => {
15
- return str.replace(RX_HYPHENATE, '-$1').toLowerCase()
16
- }
17
-
18
- // Converts a kebab-case or camelCase string to PascalCase
19
- const pascalCase = str => {
20
- str = kebabCase(str).replace(RX_UN_KEBAB, (_, c) => (c ? c.toUpperCase() : ''))
21
- return str.charAt(0).toUpperCase() + str.slice(1)
22
- }
23
-
24
- const pickFirst = (...args) => {
25
- for (const arg of args) {
26
- if (arg !== undefined) {
27
- return arg
28
- }
29
- }
30
- }
31
-
32
- // --- Main Nuxt.js module ---
33
- module.exports = function nuxtBootstrapVue(moduleOptions = {}) {
34
- this.nuxt.hook('build:before', () => {
35
- // Merge moduleOptions with default
36
- const options = {
37
- ...this.options.bootstrapVue,
38
- ...moduleOptions
39
- }
40
-
41
- // Ensure we have arrays
42
- this.options.css = [].concat(this.options.css || [])
43
- this.options.build.transpile = [].concat(this.options.build.transpile || [])
44
-
45
- const bootstrapVueCSS = pickFirst(
46
- options.bootstrapVueCSS,
47
- options.bootstrapVueCss,
48
- options.bvCSS,
49
- // Defaults to `true` if no other options provided
50
- true
51
- )
52
- if (bootstrapVueCSS) {
53
- // Add BootstrapVue CSS
54
- this.options.css.unshift('bootstrap-vue/dist/bootstrap-vue.css')
55
- }
56
-
57
- const bootstrapCSS = pickFirst(
58
- options.bootstrapCSS,
59
- options.bootstrapCss,
60
- options.css,
61
- // Defaults to `true` if no other options provided
62
- true
63
- )
64
- if (bootstrapCSS) {
65
- // Add Bootstrap CSS
66
- this.options.css.unshift('bootstrap/dist/css/bootstrap.css')
67
- }
68
-
69
- // Component src prop resolving
70
- this.options.build.loaders.vue.transformAssetUrls = {
71
- // Nuxt default is missing `poster` for video
72
- video: ['src', 'poster'],
73
- // Nuxt default is missing image
74
- image: 'xlink:href',
75
- // Ensure super supplied values/overrides are not lost
76
- ...this.options.build.loaders.vue.transformAssetUrls
77
- }
78
-
79
- // Enable transpilation of `src/` directory
80
- this.options.build.transpile.push('bootstrap-vue/src')
81
-
82
- // Use pre-transpiled or `src/`
83
- const usePretranspiled = pickFirst(options.usePretranspiled, this.options.dev, false)
84
- if (!usePretranspiled) {
85
- // Use bootstrap-vue source code for smaller prod builds
86
- // by aliasing 'bootstrap-vue' to the source files
87
- this.extendBuild(config => {
88
- if (!config.resolve.alias) {
89
- config.resolve.alias = {}
90
- }
91
- const index = require.resolve(srcIndex)
92
- const srcDir = index.replace(/index\.js$/, '')
93
- // We prepend a $ to ensure that it is only used for
94
- // `import from 'bootstrap-vue'` not `import from 'bootstrap-vue/*'`
95
- config.resolve.alias['bootstrap-vue$'] = index
96
- // If users are still cherry-picking modules from esm/ or es/ (legacy),
97
- // alias them to src/ to prevent duplicate code imports
98
- config.resolve.alias['bootstrap-vue/esm/'] = srcDir
99
- config.resolve.alias['bootstrap-vue/es/'] = srcDir
100
- })
101
- }
102
-
103
- // Base options available to template
104
- const templateOptions = {
105
- // Flag if we are tree shaking
106
- treeShake: false
107
- }
108
-
109
- // Specific component and/or directive plugins
110
- for (const type of ['componentPlugins', 'directivePlugins']) {
111
- const bvPlugins = Array.isArray(options[type]) ? options[type] : []
112
-
113
- templateOptions[type] = bvPlugins
114
- // Normalize plugin name to `${Name}Plugin` (component) or `VB${Name}Plugin` (directive)
115
- // Required for backwards compatibility with old plugin import names
116
- .map(plugin => {
117
- // Ensure PascalCase name
118
- plugin = pascalCase(plugin)
119
- // Ensure new naming convention for directive plugins prefixed with `VB`
120
- plugin = type === 'directivePlugins' && !/^VB/.test(plugin) ? `VB${plugin}` : plugin
121
- // Ensure prefixed with `Plugin`
122
- plugin = /Plugin$/.test(plugin) ? plugin : `${plugin}Plugin`
123
- return plugin
124
- })
125
- // Remove duplicate items
126
- .filter((plugin, i, arr) => arr.indexOf(plugin) === i)
127
-
128
- if (templateOptions[type].length > 0) {
129
- templateOptions.treeShake = true
130
- }
131
- }
132
-
133
- // Specific components and/or directives
134
- for (const type of ['components', 'directives']) {
135
- const ComponentsOrDirectives = Array.isArray(options[type]) ? options[type] : []
136
-
137
- templateOptions[type] = ComponentsOrDirectives
138
- // Ensure PascalCase name
139
- .map(item => pascalCase(item))
140
- // Ensure prefixed with `V`
141
- .map(item => (type === 'directives' && !/^V/.test(item) ? `V${item}` : item))
142
- // Remove duplicate items
143
- .filter((item, i, arr) => arr.indexOf(item) === i)
144
-
145
- if (templateOptions[type].length > 0) {
146
- templateOptions.treeShake = true
147
- }
148
- }
149
-
150
- // Add BootstrapVue configuration if present
151
- if (options.config && Object.prototype.toString.call(options.config) === '[object Object]') {
152
- templateOptions.config = { ...options.config }
153
- }
154
-
155
- // Register plugin, passing options to plugin template
156
- this.addPlugin({
157
- src: resolve(__dirname, 'plugin.template.js'),
158
- fileName: 'bootstrap-vue.js',
159
- options: templateOptions
160
- })
161
- })
162
- }
163
-
164
- module.exports.meta = require('../package.json')
@@ -1,29 +0,0 @@
1
- import Vue from 'vue';
2
-
3
- <% if (!options.treeShake) { %>
4
- import { BootstrapVue } from 'bootstrap-vue';
5
-
6
- Vue.use(BootstrapVue, <%= JSON.stringify(options.config || {}, undefined, 2) %>);
7
- <% } %>
8
- <% } %>
9
-
10
- <% if (options.treeShake) { %>
11
- import {
12
- <%= [].concat(
13
- options.config ? 'BVConfigPlugin' : null,
14
- options.componentPlugins,
15
- options.directivePlugins,
16
- options.components,
17
- options.directives
18
- ).filter(Boolean).join(',\n ') %>
19
- } from 'bootstrap-vue';
20
-
21
- <% if (options.config) { %>
22
- Vue.use(BVConfigPlugin, <%= JSON.stringify(options.config, undefined, 2) %>);
23
- <% } %>
24
-
25
- <%= options.componentPlugins.reduce((acc, plugin) => (acc += `Vue.use(${plugin});\n` ), '') %>
26
- <%= options.directivePlugins.reduce((acc, plugin) => (acc += `Vue.use(${plugin});\n` ), '') %>
27
- <%= options.components.reduce((acc, c) => (acc += `Vue.component('${c}', ${c});\n` ), '') %>
28
- <%= options.directives.reduce((acc, d) => (acc += `Vue.directive('${d.replace(/^VB/, 'B')}', ${d});\n` ), '') %>
29
- <% } %>
@@ -1,23 +0,0 @@
1
- # Modifications to Vendored Code
2
-
3
- **Library**: BootstrapVue
4
- **Version**: 2.23.1
5
-
6
- This file documents modifications made to the original BootstrapVue component files.
7
-
8
- ## Removed variants
9
-
10
- The following files have been modified from the original:
11
-
12
- - `README.md`: Removed variants.
13
-
14
- The following variants of the property `variant` have been removed as they are no longer supported
15
- in our implementation:
16
-
17
- - `secondary`
18
- - `info`
19
- - `light`
20
- - `dark`
21
-
22
- It was not necessary to adapt `.js` files for this change, as the propery `variant` accepts any
23
- string. It would still be technically possible to pass down one of the removed variants.