@gitlab/ui 39.2.0 → 39.3.1

package/documentation/components_documentation.js

@@ -1,111 +0,0 @@
-// Component documentation
-// ADD EXPORTS - needed for yarn generate:component. Do not remove
-export { default as GlTableLiteDocumentation } from '../src/components/base/table_lite/table_lite.documentation';
-export { default as GlRichTextEditorDocumentation } from '../src/components/editors/rich_text_editor/rich_text_editor.documentation';
-export { default as GlKeysetPaginationDocumentation } from '../src/components/base/keyset_pagination/keyset_pagination.documentation';
-export { default as GlInputGroupTextDocumentation } from '../src/components/base/form/input_group_text/input_group_text.documentation';
-export { default as GlFormTextDocumentation } from '../src/components/base/form/form_text/form_text.documentation';
-export { default as GlFormComboboxDocumentation } from '../src/components/base/form/form_combobox/form_combobox.documentation';
-export { default as GlGaugeChartDocumentation } from '../src/components/charts/gauge/gauge.documentation';
-export { default as GlTokenSelectorDocumentation } from '../src/components/base/token_selector/token_selector.documentation';
-export { default as GlNavDocumentation } from '../src/components/base/nav/nav.documentation';
-export { default as GlFormCheckboxTreeDocumentation } from '../src/components/base/form/form_checkbox_tree/form_checkbox_tree.documentation';
-export { default as GlMarkdownDocumentation } from '../src/components/base/markdown/markdown.documentation';
-export { default as GlNavbarDocumentation } from '../src/components/base/navbar/navbar.documentation';
-export { default as GlIntersectionObserverDocumentation } from '../src/components/utilities/intersection_observer/intersection_observer.documentation';
-export { default as GlChartDocumentation } from '../src/components/charts/chart/chart.documentation';
-export { default as GlAreaChartDocumentation } from '../src/components/charts/area/area.documentation';
-export { default as GlLineChartDocumentation } from '../src/components/charts/line/line.documentation';
-export { default as GlSparklineChartDocumentation } from '../src/components/charts/sparkline/sparkline.documentation';
-export { default as GlChartSeriesLabelDocumentation } from '../src/components/charts/series_label/series_label.documentation';
-export { default as GlStackedColumnChartDocumentation } from '../src/components/charts/stacked_column/stacked_column.documentation';
-export { default as GlBarChartDocumentation } from '../src/components/charts/bar/bar.documentation';
-export { default as GlSingleStatDocumentation } from '../src/components/charts/single_stat/single_stat.documentation';
-export { default as GlChartTooltipDocumentation } from '../src/components/charts/tooltip/tooltip.documentation';
-export { default as GlToastDocumentation } from '../src/components/base/toast/toast.documentation';
-export { default as GlAvatarDocumentation } from '../src/components/base/avatar/avatar.documentation';
-export { default as GlAvatarsInlineDocumentation } from '../src/components/base/avatars_inline/avatars_inline.documentation';
-export { default as GlAvatarLinkDocumentation } from '../src/components/base/avatar_link/avatar_link.documentation';
-export { default as GlAvatarLabeledDocumentation } from '../src/components/base/avatar_labeled/avatar_labeled.documentation';
-export { default as GlColumnChartDocumentation } from '../src/components/charts/column/column.documentation';
-export { default as GlDiscreteScatterChartDocumentation } from '../src/components/charts/discrete_scatter/discrete_scatter.documentation';
-export { default as GlSkeletonLoadingDocumentation } from '../src/components/base/skeleton_loading/skeleton_loading.documentation';
-export { default as GlBadgeDocumentation } from '../src/components/base/badge/badge.documentation';
-export { default as GlButtonDocumentation } from '../src/components/base/button/button.documentation';
-export { default as GlLinkDocumentation } from '../src/components/base/link/link.documentation';
-export { default as GlLoadingIconDocumentation } from '../src/components/base/loading_icon/loading_icon.documentation';
-export { default as GlIconDocumentation } from '../src/components/base/icon/icon.documentation';
-export { default as GlModalDocumentation } from '../src/components/base/modal/modal.documentation';
-export { default as GlPaginationDocumentation } from '../src/components/base/pagination/pagination.documentation';
-export { default as GlPaginatedListDocumentation } from '../src/components/base/paginated_list/paginated_list.documentation';
-export { default as GlPathDocumentation } from '../src/components/base/path/path.documentation';
-export { default as GlPopoverDocumentation } from '../src/components/base/popover/popover.documentation';
-export { default as GlTooltipDocumentation } from '../src/components/base/tooltip/tooltip.documentation';
-export { default as GlDashboardSkeletonDocumentation } from '../src/components/regions/dashboard_skeleton/dashboard_skeleton.documentation';
-export { default as GlEmptyStateDocumentation } from '../src/components/regions/empty_state/empty_state.documentation';
-export { default as GlFormDocumentation } from '../src/components/base/form/form.documentation';
-export { default as GlFormInputDocumentation } from '../src/components/base/form/form_input/form_input.documentation';
-export { default as GlFormInputGroupDocumentation } from '../src/components/base/form/form_input_group/form_input_group.documentation';
-export { default as GlFormTextareaDocumentation } from '../src/components/base/form/form_textarea/form_textarea.documentation';
-export { default as GlFormGroupDocumentation } from '../src/components/base/form/form_group/form_group.documentation';
-export { default as GlFormRadioDocumentation } from '../src/components/base/form/form_radio/form_radio.documentation';
-export { default as GlFormRadioGroupDocumentation } from '../src/components/base/form/form_radio_group/form_radio_group.documentation';
-export { default as GlFormSelectDocumentation } from '../src/components/base/form/form_select/form_select.documentation';
-export { default as GlSearchBoxByTypeDocumentation } from '../src/components/base/search_box_by_type/search_box_by_type.documentation';
-export { default as GlSearchBoxByClickDocumentation } from '../src/components/base/search_box_by_click/search_box_by_click.documentation';
-export { default as GlDropdownDocumentation } from '../src/components/base/dropdown/dropdown.documentation';
-export { default as GlDropdownItemDocumentation } from '../src/components/base/dropdown/dropdown_item.documentation';
-export { default as GlTableDocumentation } from '../src/components/base/table/table.documentation';
-export { default as GlBreadcrumbDocumentation } from '../src/components/base/breadcrumb/breadcrumb.documentation';
-export { default as GlHeatmapDocumentation } from '../src/components/charts/heatmap/heatmap.documentation';
-export { default as GlTabsDocumentation } from '../src/components/base/tabs/tabs/tabs.documentation';
-export { default as GlButtonGroupDocumentation } from '../src/components/base/button_group/button_group.documentation';
-export { default as GlFormCheckboxDocumentation } from '../src/components/base/form/form_checkbox/form_checkbox.documentation';
-export { default as GlLabelDocumentation } from '../src/components/base/label/label.documentation';
-export { default as GlDatepickerDocumentation } from '../src/components/base/datepicker/datepicker.documentation';
-export { default as GlTokenDocumentation } from '../src/components/base/token/token.documentation';
-export { default as GlToggleDocumentation } from '../src/components/base/toggle/toggle.documentation';
-export { default as GlDaterangePickerDocumentation } from '../src/components/base/daterange_picker/daterange_picker.documentation';
-export { default as GlSortingDocumentation } from '../src/components/base/sorting/sorting.documentation';
-export { default as GlSortingItemDocumentation } from '../src/components/base/sorting/sorting_item.documentation';
-export { default as GlInfiniteScrollDocumentation } from '../src/components/base/infinite_scroll/infinite_scroll.documentation';
-export { default as GlAlertDocumentation } from '../src/components/base/alert/alert.documentation';
-export { default as GlSegmentedControlDocumentation } from '../src/components/base/segmented_control/segmented_control.documentation';
-export { default as GlSkeletonLoaderDocumentation } from '../src/components/base/skeleton_loader/skeleton_loader.documentation';
-export { default as GlDrawerDocumentation } from '../src/components/base/drawer/drawer.documentation';
-export { default as GlCardDocumentation } from '../src/components/base/card/card.documentation';
-export { default as GlOutsideDirectiveDocumentation } from '../src/directives/outside/outside.documentation';
-export { default as GlResizeObserverDirectiveDocumentation } from '../src/directives/resize_observer/resize_observer.documentation';
-export { default as GlBannerDocumentation } from '../src/components/base/banner/banner.documentation';
-export { default as GlFilteredSearchSuggestionDocumentation } from '../src/components/base/filtered_search/filtered_search_suggestion.documentation';
-export { default as GlFilteredSearchSuggestionListDocumentation } from '../src/components/base/filtered_search/filtered_search_suggestion_list.documentation';
-export { default as GlFilteredSearchTermDocumentation } from '../src/components/base/filtered_search/filtered_search_term.documentation';
-export { default as GlFilteredSearchTokenDocumentation } from '../src/components/base/filtered_search/filtered_search_token.documentation';
-export { default as GlFilteredSearchTokenSegmentDocumentation } from '../src/components/base/filtered_search/filtered_search_token_segment.documentation';
-export { default as GlFilteredSearchDocumentation } from '../src/components/base/filtered_search/filtered_search.documentation';
-export { default as GlBroadcastMessageDocumentation } from '../src/components/base/broadcast_message/broadcast_message.documentation';
-export { default as GlCollapseDocumentation } from '../src/components/base/collapse/collapse.documentation';
-export { default as GlAccordionDocumentation } from '../src/components/base/accordion/accordion.documentation';
-export { default as GlAccordionItemDocumentation } from '../src/components/base/accordion/accordion_item.documentation';
-export { default as GlCarouselDocumentation } from '../src/components/base/carousel/carousel.documentation';
-export { default as GlSafeLinkDirectiveDocumentation } from '../src/directives/safe_link/safe_link.documentation';
-export { default as GlSafeHtmlDirectiveDocumentation } from '../src/directives/safe_html/safe_html.documentation';
-export { default as GlAnimatedNumberDocumentation } from '../src/components/utilities/animated_number/animated_number.documentation';
-export { default as GlFriendlyWrapDocumentation } from '../src/components/utilities/friendly_wrap/friendly_wrap.documentation';
-export { default as GlIntersperseDocumentation } from '../src/components/utilities/intersperse/intersperse.documentation';
-export { default as GlSprintfDocumentation } from '../src/components/utilities/sprintf/sprintf.documentation';
-export { default as GlTruncateDocumentation } from '../src/components/utilities/truncate/truncate.documentation';
-export { default as GlHoverLoadDirectiveDocumentation } from '../src/directives/hover_load/hover_load.documentation';
-
-const componentList = Object.getPrototypeOf(module).exports;
-
-export const getDocumentationFor = (componentName) => {
-  const documentationKey = `${componentName}Documentation`;
-  const documentationObject = componentList[documentationKey];
-  if (!documentationObject) {
-    throw new Error(
-      `Could not find ${documentationKey} in documentation/components_documentation.js!`
-    );
-  }
-  return documentationObject;
-};

