@gitlab/ui 72.12.0 → 72.12.1

package/dist/components/base/breadcrumb/breadcrumb_item.js

@@ -0,0 +1,73 @@
+import { BLink } from 'bootstrap-vue/esm/index.js';
+import __vue_normalize__ from 'vue-runtime-helpers/dist/normalize-component.js';
+
+var script = {
+  name: 'GlBreadcrumbItem',
+  components: {
+    BLink
+  },
+  inheritAttrs: false,
+  props: {
+    text: {
+      type: String,
+      required: false,
+      default: null
+    },
+    to: {
+      type: [String, Object],
+      required: false,
+      default: null
+    },
+    href: {
+      type: String,
+      required: false,
+      default: null
+    },
+    ariaCurrent: {
+      type: [String, Boolean],
+      required: false,
+      default: false,
+      validator(value) {
+        return [false, 'page'].indexOf(value) !== -1;
+      }
+    }
+  }
+};
+
+/* script */
+const __vue_script__ = script;
+
+/* template */
+var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('li',{staticClass:"gl-breadcrumb-item"},[_c('b-link',{attrs:{"href":_vm.href,"to":_vm.to,"aria-current":_vm.ariaCurrent}},[_vm._t("default",function(){return [_vm._v(_vm._s(_vm.text))]})],2)],1)};
+var __vue_staticRenderFns__ = [];
+
+  /* style */
+  const __vue_inject_styles__ = undefined;
+  /* scoped */
+  const __vue_scope_id__ = undefined;
+  /* module identifier */
+  const __vue_module_identifier__ = undefined;
+  /* functional template */
+  const __vue_is_functional_template__ = false;
+  /* style inject */
+  
+  /* style inject SSR */
+  
+  /* style inject shadow dom */
+  
+
+  
+  const __vue_component__ = __vue_normalize__(
+    { render: __vue_render__, staticRenderFns: __vue_staticRenderFns__ },
+    __vue_inject_styles__,
+    __vue_script__,
+    __vue_scope_id__,
+    __vue_is_functional_template__,
+    __vue_module_identifier__,
+    false,
+    undefined,
+    undefined,
+    undefined
+  );
+
+export default __vue_component__;

package/dist/components/base/broadcast_message/broadcast_message.js

@@ -0,0 +1,112 @@
+import { colorThemes } from '../../../utils/constants';
+import CloseButton from '../../shared_components/close_button/close_button';
+import GlIcon from '../icon/icon';
+import { TYPE_BANNER, TYPE_LIST, TYPE_NOTIFICATION } from './constants';
+import __vue_normalize__ from 'vue-runtime-helpers/dist/normalize-component.js';
+
+var script = {
+  name: 'GlBroadcastMessage',
+  components: {
+    CloseButton,
+    GlIcon
+  },
+  props: {
+    /**
+     * The icon to show next to the text.
+     */
+    iconName: {
+      type: String,
+      required: false,
+      default: 'bullhorn'
+    },
+    /**
+     * Allow the broadcast message to be dismissed by a user.
+     */
+    dismissible: {
+      type: Boolean,
+      required: false,
+      default: true
+    },
+    /**
+     * The dismiss button's label, it is visible in mobile viewports and used for the button's aria-label attribute.
+     */
+    dismissLabel: {
+      type: String,
+      required: false,
+      default: 'Dismiss'
+    },
+    /**
+     * The theme's name to use, this should correspond to the user's selected theme in GitLab.
+     */
+    theme: {
+      type: String,
+      required: false,
+      default: Object.keys(colorThemes)[0],
+      validator: value => Object.keys(colorThemes).includes(value)
+    },
+    /**
+     * The base layout to use. `notification` type broadcast messages are not compatible
+     with the `dismissible` or `theme` props.
+     */
+    type: {
+      type: String,
+      required: false,
+      default: TYPE_BANNER,
+      validator: value => TYPE_LIST.includes(value)
+    }
+  },
+  computed: {
+    showDismissButton() {
+      return this.dismissible || this.type === TYPE_NOTIFICATION;
+    }
+  },
+  methods: {
+    onDismiss() {
+      /**
+       * Emitted when the dismiss button is clicked.
+       *
+       * @event dismiss
+       * @type {object}
+       */
+      this.$emit('dismiss');
+    }
+  }
+};
+
+/* script */
+const __vue_script__ = script;
+
+/* template */
+var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:"gl-broadcast-message",class:(_vm.theme + " " + _vm.type)},[_c('div',{staticClass:"gl-broadcast-message-content"},[_c('div',{staticClass:"gl-broadcast-message-icon"},[_c('gl-icon',{attrs:{"name":_vm.iconName}})],1),_vm._v(" "),_c('div',{staticClass:"gl-broadcast-message-text"},[_c('h2',{staticClass:"gl-sr-only"},[_vm._v("Admin message")]),_vm._v(" "),_vm._t("default")],2)]),_vm._v(" "),(_vm.showDismissButton)?_c('close-button',{ref:"dismiss",staticClass:"gl-close-btn-color-inherit gl-broadcast-message-dismiss",attrs:{"label":_vm.dismissLabel},on:{"click":_vm.onDismiss}}):_vm._e()],1)};
+var __vue_staticRenderFns__ = [];
+
+  /* style */
+  const __vue_inject_styles__ = undefined;
+  /* scoped */
+  const __vue_scope_id__ = undefined;
+  /* module identifier */
+  const __vue_module_identifier__ = undefined;
+  /* functional template */
+  const __vue_is_functional_template__ = false;
+  /* style inject */
+  
+  /* style inject SSR */
+  
+  /* style inject shadow dom */
+  
+
+  
+  const __vue_component__ = __vue_normalize__(
+    { render: __vue_render__, staticRenderFns: __vue_staticRenderFns__ },
+    __vue_inject_styles__,
+    __vue_script__,
+    __vue_scope_id__,
+    __vue_is_functional_template__,
+    __vue_module_identifier__,
+    false,
+    undefined,
+    undefined,
+    undefined
+  );
+
+export default __vue_component__;

