@gitlab/ui 96.3.0 → 97.1.0

package/src/vendor/bootstrap-vue/src/components/progress/README.md

@@ -1,363 +0,0 @@
-# Progress
-
-> Use our custom progress component for displaying simple or complex progress bars, featuring
-> support for horizontally stacked bars, animated backgrounds, and text labels.
-
-```html
-<template>
-  <div>
-    <b-progress :value="value" :max="max" show-progress animated></b-progress>
-    <b-progress class="mt-2" :max="max" show-value>
-      <b-progress-bar :value="value * (6 / 10)" variant="success"></b-progress-bar>
-      <b-progress-bar :value="value * (2.5 / 10)" variant="warning"></b-progress-bar>
-      <b-progress-bar :value="value * (1.5 / 10)" variant="danger"></b-progress-bar>
-    </b-progress>
-
-    <b-button class="mt-3" @click="randomValue">Click me</b-button>
-  </div>
-</template>
-
-<script>
-  export default {
-    data() {
-      return {
-        value: 45,
-        max: 100
-      }
-    },
-    methods: {
-      randomValue() {
-        this.value = Math.random() * this.max
-      }
-    }
-  }
-</script>
-
-<!-- b-progress.vue -->
-```
-
-## Value
-
-Set the maximum value with the `max` prop (default is `100`), and the current value via the `value`
-prop (default `0`).
-
-When creating multiple bars in a single process, place the value prop on the individual
-`<b-progress-bar>` sub components (see the **Multiple Bars** section below for more details)
-
-## Labels
-
-Add labels to your progress bars by either enabling `show-progress` (percentage of max) or
-`show-value`for the current absolute value. You may also set the precision (number of digits after
-the decimal) via the `precision` prop (default is `0`digits after the decimal).
-
-```html
-<template>
-  <div>
-    <h5>No label</h5>
-    <b-progress :value="value" :max="max" class="mb-3"></b-progress>
-
-    <h5>Value label</h5>
-    <b-progress :value="value" :max="max" show-value class="mb-3"></b-progress>
-
-    <h5>Progress label</h5>
-    <b-progress :value="value" :max="max" show-progress class="mb-3"></b-progress>
-
-    <h5>Value label with precision</h5>
-    <b-progress :value="value" :max="max" :precision="2" show-value class="mb-3"></b-progress>
-
-    <h5>Progress label with precision</h5>
-    <b-progress :value="value" :max="max" :precision="2" show-progress class="mb-3"></b-progress>
-  </div>
-</template>
-
-<script>
-  export default {
-    data() {
-      return {
-        value: 33.333333333,
-        max: 50
-      }
-    }
-  }
-</script>
-
-<!-- b-progress-labels.vue -->
-```
-
-### Custom progress label
-
-Need more control over the label? Provide your own label by using the default slot within a
-`<b-progress-bar>` sub-component, or by using the `label` or `label-html` property on
-`<b-progress-bar>`:
-
-```html
-<template>
-  <div>
-    <h5>Custom label via default slot</h5>
-    <b-progress :max="max" height="2rem">
-      <b-progress-bar :value="value">
-        <span>Progress: <strong>{{ value.toFixed(2) }} / {{ max }}</strong></span>
-      </b-progress-bar>
-    </b-progress>
-
-    <h5 class="mt-3">Custom label via property</h5>
-    <b-progress :max="max">
-      <b-progress-bar :value="value" :label="`${((value / max) * 100).toFixed(2)}%`"></b-progress-bar>
-    </b-progress>
-
-    <h5 class="mt-3">Custom label via property (HTML support)</h5>
-    <b-progress :max="max">
-      <b-progress-bar :value="value" :label-html="`<del>${value}</del>`"></b-progress-bar>
-    </b-progress>
-  </div>
-</template>
-
-<script>
-  export default {
-    data() {
-      return {
-        value: 33.333333333,
-        max: 50
-      }
-    }
-  }
-</script>
-
-<!-- b-progress-custom-labels.vue -->
-```
-
-Precedence order for label methods (top-most has precedence):
-
-- default slot of `<b-progress-bar>`
-- `label` prop of `<b-progress-bar>`
-- `show-progress` prop of `<b-progress-bar>`
-- `show-value` prop of `<b-progress-bar>`
-- `show-progress` prop of `<b-progress>`
-- `show-value` prop of `<b-progress>`
-- no label
-
-## Width and height
-
-`<b-progress>` will always expand to the maximum with of its parent container. To change the width,
-place `<b-progress>` in a standard Bootstrap column or apply one of the standard Bootstrap width
-classes.
-
-```html
-<template>
-  <div>
-    <h5>Default width</h5>
-    <b-progress :value="value" class="mb-3"></b-progress>
-
-    <h5>Custom widths</h5>
-    <b-progress :value="value" class="w-75 mb-2"></b-progress>
-    <b-progress :value="value" class="w-50 mb-2"></b-progress>
-    <b-progress :value="value" class="w-25"></b-progress>
-  </div>
-</template>
-
-<script>
-  export default {
-    data() {
-      return {
-        value: 75
-      }
-    }
-  }
-</script>
-
-<!-- b-progress-width.vue -->
-```
-
-The height of the progress bar can be controlled with the `height` prop. The height value should be
-a standard CSS dimension (`px`, `rem`, `em`, etc.). The default height is `1rem`.
-
-```html
-<template>
-  <div>
-    <h5>Default height</h5>
-    <b-progress :value="value" show-progress class="mb-3"></b-progress>
-
-    <h5>Custom heights</h5>
-    <b-progress height="2rem" :value="value" show-progress class="mb-2"></b-progress>
-    <b-progress height="20px" :value="value" show-progress class="mb-2"></b-progress>
-    <b-progress height="2px" :value="value"></b-progress>
-  </div>
-</template>
-
-<script>
-  export default {
-    data() {
-      return {
-        value: 75
-      }
-    }
-  }
-</script>
-
-<!-- b-progress-height.vue -->
-```
-
-## Backgrounds
-
-Use background variants to change the appearance of individual progress bars. The default variant is
-`primary`.
-
-### Solid background variants
-
-```html
-<template>
-  <div>
-    <div v-for="bar in bars" class="row mb-1">
-      <div class="col-sm-2">{{ bar.variant }}:</div>
-      <div class="col-sm-10 pt-1">
-        <b-progress :value="bar.value" :variant="bar.variant" :key="bar.variant"></b-progress>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script>
-  export default {
-    data() {
-      return {
-        bars: [
-          { variant: 'success', value: 75 },
-          { variant: 'warning', value: 75 },
-          { variant: 'danger', value: 75 },
-          { variant: 'primary', value: 75 },
-        ],
-        timer: null
-      }
-    },
-    mounted() {
-      this.timer = setInterval(() => {
-        this.bars.forEach(bar => (bar.value = 25 + Math.random() * 75))
-      }, 2000)
-    },
-    beforeDestroy() {
-      clearInterval(this.timer)
-      this.timer = null
-    }
-  }
-</script>
-
-<!-- b-progress-backgrounds.vue -->
-```
-
-### Striped backgrounds
-
-Set `striped` to apply a stripe via CSS gradient over the progress bar's background variant.
-
-```html
-<template>
-  <div>
-    <b-progress :value="25" variant="success" :striped="striped"></b-progress>
-    <b-progress :value="75" variant="warning" :striped="striped" class="mt-2"></b-progress>
-    <b-progress :value="100" variant="danger" :striped="striped" class="mt-2"></b-progress>
-  </div>
-</template>
-
-<script>
-  export default {
-    data() {
-      return {
-        striped: true
-      }
-    }
-  }
-</script>
-
-<!-- b-progress-striped.vue -->
-```
-
-### Animated backgrounds
-
-The striped gradient can also be animated by setting the `animated`prop.
-
-```html
-<template>
-  <div>
-    <b-progress :value="25" variant="success" striped :animated="animate"></b-progress>
-    <b-progress :value="75" variant="warning" striped :animated="animate" class="mt-2"></b-progress>
-    <b-progress :value="100" variant="danger" :animated="animate" class="mt-3"></b-progress>
-  </div>
-</template>
-
-<script>
-  export default {
-    data() {
-      return {
-        animate: true
-      }
-    }
-  }
-</script>
-
-<!-- b-progress-animated.vue -->
-```
-
-Notes:
-
-- if `animated` is true, `striped` will automatically be enabled.
-- Animated progress bars don't work in Opera 12 — as they don't support CSS3 animations.
-- The animation effect of this component is dependent on the `prefers-reduced-motion` media query.
-  See the [reduced motion section of our accessibility documentation](/docs/reference/accessibility)
-  for additional details.
-
-## Multiple bars
-
-Include multiple `<b-progress-bar>` sub-components in a `<b-progress>` component to build a
-horizontally stacked set of progress bars.
-
-```html
-<template>
-  <div>
-    <b-progress :max="max" class="mb-3">
-      <b-progress-bar variant="primary" :value="values[0]"></b-progress-bar>
-      <b-progress-bar variant="success" :value="values[1]"></b-progress-bar>
-      <b-progress-bar variant="danger" :value="values[2]"></b-progress-bar>
-    </b-progress>
-
-    <b-progress show-progress :max="max" class="mb-3">
-      <b-progress-bar variant="primary" :value="values[0]"></b-progress-bar>
-      <b-progress-bar variant="success" :value="values[1]"></b-progress-bar>
-      <b-progress-bar variant="danger" :value="values[2]"></b-progress-bar>
-    </b-progress>
-
-    <b-progress show-value striped :max="max" class="mb-3">
-      <b-progress-bar variant="primary" :value="values[0]"></b-progress-bar>
-      <b-progress-bar variant="success" :value="values[1]"></b-progress-bar>
-      <b-progress-bar variant="danger" :value="values[2]"></b-progress-bar>
-    </b-progress>
-
-    <b-progress :max="max">
-      <b-progress-bar variant="primary" :value="values[0]" show-progress></b-progress-bar>
-      <b-progress-bar variant="success" :value="values[1]" animated show-progress></b-progress-bar>
-      <b-progress-bar variant="danger" :value="values[2]" striped show-progress></b-progress-bar>
-    </b-progress>
-  </div>
-</template>
-
-<script>
-  export default {
-    data() {
-      return {
-        values: [15, 30, 20],
-        max: 100
-      }
-    }
-  }
-</script>
-
-<!-- b-progress-multiple.vue -->
-```
-
-`<b-progress-bar>` will inherit most of the props from the `<b-progress>` parent component, but you
-can override any of the props by setting them on the `<b-progress-bar>`
-
-Notes:
-
-- `height`, if specified, should always set on the `<b-progress>` component.
-- `<b-progress-bar>` will not inherit `value` from `<b-progress>`.
-
-<!-- Component reference added automatically from component package.json -->