package/documentation/index.js

@@ -1,8 +0,0 @@
-import * as ComponentDocumentations from './components_documentation';
-
-export { ComponentDocumentations };
-
-export { default as GlComponentDocumentation } from './components/component_documentation_generator.vue';
-
-export { default as GlExampleExplorer } from './components/example_explorer.vue';
-export { default as GlExampleDisplay } from './components/example_display.vue';

package/src/components/base/accordion/accordion.documentation.js

@@ -1,6 +0,0 @@
-import description from './accordion.md';
-
-export default {
-  followsDesignSystem: true,
-  description,
-};

package/src/components/base/accordion/accordion_item.documentation.js

@@ -1,5 +0,0 @@
-import description from './accordion_item.md';
-
-export default {
-  description,
-};

package/src/components/base/alert/alert.documentation.js

@@ -1,6 +0,0 @@
-import * as description from './alert.md';
-
-export default {
-  description,
-  followsDesignSystem: true,
-};

package/src/components/base/avatar/avatar.documentation.js

@@ -1,6 +0,0 @@
-import description from './avatar.md';
-
-export default {
-  followsDesignSystem: true,
-  description,
-};

package/src/components/base/avatar_labeled/avatar_labeled.documentation.js

@@ -1,6 +0,0 @@
-import description from './avatar_labeled.md';
-
-export default {
-  followsDesignSystem: true,
-  description,
-};

