@gitlab/ui 32.45.0 → 32.48.0

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

@@ -1,44 +0,0 @@
-import CiHeaderSkeletonBasicExample from './ci_header_skeleton.basic.example.vue';
-import DefaultSkeletonBasicExample from './default_skeleton.basic.example.vue';
-import DefaultSkeletonCustomPropsBasicExample from './default_skeleton_custom_props.basic.example.vue';
-import IssueCardSkeletonBasicExample from './issue_card_skeleton.basic.example.vue';
-import JobLogSkeletonBasicExample from './job_log_skeleton.basic.example.vue';
-
-export default [
-  {
-    name: 'Basic',
-    items: [
-      {
-        id: 'default-skeleton-basic',
-        name: 'Default',
-        description: 'Default Skeleton',
-        component: DefaultSkeletonBasicExample,
-      },
-      {
-        id: 'default-skeleton-custom-width-basic',
-        name: 'Default With Custom Props',
-        description:
-          'Default Skeleton With `preserve-aspect-ratio`, `lines`, `equal-width-lines`, `width` and `height` props set',
-        component: DefaultSkeletonCustomPropsBasicExample,
-      },
-      {
-        id: 'issue-card-skeleton-basic',
-        name: 'Issue Board Card',
-        description: 'Basic Issue Card Skeleton',
-        component: IssueCardSkeletonBasicExample,
-      },
-      {
-        id: 'job-log-skeleton-basic',
-        name: 'Job Log',
-        description: 'Basic Job Log Skeleton',
-        component: JobLogSkeletonBasicExample,
-      },
-      {
-        id: 'ci-header-skeleton-basic',
-        name: 'CI Header',
-        description: 'Basic CI Header Skeleton',
-        component: CiHeaderSkeletonBasicExample,
-      },
-    ],
-  },
-];

package/src/components/base/skeleton_loader/examples/issue_card_skeleton.basic.example.vue

@@ -1,26 +0,0 @@
-<template>
-  <div
-    style="
-      background: #fff;
-      border: 1px solid #dfdfdf;
-      box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
-      width: 359px;
-      height: 135px;
-      padding: 1rem;
-      border-radius: 0.25rem;
-    "
-  >
-    <div style="width: 327px; height: 102px">
-      <gl-skeleton-loader :width="327" :height="102">
-        <rect width="276" height="16" rx="4" />
-        <rect y="18" width="237" height="16" rx="4" />
-        <rect y="42" width="118" height="16" rx="8" />
-        <rect x="122" y="42" width="130" height="16" rx="8" />
-        <rect y="62" width="106" height="16" rx="8" />
-        <rect x="110" y="62" width="56" height="16" rx="8" />
-        <rect x="256" y="42" width="71" height="16" rx="8" />
-        <rect y="86" width="38" height="16" rx="4" />
-      </gl-skeleton-loader>
-    </div>
-  </div>
-</template>

package/src/components/base/skeleton_loader/examples/job_log_skeleton.basic.example.vue

@@ -1,13 +0,0 @@
-<template>
-  <div style="background: #000; padding: 16px; border-radius: 0.25rem; width: 865px; height: 175px">
-    <div style="width: 830px; height: 113px">
-      <gl-skeleton-loader :width="830" :height="113">
-        <rect width="540" height="16" rx="4" />
-        <rect y="49" width="701" height="16" rx="4" />
-        <rect y="24" width="830" height="16" rx="4" />
-        <rect y="73" width="540" height="16" rx="4" />
-        <rect y="97" width="639" height="16" rx="4" />
-      </gl-skeleton-loader>
-    </div>
-  </div>
-</template>

package/src/components/charts/discrete_scatter/discrete_scatter.md

@@ -1 +0,0 @@
-### Scatter Chart

package/src/components/charts/discrete_scatter/examples/discrete_scatter.basic.example.vue