package/dist/components/base/broadcast_message/constants.js

@@ -0,0 +1,5 @@
+const TYPE_BANNER = 'banner';
+const TYPE_NOTIFICATION = 'notification';
+const TYPE_LIST = [TYPE_BANNER, TYPE_NOTIFICATION];
+
+export { TYPE_BANNER, TYPE_LIST, TYPE_NOTIFICATION };

package/dist/components/base/button/button.js

@@ -0,0 +1,151 @@
+import { BButton } from 'bootstrap-vue/esm/index.js';
+import { buttonCategoryOptions, buttonVariantOptions, buttonSizeOptions } from '../../../utils/constants';
+import { logWarning } from '../../../utils/utils';
+import { isSlotEmpty } from '../../../utils/is_slot_empty';
+import { SafeLinkMixin } from '../../mixins/safe_link_mixin';
+import GlIcon from '../icon/icon';
+import GlLoadingIcon from '../loading_icon/loading_icon';
+import __vue_normalize__ from 'vue-runtime-helpers/dist/normalize-component.js';
+
+//
+var script = {
+  name: 'GlButton',
+  components: {
+    BButton,
+    GlIcon,
+    GlLoadingIcon
+  },
+  mixins: [SafeLinkMixin],
+  props: {
+    category: {
+      type: String,
+      required: false,
+      default: buttonCategoryOptions.primary,
+      validator: value => Object.keys(buttonCategoryOptions).includes(value)
+    },
+    variant: {
+      type: String,
+      required: false,
+      default: buttonVariantOptions.default,
+      validator: value => Object.keys(buttonVariantOptions).includes(value)
+    },
+    size: {
+      type: String,
+      required: false,
+      default: 'medium',
+      validator: value => Object.keys(buttonSizeOptions).includes(value)
+    },
+    selected: {
+      type: Boolean,
+      required: false,
+      default: false
+    },
+    icon: {
+      type: String,
+      required: false,
+      default: ''
+    },
+    label: {
+      type: Boolean,
+      required: false,
+      default: false
+    },
+    loading: {
+      type: Boolean,
+      required: false,
+      default: false
+    },
+    buttonTextClasses: {
+      type: String,
+      required: false,
+      default: ''
+    },
+    block: {
+      type: Boolean,
+      required: false,
+      default: false
+    },
+    disabled: {
+      type: Boolean,
+      required: false,
+      default: false
+    }
+  },
+  computed: {
+    hasIcon() {
+      return this.icon !== '';
+    },
+    hasIconOnly() {
+      return isSlotEmpty(this, 'default') && this.hasIcon;
+    },
+    isButtonDisabled() {
+      return this.disabled || this.loading;
+    },
+    buttonClasses() {
+      const classes = ['gl-button'];
+      const nonCategoryVariants = [buttonVariantOptions.dashed, buttonVariantOptions.link, buttonVariantOptions.reset];
+      if (!nonCategoryVariants.includes(this.variant) && this.category !== buttonCategoryOptions.primary) {
+        classes.push(`btn-${this.variant}-${this.category}`);
+      }
+      classes.push({
+        'btn-icon': this.hasIconOnly,
+        'button-ellipsis-horizontal': this.hasIconOnly && this.icon === 'ellipsis_h',
+        selected: this.selected
+      });
+      if (this.label) {
+        classes.push('btn', 'btn-label', `btn-${this.buttonSize}`);
+      }
+      return classes;
+    },
+    buttonSize() {
+      return buttonSizeOptions[this.size];
+    },
+    displayBlock() {
+      return !this.label && this.block;
+    }
+  },
+  mounted() {
+    // eslint-disable-next-line @gitlab/vue-prefer-dollar-scopedslots
+    if (!this.$slots.default && !this.$attrs['aria-label'] && !this.$props.label) {
+      logWarning('[gl-button]: Accessible name missing. Please add inner text or aria-label.', this.$el);
+    }
+  }
+};
+
+/* script */
+const __vue_script__ = script;
+
+/* template */
+var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c(_vm.label ? 'span' : 'b-button',_vm._g(_vm._b({directives:[{name:"safe-link",rawName:"v-safe-link:[safeLinkConfig]",arg:_vm.safeLinkConfig}],tag:"component",class:_vm.buttonClasses,attrs:{"block":_vm.displayBlock,"target":_vm.target,"variant":_vm.variant,"size":_vm.buttonSize,"disabled":_vm.isButtonDisabled}},'component',_vm.$attrs,false),_vm.$listeners),[(_vm.loading)?_c('gl-loading-icon',{staticClass:"gl-button-icon gl-button-loading-indicator",attrs:{"inline":""}}):_vm._e(),_vm._v(" "),(_vm.hasIcon && !(_vm.hasIconOnly && _vm.loading))?_c('gl-icon',{staticClass:"gl-button-icon",attrs:{"name":_vm.icon}}):_vm._e(),_vm._v(" "),_vm._t("emoji"),_vm._v(" "),(!_vm.hasIconOnly)?_c('span',{staticClass:"gl-button-text",class:_vm.buttonTextClasses},[_vm._t("default")],2):_vm._e()],2)};
+var __vue_staticRenderFns__ = [];
+
+  /* style */
+  const __vue_inject_styles__ = undefined;
+  /* scoped */
+  const __vue_scope_id__ = undefined;
+  /* module identifier */
+  const __vue_module_identifier__ = undefined;
+  /* functional template */
+  const __vue_is_functional_template__ = false;
+  /* style inject */
+  
+  /* style inject SSR */
+  
+  /* style inject shadow dom */
+  
+
+  
+  const __vue_component__ = __vue_normalize__(
+    { render: __vue_render__, staticRenderFns: __vue_staticRenderFns__ },
+    __vue_inject_styles__,
+    __vue_script__,
+    __vue_scope_id__,
+    __vue_is_functional_template__,
+    __vue_module_identifier__,
+    false,
+    undefined,
+    undefined,
+    undefined
+  );
+
+export default __vue_component__;