package/src/vendor/bootstrap-vue/src/components/progress/index.d.ts

@@ -1,10 +0,0 @@
-//
-// Progress
-//
-import { BvComponent } from '../../'
-
-// Component: b-progress
-export declare class BProgress extends BvComponent {}
-
-// Component: b-progress-bar
-export declare class BProgressBar extends BvComponent {}

package/src/vendor/bootstrap-vue/src/components/progress/index.js

@@ -1,4 +0,0 @@
-import { BProgress } from './progress'
-import { BProgressBar } from './progress-bar'
-
-export { BProgress, BProgressBar }

package/src/vendor/bootstrap-vue/src/components/progress/package.json

@@ -1,109 +0,0 @@
-{
-  "name": "@bootstrap-vue/progress",
-  "version": "1.0.0",
-  "meta": {
-    "title": "Progress",
-    "description": "A custom progress component for displaying simple or complex progress bars, featuring support for horizontally stacked bars, animated backgrounds, and text labels.",
-    "components": [
-      {
-        "component": "BProgress",
-        "props": [
-          {
-            "prop": "animated",
-            "description": "Enable the animated background. Also automatically sets 'striped'"
-          },
-          {
-            "prop": "height",
-            "description": "Override the default height by specifying a CSS height value (including units)"
-          },
-          {
-            "prop": "max",
-            "description": "Set the maximum value"
-          },
-          {
-            "prop": "precision",
-            "description": "The number of digits after the decimal to round the value to"
-          },
-          {
-            "prop": "showProgress",
-            "description": "Displays the current progress value as a percentage"
-          },
-          {
-            "prop": "showValue",
-            "description": "Displays the current progress value"
-          },
-          {
-            "prop": "striped",
-            "description": "Enable the striped background"
-          },
-          {
-            "prop": "value",
-            "description": "The current value of the progress bar"
-          },
-          {
-            "prop": "variant",
-            "description": "Applies one of the Bootstrap theme color variants to the component"
-          }
-        ],
-        "slots": [
-          {
-            "name": "default",
-            "description": "Content (progress bars) to place in the progress element"
-          }
-        ]
-      },
-      {
-        "component": "BProgressBar",
-        "props": [
-          {
-            "prop": "animated",
-            "description": "Enable the animated background. Also automatically sets 'striped'"
-          },
-          {
-            "prop": "label",
-            "description": "Text string to explicitly set the label as"
-          },
-          {
-            "prop": "labelHtml",
-            "description": "HTML string to explicitly set the label as",
-            "xss": true
-          },
-          {
-            "prop": "max",
-            "description": "Set the maximum value"
-          },
-          {
-            "prop": "precision",
-            "description": "The number of digits after the decimal to round the value to"
-          },
-          {
-            "prop": "showProgress",
-            "description": "Displays the current progress value as a percentage"
-          },
-          {
-            "prop": "showValue",
-            "description": "Displays the current progress value"
-          },
-          {
-            "prop": "striped",
-            "description": "Enable the striped background"
-          },
-          {
-            "prop": "value",
-            "description": "The current value of the progress bar"
-          },
-          {
-            "prop": "variant",
-            "description": "Applies one of the Bootstrap theme color variants to the component"
-          }
-        ],
-        "slots": [
-          {
-            "name": "default",
-            "description": "Content to place in the progress bar. Overrides the `label`, `label-html`, `show-progress` and `show-value` props"
-          }
-        ]
-      }
-    ]
-  }
-}