package/src/components/base/avatar_link/avatar_link.documentation.js

@@ -1,6 +0,0 @@
-import description from './avatar_link.md';
-
-export default {
-  followsDesignSystem: true,
-  description,
-};

package/src/components/base/avatars_inline/avatars_inline.documentation.js

@@ -1,6 +0,0 @@
-import * as description from './avatars_inline.md';
-
-export default {
-  followsDesignSystem: true,
-  description,
-};

package/src/components/base/badge/badge.documentation.js

@@ -1,6 +0,0 @@
-import description from './badge.md';
-
-export default {
-  description,
-  followsDesignSystem: true,
-};

package/src/components/base/banner/banner.documentation.js

@@ -1,6 +0,0 @@
-import description from './banner.md';
-
-export default {
-  followsDesignSystem: true,
-  description,
-};

package/src/components/base/breadcrumb/breadcrumb.documentation.js

@@ -1,6 +0,0 @@
-import description from './breadcrumb.md';
-
-export default {
-  followsDesignSystem: true,
-  description,
-};

package/src/components/base/broadcast_message/broadcast_message.documentation.js

@@ -1,6 +0,0 @@
-import description from './broadcast_message.md';
-
-export default {
-  followsDesignSystem: false,
-  description,
-};

package/src/components/base/button/button.documentation.js