package/dist/components/base/button_group/button_group.js

@@ -0,0 +1,47 @@
+import { BButtonGroup } from 'bootstrap-vue/esm/index.js';
+import __vue_normalize__ from 'vue-runtime-helpers/dist/normalize-component.js';
+
+var script = {
+  name: 'GlButtonGroup',
+  components: {
+    BButtonGroup
+  }
+};
+
+/* script */
+const __vue_script__ = script;
+
+/* template */
+var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('b-button-group',_vm._g(_vm._b({},'b-button-group',_vm.$attrs,false),_vm.$listeners),[_vm._t("default")],2)};
+var __vue_staticRenderFns__ = [];
+
+  /* style */
+  const __vue_inject_styles__ = undefined;
+  /* scoped */
+  const __vue_scope_id__ = undefined;
+  /* module identifier */
+  const __vue_module_identifier__ = undefined;
+  /* functional template */
+  const __vue_is_functional_template__ = false;
+  /* style inject */
+  
+  /* style inject SSR */
+  
+  /* style inject shadow dom */
+  
+
+  
+  const __vue_component__ = __vue_normalize__(
+    { render: __vue_render__, staticRenderFns: __vue_staticRenderFns__ },
+    __vue_inject_styles__,
+    __vue_script__,
+    __vue_scope_id__,
+    __vue_is_functional_template__,
+    __vue_module_identifier__,
+    false,
+    undefined,
+    undefined,
+    undefined
+  );
+
+export default __vue_component__;