@@ -1,31 +0,0 @@
-<script>
-export default {
-  data() {
-    return {
-      chartData: [
-        {
-          data: [
-            ['19 May', 6.95],
-            ['20 May', 7.58],
-            ['21 May', 8.81],
-            ['22 May', 8.33],
-            ['22 May', 10],
-            ['23 May', 9.96],
-            ['24 May', 7.24],
-            ['25 May', 4.26],
-          ],
-          type: 'scatter',
-        },
-      ],
-    };
-  },
-};
-</script>
-<template>
-  <gl-discrete-scatter-chart
-    :data="chartData"
-    :option="{}"
-    y-axis-title="Pushes by day"
-    x-axis-title="Date"
-  />
-</template>

package/src/components/charts/discrete_scatter/examples/index.js

@@ -1,15 +0,0 @@
-import DiscreteScatterChartBasicExample from './discrete_scatter.basic.example.vue';
-
-export default [
-  {
-    name: 'Basic',
-    items: [
-      {
-        id: 'discrete-scatter-basic',
-        name: 'Basic',
-        description: 'Basic Discrete Scatter Chart',
-        component: DiscreteScatterChartBasicExample,
-      },
-    ],
-  },
-];

package/src/components/charts/gauge/examples/gauge.basic.example.vue

@@ -1,5 +0,0 @@
-<template>
-  <div>
-    <gl-gauge-chart :value="48" :min="0" :max="100" :thresholds="[38, 82]" :split-number="10" />
-  </div>
-</template>

package/src/components/charts/gauge/examples/gauge.no_thresholds.example.vue

@@ -1,5 +0,0 @@
-<template>
-  <div>
-    <gl-gauge-chart :value="48" :min="0" :max="100" :split-number="10" />
-  </div>
-</template>

package/src/components/charts/gauge/examples/gauge.no_value.example.vue

@@ -1,5 +0,0 @@
-<template>
-  <div>
-    <gl-gauge-chart :min="0" :max="100" :thresholds="[38, 82]" :split-number="10" />
-  </div>
-</template>

package/src/components/charts/gauge/examples/gauge.with_text.example.vue

@@ -1,12 +0,0 @@
-<template>
-  <div>
-    <gl-gauge-chart
-      :value="48"
-      text="48Mbps"
-      :min="0"
-      :max="100"
-      :thresholds="[38, 82]"
-      :split-number="10"
-    />
-  </div>
-</template>

package/src/components/charts/gauge/examples/index.js

@@ -1,36 +0,0 @@
-import BasicExample from './gauge.basic.example.vue';
-import NoThresholdsExample from './gauge.no_thresholds.example.vue';
-import NoValueExample from './gauge.no_value.example.vue';
-import WithTextExample from './gauge.with_text.example.vue';
-
-export default [
-  {
-    name: 'Basic',
-    items: [
-      {
-        id: 'gauge-basic',
-        name: 'Basic',
-        description: 'Basic Gauge',
-        component: BasicExample,
-      },
-      {
-        id: 'gauge-no-thresholds',
-        name: 'No thresholds set',
-        description: 'Gauge with no thresholds set',
-        component: NoThresholdsExample,
-      },
-      {
-        id: 'gauge-no-value',
-        name: 'No value set',
-        description: 'Gauge with no value set',
-        component: NoValueExample,
-      },
-      {
-        id: 'gauge-with-text',
-        name: 'With text set',
-        description: 'Gauge with custom text set',
-        component: WithTextExample,
-      },
-    ],
-  },
-];

package/src/components/charts/stacked_column/examples/index.js

@@ -1,15 +0,0 @@
-import StackedColumnChartBasicExample from './stacked_column.basic.example.vue';
-
-export default [
-  {
-    name: 'Basic',
-    items: [
-      {
-        id: 'stacked-column-basic',
-        name: 'Basic',
-        description: 'Basic Stacked Column Chart',
-        component: StackedColumnChartBasicExample,
-      },
-    ],
-  },
-];

package/src/components/charts/stacked_column/examples/stacked_column.basic.example.vue

@@ -1,18 +0,0 @@
-<template>
-  <gl-stacked-column-chart
-    :bars="[
-      {
-        name: 'Fun 1',
-        data: [58, 49, 38, 23, 27, 68, 38, 35, 7, 64, 65, 31],
-      },
-      {
-        name: 'Fun 2',
-        data: [8, 6, 34, 19, 9, 7, 17, 25, 14, 7, 10, 32],
-      },
-    ]"
-    :group-by="['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']"
-    x-axis-type="category"
-    x-axis-title="January - December 2018"
-    y-axis-title="Commits"
-  />
-</template>