@@ -1,24 +0,0 @@
-import description from './button.md';
-
-export default {
-  description,
-  followsDesignSystem: true,
-  bootstrapComponent: 'b-button',
-  bootstrapPropsInfo: {
-    category: {
-      enum: 'buttonCategoryOptions',
-    },
-    variant: {
-      enum: 'buttonVariantOptions',
-    },
-    size: {
-      enum: 'buttonSizeOptions',
-    },
-  },
-  events: [
-    {
-      event: 'click',
-      description: 'Emitted when clicked on button',
-    },
-  ],
-};

package/src/components/base/button_group/button_group.documentation.js

@@ -1,6 +0,0 @@
-import description from './button_group.md';
-
-export default {
-  description,
-  followsDesignSystem: true,
-};

package/src/components/base/card/card.documentation.js

@@ -1,6 +0,0 @@
-import * as description from './card.md';
-
-export default {
-  followsDesignSystem: true,
-  description,
-};

package/src/components/base/carousel/carousel.documentation.js

@@ -1,6 +0,0 @@
-import description from './carousel.md';
-
-export default {
-  description,
-  bootstrapComponent: 'b-carousel',
-};

package/src/components/base/collapse/collapse.documentation.js

@@ -1,5 +0,0 @@
-import description from './collapse.md';
-
-export default {
-  description,
-};

package/src/components/base/datepicker/datepicker.documentation.js

@@ -1,5 +0,0 @@
-import description from './datepicker.md';
-
-export default {
-  description,
-};

package/src/components/base/daterange_picker/daterange_picker.documentation.js

@@ -1,6 +0,0 @@
-import description from './daterange_picker.md';
-
-export default {
-  followsDesignSystem: true,
-  description,
-};

package/src/components/base/drawer/drawer.documentation.js

@@ -1,6 +0,0 @@
-import description from './drawer.md';
-
-export default {
-  followsDesignSystem: true,
-  description,
-};

package/src/components/base/dropdown/dropdown.documentation.js

@@ -1,6 +0,0 @@
-import description from './dropdown.md';
-
-export default {
-  description,
-  followsDesignSystem: false,
-};

package/src/components/base/dropdown/dropdown_item.documentation.js

@@ -1,5 +0,0 @@
-import description from './dropdown_item.md';
-
-export default {
-  description,
-};

package/src/components/base/filtered_search/filtered_search.documentation.js

@@ -1,6 +0,0 @@
-import * as description from './filtered_search.md';
-
-export default {
-  description,
-  followsDesignSystem: true,
-};

package/src/components/base/filtered_search/filtered_search_suggestion.documentation.js

@@ -1,5 +0,0 @@
-import description from './filtered_search_suggestion.md';
-
-export default {
-  description,
-};

package/src/components/base/filtered_search/filtered_search_suggestion_list.documentation.js

@@ -1,5 +0,0 @@
-import description from './filtered_search_suggestion_list.md';
-
-export default {
-  description,
-};

package/src/components/base/filtered_search/filtered_search_term.documentation.js

@@ -1,5 +0,0 @@
-import * as description from './filtered_search_term.md';
-
-export default {
-  description,
-};

package/src/components/base/filtered_search/filtered_search_token.documentation.js

@@ -1,5 +0,0 @@
-import * as description from './filtered_search_token.md';
-
-export default {
-  description,
-};

package/src/components/base/filtered_search/filtered_search_token_segment.documentation.js

@@ -1,5 +0,0 @@
-import * as description from './filtered_search_token_segment.md';
-
-export default {
-  description,
-};

package/src/components/base/form/form.documentation.js

@@ -1,5 +0,0 @@
-import description from './form.md';
-
-export default {
-  description,
-};

package/src/components/base/form/form_checkbox/form_checkbox.documentation.js