package/dist/components/base/card/card.js

@@ -0,0 +1,71 @@
+import __vue_normalize__ from 'vue-runtime-helpers/dist/normalize-component.js';
+
+//
+
+var script = {
+  name: 'GlCard',
+  props: {
+    /**
+     * Additional CSS class(es) to be applied to the header.
+     */
+    headerClass: {
+      type: [String, Object, Array],
+      required: false,
+      default: ''
+    },
+    /**
+     * Additional CSS class(es) to be applied to the body.
+     */
+    bodyClass: {
+      type: [String, Object, Array],
+      required: false,
+      default: ''
+    },
+    /**
+     * Additional CSS class(es) to be applied to the footer.
+     */
+    footerClass: {
+      type: [String, Object, Array],
+      required: false,
+      default: ''
+    }
+  }
+};
+
+/* script */
+const __vue_script__ = script;
+
+/* template */
+var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:"gl-card"},[(_vm.$scopedSlots.header)?_c('div',{staticClass:"gl-card-header",class:_vm.headerClass},[_vm._t("header")],2):_vm._e(),_vm._v(" "),_c('div',{staticClass:"gl-card-body",class:_vm.bodyClass},[_vm._t("default")],2),_vm._v(" "),(_vm.$scopedSlots.footer)?_c('div',{staticClass:"gl-card-footer",class:_vm.footerClass},[_vm._t("footer")],2):_vm._e()])};
+var __vue_staticRenderFns__ = [];
+
+  /* style */
+  const __vue_inject_styles__ = undefined;
+  /* scoped */
+  const __vue_scope_id__ = undefined;
+  /* module identifier */
+  const __vue_module_identifier__ = undefined;
+  /* functional template */
+  const __vue_is_functional_template__ = false;
+  /* style inject */
+  
+  /* style inject SSR */
+  
+  /* style inject shadow dom */
+  
+
+  
+  const __vue_component__ = __vue_normalize__(
+    { render: __vue_render__, staticRenderFns: __vue_staticRenderFns__ },
+    __vue_inject_styles__,
+    __vue_script__,
+    __vue_scope_id__,
+    __vue_is_functional_template__,
+    __vue_module_identifier__,
+    false,
+    undefined,
+    undefined,
+    undefined
+  );
+
+export default __vue_component__;

package/dist/components/base/carousel/carousel.js