package/src/components/charts/tooltip/examples/chart_tooltip.basic.example.vue

@@ -1,32 +0,0 @@
-<script>
-export default {
-  data() {
-    return {
-      echartInstance: null,
-    };
-  },
-  methods: {
-    onCreated(chart) {
-      this.echartInstance = chart;
-    },
-  },
-};
-</script>
-
-<template>
-  <div class="position-relative">
-    <gl-chart :options="{}" :height="100" @created="onCreated" />
-    <gl-chart-tooltip
-      v-if="echartInstance"
-      :chart="echartInstance"
-      :show="true"
-      top="50%"
-      left="0px"
-    >
-      <template #title>
-        <div>Tooltip Title</div>
-      </template>
-      Basic Tooltip Content
-    </gl-chart-tooltip>
-  </div>
-</template>

package/src/components/charts/tooltip/examples/index.js

@@ -1,15 +0,0 @@
-import ChartTooltipBasicExample from './chart_tooltip.basic.example.vue';
-
-export default [
-  {
-    name: 'Basic',
-    items: [
-      {
-        id: 'chart-tooltip-basic',
-        name: 'Basic',
-        description: 'Basic Tooltip',
-        component: ChartTooltipBasicExample,
-      },
-    ],
-  },
-];

package/src/components/utilities/intersperse/examples/index.js

@@ -1,36 +0,0 @@
-import IntersperseCustomLastSeparator from './intersperse.custom_last_separator.example.vue';
-import IntersperseCustomLastSeparatorTwoItems from './intersperse.custom_last_separator_two_items.example.vue';
-import IntersperseCustomSeparator from './intersperse.custom_separator.example.vue';
-import Intersperse from './intersperse.default.example.vue';
-
-export default [
-  {
-    name: 'Basic',
-    items: [
-      {
-        id: 'intersperse-default',
-        name: 'Default Intersperse',
-        description: 'Default intersperse usage',
-        component: Intersperse,
-      },
-      {
-        id: 'intersperse-custom-separator',
-        name: 'Intersperse with custom separator',
-        description: 'Set a custom separator',
-        component: IntersperseCustomSeparator,
-      },
-      {
-        id: 'intersperse-custom-last-separator',
-        name: 'Intersperse with custom last separator',
-        description: 'Set a custom last separator',
-        component: IntersperseCustomLastSeparator,
-      },
-      {
-        id: 'intersperse-custom-last-separator-two-items',
-        name: 'Intersperse with custom last separator and two items',
-        description: 'Set a custom last separator on two items',
-        component: IntersperseCustomLastSeparatorTwoItems,
-      },
-    ],
-  },
-];

package/src/components/utilities/intersperse/examples/intersperse.custom_last_separator.example.vue

@@ -1,7 +0,0 @@
-<template>
-  <gl-intersperse last-separator=" and ">
-    <span>Item 1</span>
-    <span>Item 2</span>
-    <span>Item 3</span>
-  </gl-intersperse>
-</template>

package/src/components/utilities/intersperse/examples/intersperse.custom_last_separator_two_items.example.vue

@@ -1,6 +0,0 @@
-<template>
-  <gl-intersperse last-separator=" and ">
-    <span>Item 1</span>
-    <span>Item 2</span>
-  </gl-intersperse>
-</template>

package/src/components/utilities/intersperse/examples/intersperse.custom_separator.example.vue

@@ -1,7 +0,0 @@
-<template>
-  <gl-intersperse separator="/">
-    <span>Item 1</span>
-    <span>Item 2</span>
-    <span>Item 3</span>
-  </gl-intersperse>
-</template>

package/src/components/utilities/intersperse/examples/intersperse.default.example.vue

@@ -1,7 +0,0 @@
-<template>
-  <gl-intersperse>
-    <span>Item 1</span>
-    <span>Item 2</span>
-    <span>Item 3</span>
-  </gl-intersperse>
-</template>