@@ -1,6 +0,0 @@
-import description from './form_checkbox.md';
-
-export default {
-  description,
-  followsDesignSystem: true,
-};

package/src/components/base/form/form_checkbox_tree/form_checkbox_tree.documentation.js

@@ -1,5 +0,0 @@
-import * as description from './form_checkbox_tree.md';
-
-export default {
-  description,
-};

package/src/components/base/form/form_combobox/form_combobox.documentation.js

@@ -1,6 +0,0 @@
-import * as description from './form_combobox.md';
-
-export default {
-  followsDesignSystem: true,
-  description,
-};

package/src/components/base/form/form_group/form_group.documentation.js

@@ -1,5 +0,0 @@
-import description from './form_group.md';
-
-export default {
-  description,
-};

package/src/components/base/form/form_input/form_input.documentation.js

@@ -1,6 +0,0 @@
-import description from './form_input.md';
-
-export default {
-  description,
-  followsDesignSystem: true,
-};

package/src/components/base/form/form_input_group/form_input_group.documentation.js

@@ -1,6 +0,0 @@
-import description from './form_input_group.md';
-
-export default {
-  followsDesignSystem: false,
-  description,
-};

package/src/components/base/form/form_radio/form_radio.documentation.js

@@ -1,6 +0,0 @@
-import description from './form_radio.md';
-
-export default {
-  description,
-  followsDesignSystem: true,
-};

package/src/components/base/form/form_radio_group/form_radio_group.documentation.js

@@ -1,6 +0,0 @@
-import description from './form_radio_group.md';
-
-export default {
-  description,
-  followsDesignSystem: true,
-};

package/src/components/base/form/form_select/form_select.documentation.js

@@ -1,6 +0,0 @@
-import description from './form_select.md';
-
-export default {
-  description,
-  followDesignSystem: true,
-};

package/src/components/base/form/form_text/form_text.documentation.js

@@ -1,7 +0,0 @@
-import * as description from './form_text.md';
-
-export default {
-  description,
-  bootstrapComponent: 'b-form-text',
-  propsInfo: {},
-};

package/src/components/base/form/form_textarea/form_textarea.documentation.js

@@ -1,5 +0,0 @@
-import description from './form_textarea.md';
-
-export default {
-  description,
-};

package/src/components/base/form/input_group_text/input_group_text.documentation.js

@@ -1,5 +0,0 @@
-import * as description from './input_group_text.md';
-
-export default {
-  description,
-};

package/src/components/base/icon/icon.documentation.js

@@ -1,6 +0,0 @@
-import description from './icon.md';
-
-export default {
-  followsDesignSystem: true,
-  description,
-};

package/src/components/base/infinite_scroll/examples/index.js

@@ -1,57 +0,0 @@
-import InfiniteScrollAllItemsExample from './infinite_scroll.all_items.example.vue';
-import InfiniteScrollBasicExample from './infinite_scroll.basic.example.vue';
-import InfiniteScrollWithFiniteTotalItemsExample from './infinite_scroll.finite_total_items.example.vue';
-import InfiniteScrollWithLargeNumberOfFetchedItemsExample from './infinite_scroll.large_fetched_items.example.vue';
-import InfiniteScrollReverseExample from './infinite_scroll.reverse.example.vue';
-import InfiniteScrollWithSmallNumberOfFetchedItemsExample from './infinite_scroll.small_fetched_items.example.vue';
-import InfiniteScrollTwoWayExample from './infinite_scroll.two_way.example.vue';
-
-export default [
-  {
-    name: 'Basic',
-    items: [
-      {
-        id: 'infinite-scroll-basic',
-        name: 'Basic',
-        description: 'Basic Infinite Scroll',
-        component: InfiniteScrollBasicExample,
-      },
-      {
-        id: 'infinite-scroll-with-finite-total-items',
-        name: 'Fixed items',
-        description: 'With finite total items',
-        component: InfiniteScrollWithFiniteTotalItemsExample,
-      },
-      {
-        id: 'infinite-scroll-small-fetched-items',
-        name: 'With a small number of fetched items',
-        description: 'Infinite Scroll with small number of fetched items',
-        component: InfiniteScrollWithSmallNumberOfFetchedItemsExample,
-      },
-      {
-        id: 'infinite-scroll-large-fetched-items',
-        name: 'With a large number of fetched items',
-        description: 'Infinite Scroll with large number of fetched items',
-        component: InfiniteScrollWithLargeNumberOfFetchedItemsExample,
-      },
-      {
-        id: 'infinite-scroll-all-items',
-        name: 'Showing all items',
-        description: 'Infinite Scroll with all items',
-        component: InfiniteScrollAllItemsExample,
-      },
-      {
-        id: 'infinite-scroll-reverse',
-        name: 'Reversed',
-        description: 'Infinite Scroll with items added at the top',
-        component: InfiniteScrollReverseExample,
-      },
-      {
-        id: 'infinite-scroll-two-way',
-        name: 'Two way Infinite Scroll',
-        description: 'Infinite Scroll with items added in two directions',
-        component: InfiniteScrollTwoWayExample,
-      },
-    ],
-  },
-];

