@gitlab/ui 32.45.0 → 32.48.0

package/src/components/utilities/intersperse/intersperse.stories.js

@@ -1,5 +1,3 @@
-import { array, text, withKnobs } from '@storybook/addon-knobs';
-import { documentedStoriesOf } from '../../../../documentation/documented_stories';
 import { GlIntersperse } from '../../../../index';
 import readme from './intersperse.md';
 
@@ -11,44 +9,46 @@ const template = `
   </div>
   `;
 
-function generateProps({
+const generateProps = ({
   separator = ', ',
   lastSeparator = '',
   items = ['Foo', 'Bar', 'Baz', 'Qaz'],
-} = {}) {
-  return {
-    items: {
-      default: array('items', items),
-    },
-    separator: {
-      default: text('separator', separator),
-    },
-    lastSeparator: {
-      default: text('lastSeparator', lastSeparator),
-    },
-  };
-}
+} = {}) => ({
+  separator,
+  lastSeparator,
+  items,
+});
 
-documentedStoriesOf('utilities/intersperse', readme)
-  .addDecorator(withKnobs)
-  .add('default', () => ({
-    props: generateProps(),
-    components: {
-      GlIntersperse,
-    },
-    template,
-  }))
-  .add('custom seperator', () => ({
-    props: generateProps({ separator: '-' }),
-    components: {
-      GlIntersperse,
-    },
-    template,
-  }))
-  .add('custom last separator', () => ({
-    props: generateProps({ lastSeparator: ' and ' }),
-    components: {
-      GlIntersperse,
+const Template = (args, { argTypes }) => ({
+  components: {
+    GlIntersperse,
+  },
+  props: Object.keys(argTypes),
+  template,
+});
+
+export const Default = Template.bind({});
+Default.args = generateProps();
+
+export default {
+  title: 'utilities/intersperse',
+  component: GlIntersperse,
+  parameters: {
+    knobs: { disable: true },
+    docs: {
+      description: {
+        component: readme,
+      },
     },
-    template,
-  }));
+  },
+};
+
+export const CustomSeparator = Template.bind({});
+CustomSeparator.args = generateProps({
+  separator: '-',
+});
+
+export const CustomLastSeparator = Template.bind({});
+CustomLastSeparator.args = generateProps({
+  lastSeparator: ' and ',
+});

package/dist/components/base/avatar_labeled/examples/avatar.labeled.example.js

@@ -1,38 +0,0 @@
-import __vue_normalize__ from 'vue-runtime-helpers/dist/normalize-component.js';
-
-/* script */
-
-/* template */
-var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('gl-avatar-labeled',{attrs:{"size":32,"src":"https://assets.gitlab-static.net/uploads/-/system/group/avatar/9970/logo-extra-whitespace.png?width=64","label":"GitLab User","sub-label":"gitlab"}})};
-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_scope_id__,
-    __vue_is_functional_template__,
-    __vue_module_identifier__,
-    false,
-    undefined,
-    undefined,
-    undefined
-  );
-
-export default __vue_component__;

package/dist/components/base/avatar_labeled/examples/avatar.labeled_badges.example.js

@@ -1,38 +0,0 @@
-import __vue_normalize__ from 'vue-runtime-helpers/dist/normalize-component.js';
-
-/* script */
-
-/* template */
-var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('gl-avatar-labeled',{attrs:{"size":32,"src":"https://assets.gitlab-static.net/uploads/-/system/group/avatar/9970/logo-extra-whitespace.png?width=64","label":"GitLab User","sub-label":"gitlab"},scopedSlots:_vm._u([{key:"meta",fn:function(){return [_c('div',{staticClass:"gl-p-1"},[_c('gl-badge',{staticClass:"gl-display-flex!",attrs:{"size":"sm","variant":"info"}},[_vm._v("2FA")])],1),_vm._v(" "),_c('div',{staticClass:"gl-p-1"},[_c('gl-badge',{staticClass:"gl-display-flex!",attrs:{"size":"sm","variant":"danger"}},[_vm._v("Blocked")])],1)]},proxy:true}])})};
-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_scope_id__,
-    __vue_is_functional_template__,
-    __vue_module_identifier__,
-    false,
-    undefined,
-    undefined,
-    undefined
-  );
-
-export default __vue_component__;

package/dist/components/base/avatar_labeled/examples/avatar.labeled_links.example.js

@@ -1,38 +0,0 @@
-import __vue_normalize__ from 'vue-runtime-helpers/dist/normalize-component.js';
-
-/* script */
-
-/* template */
-var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('gl-avatar-labeled',{attrs:{"size":32,"src":"https://assets.gitlab-static.net/uploads/-/system/group/avatar/9970/logo-extra-whitespace.png?width=64","label":"GitLab User","sub-label":"gitlab@example.com","label-link":"#","sub-label-link":"mailto:#"}})};
-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_scope_id__,
-    __vue_is_functional_template__,
-    __vue_module_identifier__,
-    false,
-    undefined,
-    undefined,
-    undefined
-  );
-
-export default __vue_component__;