@@ -0,0 +1,48 @@
+import { BCarousel } from 'bootstrap-vue/esm/index.js';
+import __vue_normalize__ from 'vue-runtime-helpers/dist/normalize-component.js';
+
+//
+var script = {
+  name: 'GlCarousel',
+  components: {
+    BCarousel
+  }
+};
+
+/* script */
+const __vue_script__ = script;
+
+/* template */
+var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('b-carousel',_vm._g(_vm._b({scopedSlots:_vm._u([_vm._l((Object.keys(_vm.$slots)),function(slot){return {key:slot,fn:function(){return [_vm._t(slot)]},proxy:true}})],null,true)},'b-carousel',_vm.$attrs,false),_vm.$listeners))};
+var __vue_staticRenderFns__ = [];
+
+  /* style */
+  const __vue_inject_styles__ = undefined;
+  /* scoped */
+  const __vue_scope_id__ = undefined;
+  /* module identifier */
+  const __vue_module_identifier__ = undefined;
+  /* functional template */
+  const __vue_is_functional_template__ = false;
+  /* style inject */
+  
+  /* style inject SSR */
+  
+  /* style inject shadow dom */
+  
+
+  
+  const __vue_component__ = __vue_normalize__(
+    { render: __vue_render__, staticRenderFns: __vue_staticRenderFns__ },
+    __vue_inject_styles__,
+    __vue_script__,
+    __vue_scope_id__,
+    __vue_is_functional_template__,
+    __vue_module_identifier__,
+    false,
+    undefined,
+    undefined,
+    undefined
+  );
+
+export default __vue_component__;

package/dist/components/base/carousel/carousel_slide.js

@@ -0,0 +1,47 @@
+import { BCarouselSlide } from 'bootstrap-vue/esm/index.js';
+import __vue_normalize__ from 'vue-runtime-helpers/dist/normalize-component.js';
+
+var script = {
+  name: 'GlCarouselSlide',
+  components: {
+    BCarouselSlide
+  }
+};
+
+/* script */
+const __vue_script__ = script;
+
+/* template */
+var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('b-carousel-slide',_vm._g(_vm._b({scopedSlots:_vm._u([_vm._l((Object.keys(_vm.$slots)),function(slot){return {key:slot,fn:function(){return [_vm._t(slot)]},proxy:true}})],null,true)},'b-carousel-slide',_vm.$attrs,false),_vm.$listeners))};
+var __vue_staticRenderFns__ = [];
+
+  /* style */
+  const __vue_inject_styles__ = undefined;
+  /* scoped */
+  const __vue_scope_id__ = undefined;
+  /* module identifier */
+  const __vue_module_identifier__ = undefined;
+  /* functional template */
+  const __vue_is_functional_template__ = false;
+  /* style inject */
+  
+  /* style inject SSR */
+  
+  /* style inject shadow dom */
+  
+
+  
+  const __vue_component__ = __vue_normalize__(
+    { render: __vue_render__, staticRenderFns: __vue_staticRenderFns__ },
+    __vue_inject_styles__,
+    __vue_script__,
+    __vue_scope_id__,
+    __vue_is_functional_template__,
+    __vue_module_identifier__,
+    false,
+    undefined,
+    undefined,
+    undefined
+  );
+
+export default __vue_component__;

package/dist/components/base/collapse/collapse.js

@@ -0,0 +1,59 @@
+import { BCollapse } from 'bootstrap-vue/esm/index.js';
+import __vue_normalize__ from 'vue-runtime-helpers/dist/normalize-component.js';
+
+//
+var script = {
+  name: 'GlCollapse',
+  components: {
+    BCollapse
+  },
+  model: {
+    prop: 'visible',
+    event: 'input'
+  },
+  props: {
+    visible: {
+      type: Boolean,
+      default: false,
+      required: false
+    }
+  }
+};
+
+/* script */
+const __vue_script__ = script;
+
+/* template */
+var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('b-collapse',_vm._g(_vm._b({attrs:{"visible":_vm.visible}},'b-collapse',_vm.$attrs,false),_vm.$listeners),[_vm._t("default")],2)};
+var __vue_staticRenderFns__ = [];
+
+  /* style */
+  const __vue_inject_styles__ = undefined;
+  /* scoped */
+  const __vue_scope_id__ = undefined;
+  /* module identifier */
+  const __vue_module_identifier__ = undefined;
+  /* functional template */
+  const __vue_is_functional_template__ = false;
+  /* style inject */
+  
+  /* style inject SSR */
+  
+  /* style inject shadow dom */
+  
+
+  
+  const __vue_component__ = __vue_normalize__(
+    { render: __vue_render__, staticRenderFns: __vue_staticRenderFns__ },
+    __vue_inject_styles__,
+    __vue_script__,
+    __vue_scope_id__,
+    __vue_is_functional_template__,
+    __vue_module_identifier__,
+    false,
+    undefined,
+    undefined,
+    undefined
+  );
+
+export default __vue_component__;