package/src/components/base/infinite_scroll/examples/infinite_scroll.all_items.example.vue

@@ -1,25 +0,0 @@
-<script>
-const FETCHED_ITEMS = 5;
-
-export default {
-  data() {
-    return {
-      fetchedItems: FETCHED_ITEMS,
-    };
-  },
-};
-</script>
-<template>
-  <gl-infinite-scroll :fetched-items="fetchedItems">
-    <template #items>
-      <ul class="list-group list-group-flushed list-unstyled">
-        <li v-for="item in fetchedItems" :key="item" class="list-group-item">Item #{{ item }}</li>
-      </ul>
-    </template>
-    <template #default>
-      <div class="gl-mt-3">
-        <span>All items loaded</span>
-      </div>
-    </template>
-  </gl-infinite-scroll>
-</template>

package/src/components/base/infinite_scroll/examples/infinite_scroll.basic.example.vue

@@ -1,43 +0,0 @@
-<script>
-const ITEMS_BATCH_SIZE = 20;
-
-export default {
-  data() {
-    return {
-      isLoading: false,
-      fetchedItems: ITEMS_BATCH_SIZE,
-      loadTimer: null,
-    };
-  },
-  methods: {
-    bottomReached() {
-      clearTimeout(this.loadTimer);
-      this.isLoading = true;
-      this.loadTimer = setTimeout(() => {
-        this.fetchedItems += ITEMS_BATCH_SIZE;
-        this.isLoading = false;
-      }, 500);
-    },
-  },
-};
-</script>
-<template>
-  <gl-infinite-scroll
-    :max-list-height="285"
-    :fetched-items="fetchedItems"
-    @bottomReached="bottomReached"
-  >
-    <template #items>
-      <ul class="list-group list-group-flushed list-unstyled">
-        <li v-for="item in fetchedItems" :key="item" class="list-group-item">Item #{{ item }}</li>
-      </ul>
-    </template>
-
-    <template #default>
-      <div class="gl-mt-3">
-        <gl-loading-icon v-if="isLoading" />
-        <span v-else>{{ fetchedItems }} items loaded</span>
-      </div>
-    </template>
-  </gl-infinite-scroll>
-</template>

package/src/components/base/infinite_scroll/examples/infinite_scroll.finite_total_items.example.vue

@@ -1,44 +0,0 @@
-<script>
-const ITEMS_BATCH_SIZE = 60;
-const TOTAL_ITEMS = 100;
-
-export default {
-  data() {
-    return {
-      totalItems: TOTAL_ITEMS,
-      isLoading: false,
-      fetchedItems: ITEMS_BATCH_SIZE,
-      loadTimer: null,
-    };
-  },
-  methods: {
-    bottomReached() {
-      clearTimeout(this.loadTimer);
-      if (this.fetchedItems < TOTAL_ITEMS) {
-        this.isLoading = true;
-        this.loadTimer = setTimeout(() => {
-          this.fetchedItems += ITEMS_BATCH_SIZE;
-          if (this.fetchedItems > TOTAL_ITEMS) {
-            this.fetchedItems = TOTAL_ITEMS;
-          }
-          this.isLoading = false;
-        }, 500);
-      }
-    },
-  },
-};
-</script>
-<template>
-  <gl-infinite-scroll
-    :max-list-height="285"
-    :fetched-items="fetchedItems"
-    :total-items="totalItems"
-    @bottomReached="bottomReached"
-  >
-    <template #items>
-      <ul class="list-group list-group-flushed list-unstyled">
-        <li v-for="item in fetchedItems" :key="item" class="list-group-item">Item #{{ item }}</li>
-      </ul>
-    </template>
-  </gl-infinite-scroll>
-</template>