package/dist/components/base/avatar_labeled/examples/avatar.labeled_tooltip.example.js

@@ -1,38 +0,0 @@
-import __vue_normalize__ from 'vue-runtime-helpers/dist/normalize-component.js';
-
-/* script */
-
-/* template */
-var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('gl-avatar-labeled',{directives:[{name:"gl-tooltip",rawName:"v-gl-tooltip",value:({ placement: 'bottom' }),expression:"{ placement: 'bottom' }"}],attrs:{"size":32,"src":"https://assets.gitlab-static.net/uploads/-/system/group/avatar/9970/logo-extra-whitespace.png?width=64","label":"GitLab User","sub-label":"gitlab","title":"Avatar labeled with tooltip"}})};
-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_scope_id__,
-    __vue_is_functional_template__,
-    __vue_module_identifier__,
-    false,
-    undefined,
-    undefined,
-    undefined
-  );
-
-export default __vue_component__;

package/dist/components/base/avatar_labeled/examples/index.js

@@ -1,31 +0,0 @@
-import AvatarLabeledExample from './avatar.labeled.example';
-import AvatarLabeledBadgesExample from './avatar.labeled_badges.example';
-import AvatarLabeledSlotsExample from './avatar.labeled_links.example';
-import AvatarLabeledTooltipExample from './avatar.labeled_tooltip.example';
-
-var index = [{
-  name: 'Basic',
-  items: [{
-    id: 'avatar-labeled',
-    name: 'Avatar Labeled',
-    description: 'Avatar with text labels',
-    component: AvatarLabeledExample
-  }, {
-    id: 'avatar-labeled-tooltip',
-    name: 'With tooltip',
-    description: 'Avatar labeled with tooltip',
-    component: AvatarLabeledTooltipExample
-  }, {
-    id: 'avatar-labeled-badges',
-    name: 'With badges',
-    description: 'Avatar labeled with badges',
-    component: AvatarLabeledBadgesExample
-  }, {
-    id: 'avatar-labeled-links',
-    name: 'With label links',
-    description: 'Avatar labeled with links',
-    component: AvatarLabeledSlotsExample
-  }]
-}];
-
-export default index;

package/dist/components/base/avatars_inline/examples/avatars.inline.example.js