package/src/vendor/bootstrap-vue/src/components/progress/progress-bar.js

@@ -1,133 +0,0 @@
-import { extend } from '../../vue'
-import { NAME_PROGRESS_BAR } from '../../constants/components'
-import { PROP_TYPE_BOOLEAN, PROP_TYPE_NUMBER_STRING, PROP_TYPE_STRING } from '../../constants/props'
-import { htmlOrText } from '../../utils/html'
-import { isBoolean } from '../../utils/inspect'
-import { mathMax, mathPow } from '../../utils/math'
-import { toFixed, toFloat, toInteger } from '../../utils/number'
-import { makeProp, makePropsConfigurable } from '../../utils/props'
-import { toString } from '../../utils/string'
-import { normalizeSlotMixin } from '../../mixins/normalize-slot'
-
-// --- Props ---
-
-export const props = makePropsConfigurable(
-  {
-    animated: makeProp(PROP_TYPE_BOOLEAN, null),
-    label: makeProp(PROP_TYPE_STRING),
-    labelHtml: makeProp(PROP_TYPE_STRING),
-    max: makeProp(PROP_TYPE_NUMBER_STRING, null),
-    precision: makeProp(PROP_TYPE_NUMBER_STRING, null),
-    showProgress: makeProp(PROP_TYPE_BOOLEAN, null),
-    showValue: makeProp(PROP_TYPE_BOOLEAN, null),
-    striped: makeProp(PROP_TYPE_BOOLEAN, null),
-    value: makeProp(PROP_TYPE_NUMBER_STRING, 0),
-    variant: makeProp(PROP_TYPE_STRING)
-  },
-  NAME_PROGRESS_BAR
-)
-
-// --- Main component ---
-
-// @vue/component
-export const BProgressBar = /*#__PURE__*/ extend({
-  name: NAME_PROGRESS_BAR,
-  mixins: [normalizeSlotMixin],
-  inject: {
-    getBvProgress: {
-      default: /* istanbul ignore next */ () => () => ({})
-    }
-  },
-  props,
-  computed: {
-    bvProgress() {
-      return this.getBvProgress()
-    },
-    progressBarClasses() {
-      const { computedAnimated, computedVariant } = this
-      return [
-        computedVariant ? `bg-${computedVariant}` : '',
-        this.computedStriped || computedAnimated ? 'progress-bar-striped' : '',
-        computedAnimated ? 'progress-bar-animated' : ''
-      ]
-    },
-    progressBarStyles() {
-      return {
-        width: 100 * (this.computedValue / this.computedMax) + '%'
-      }
-    },
-    computedValue() {
-      return toFloat(this.value, 0)
-    },
-    computedMax() {
-      // Prefer our max over parent setting
-      // Default to `100` for invalid values (`-x`, `0`, `NaN`)
-      const max = toFloat(this.max) || toFloat(this.bvProgress.max, 0)
-      return max > 0 ? max : 100
-    },
-    computedPrecision() {
-      // Prefer our precision over parent setting
-      // Default to `0` for invalid values (`-x`, `NaN`)
-      return mathMax(toInteger(this.precision, toInteger(this.bvProgress.precision, 0)), 0)
-    },
-    computedProgress() {
-      const precision = this.computedPrecision
-      const p = mathPow(10, precision)
-      return toFixed((100 * p * this.computedValue) / this.computedMax / p, precision)
-    },
-    computedVariant() {
-      // Prefer our variant over parent setting
-      return this.variant || this.bvProgress.variant
-    },
-    computedStriped() {
-      // Prefer our striped over parent setting
-      return isBoolean(this.striped) ? this.striped : this.bvProgress.striped || false
-    },
-    computedAnimated() {
-      // Prefer our animated over parent setting
-      return isBoolean(this.animated) ? this.animated : this.bvProgress.animated || false
-    },
-    computedShowProgress() {
-      // Prefer our showProgress over parent setting
-      return isBoolean(this.showProgress)
-        ? this.showProgress
-        : this.bvProgress.showProgress || false
-    },
-    computedShowValue() {
-      // Prefer our showValue over parent setting
-      return isBoolean(this.showValue) ? this.showValue : this.bvProgress.showValue || false
-    }
-  },
-  render(h) {
-    const { label, labelHtml, computedValue, computedPrecision } = this
-
-    let $children
-    let domProps = {}
-    if (this.hasNormalizedSlot()) {
-      $children = this.normalizeSlot()
-    } else if (label || labelHtml) {
-      domProps = htmlOrText(labelHtml, label)
-    } else if (this.computedShowProgress) {
-      $children = this.computedProgress
-    } else if (this.computedShowValue) {
-      $children = toFixed(computedValue, computedPrecision)
-    }
-
-    return h(
-      'div',
-      {
-        staticClass: 'progress-bar',
-        class: this.progressBarClasses,
-        style: this.progressBarStyles,
-        attrs: {
-          role: 'progressbar',
-          'aria-valuemin': '0',
-          'aria-valuemax': toString(this.computedMax),
-          'aria-valuenow': toFixed(computedValue, computedPrecision)
-        },
-        domProps
-      },
-      $children
-    )
-  }
-})