@@ -1,58 +0,0 @@
-import __vue_normalize__ from 'vue-runtime-helpers/dist/normalize-component.js';
-
-var script = {
-  data() {
-    return {
-      avatars: [{
-        src: 'https://picsum.photos/id/1005/24'
-      }, {
-        src: 'https://picsum.photos/id/1006/24'
-      }, {
-        src: 'https://picsum.photos/id/1009/24'
-      }, {
-        src: 'https://picsum.photos/id/1011/24'
-      }, {
-        src: 'https://picsum.photos/id/1012/24'
-      }]
-    };
-  }
-
-};
-
-/* 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('gl-avatars-inline',{attrs:{"avatars":_vm.avatars,"collapsed":true,"avatar-size":24,"max-visible":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/avatars_inline/examples/avatars.inline_large.example.js

@@ -1,58 +0,0 @@
-import __vue_normalize__ from 'vue-runtime-helpers/dist/normalize-component.js';
-
-var script = {
-  data() {
-    return {
-      avatars: [{
-        src: 'https://picsum.photos/id/1005/32'
-      }, {
-        src: 'https://picsum.photos/id/1006/32'
-      }, {
-        src: 'https://picsum.photos/id/1009/32'
-      }, {
-        src: 'https://picsum.photos/id/1011/32'
-      }, {
-        src: 'https://picsum.photos/id/1012/32'
-      }]
-    };
-  }
-
-};
-
-/* 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('gl-avatars-inline',{attrs:{"avatars":_vm.avatars,"collapsed":true,"avatar-size":32,"max-visible":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/avatars_inline/examples/avatars.inline_links_and_tooltips.example.js

@@ -1,70 +0,0 @@
-import __vue_normalize__ from 'vue-runtime-helpers/dist/normalize-component.js';
-
-var script = {
-  data() {
-    return {
-      avatars: [{
-        src: 'https://picsum.photos/id/1005/32',
-        tooltip: 'Avatar 1',
-        href: '//gitlab.com'
-      }, {
-        src: 'https://picsum.photos/id/1006/32',
-        tooltip: 'Avatar 2',
-        href: '//gitlab.com'
-      }, {
-        src: 'https://picsum.photos/id/1009/32',
-        tooltip: 'Avatar 3',
-        href: '//gitlab.com'
-      }, {
-        src: 'https://picsum.photos/id/1011/32',
-        tooltip: 'Avatar 4',
-        href: '//gitlab.com'
-      }, {
-        src: 'https://picsum.photos/id/1012/32',
-        tooltip: 'Avatar 5',
-        href: '//gitlab.com'
-      }]
-    };
-  }
-
-};
-
-/* 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('gl-avatars-inline',{attrs:{"avatars":_vm.avatars,"collapsed":true,"avatar-size":32,"max-visible":2},scopedSlots:_vm._u([{key:"avatar",fn:function(ref){
-var avatar = ref.avatar;
-return [_c('gl-avatar-link',{directives:[{name:"gl-tooltip",rawName:"v-gl-tooltip"}],attrs:{"target":"blank","href":avatar.href,"title":avatar.tooltip}},[_c('gl-avatar',{attrs:{"src":avatar.src,"size":32}})],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/avatars_inline/examples/avatars.inline_links_and_tooltips_badge.example.js

@@ -1,70 +0,0 @@
-import __vue_normalize__ from 'vue-runtime-helpers/dist/normalize-component.js';
-
-var script = {
-  data() {
-    return {
-      avatars: [{
-        src: 'https://picsum.photos/id/1005/32',
-        tooltip: 'Avatar 1',
-        href: '//gitlab.com'
-      }, {
-        src: 'https://picsum.photos/id/1006/32',
-        tooltip: 'Avatar 2',
-        href: '//gitlab.com'
-      }, {
-        src: 'https://picsum.photos/id/1009/32',
-        tooltip: 'Avatar 3',
-        href: '//gitlab.com'
-      }, {
-        src: 'https://picsum.photos/id/1011/32',
-        tooltip: 'Avatar 4',
-        href: '//gitlab.com'
-      }, {
-        src: 'https://picsum.photos/id/1012/32',
-        tooltip: 'Avatar 5',
-        href: '//gitlab.com'
-      }]
-    };
-  }
-
-};
-
-/* 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('gl-avatars-inline',{attrs:{"avatars":_vm.avatars,"collapsed":true,"avatar-size":32,"max-visible":2,"badge-tooltip-prop":"tooltip","badge-tooltip-max-chars":20},scopedSlots:_vm._u([{key:"avatar",fn:function(ref){
-var avatar = ref.avatar;
-return [_c('gl-avatar-link',{directives:[{name:"gl-tooltip",rawName:"v-gl-tooltip"}],attrs:{"target":"_blank","href":avatar.href,"title":avatar.tooltip}},[_c('gl-avatar',{attrs:{"src":avatar.src,"size":32}})],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/avatars_inline/examples/index.js

@@ -1,31 +0,0 @@
-import AvatarsInlineExample from './avatars.inline.example';
-import AvatarsInlineLargeExample from './avatars.inline_large.example';
-import AvatarsInlineLinksAndTooltipsExample from './avatars.inline_links_and_tooltips.example';
-import AvatarsInlineLinksAndTooltipsBadgeExample from './avatars.inline_links_and_tooltips_badge.example';
-
-var index = [{
-  name: 'Basic',
-  items: [{
-    id: 'avatars-inline',
-    name: 'Avatars Inline',
-    description: 'Inline Avatars',
-    component: AvatarsInlineExample
-  }, {
-    id: 'avatars-inline-large',
-    name: 'Avatars Inline Large',
-    description: 'Inline Avatars Large',
-    component: AvatarsInlineLargeExample
-  }, {
-    id: 'avatars-inline-links-and-tooltips',
-    name: 'Avatars inline with links and tooltips',
-    description: 'Inline Avatars with Links and Tooltips',
-    component: AvatarsInlineLinksAndTooltipsExample
-  }, {
-    id: 'avatars-inline-links-and-tooltips-badge',
-    name: 'Avatars inline with tooltip on badge',
-    description: 'Inline Avatars with Tooltip on Badge',
-    component: AvatarsInlineLinksAndTooltipsBadgeExample
-  }]
-}];
-
-export default index;

package/dist/components/base/form/form_combobox/examples/form_combobox.basic.example.js

@@ -1,50 +0,0 @@
-import __vue_normalize__ from 'vue-runtime-helpers/dist/normalize-component.js';
-
-var script = {
-  tokens: ['giraffe', 'dog', 'dodo', 'komodo dragon', 'hippo', 'platypus', 'jackalope', 'quetzal', 'badger', 'vicuña', 'whale', 'xenarthra'],
-
-  data() {
-    return {
-      inputVal: ''
-    };
-  }
-
-};
-
-/* 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('gl-form-combobox',{attrs:{"token-list":_vm.$options.tokens,"label-text":"Animals We Tolerate"},model:{value:(_vm.inputVal),callback:function ($$v) {_vm.inputVal=$$v;},expression:"inputVal"}})};
-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/form/form_combobox/examples/index.js

@@ -1,13 +0,0 @@
-import BasicExample from './form_combobox.basic.example';
-
-var index = [{
-  name: 'Basic',
-  items: [{
-    id: 'form-combobox-basic',
-    name: 'Basic',
-    description: 'Basic Combobox',
-    component: BasicExample
-  }]
-}];
-
-export default index;

package/dist/components/base/form/input_group_text/examples/index.js

@@ -1,13 +0,0 @@
-import BasicExample from './input_group_text.basic.example';
-
-var index = [{
-  name: 'Basic',
-  items: [{
-    id: 'input-group-text-basic',
-    name: 'Basic',
-    description: 'Basic Input Group Text',
-    component: BasicExample
-  }]
-}];
-
-export default index;