@gitlab/ui 49.9.0 → 49.9.1

package/CHANGELOG.md

@@ -1,3 +1,10 @@
+## [49.9.1](https://gitlab.com/gitlab-org/gitlab-ui/compare/v49.9.0...v49.9.1) (2022-11-15)
+
+
+### Bug Fixes
+
+* **deps:** update dependency dompurify to ^2.4.1 ([1dfdf40](https://gitlab.com/gitlab-org/gitlab-ui/commit/1dfdf407820dcc42c313c6c6b95cff0be7221080))
+
 # [49.9.0](https://gitlab.com/gitlab-org/gitlab-ui/compare/v49.8.0...v49.9.0) (2022-11-14)
 
 

package/dist/components/base/pagination/pagination.js

@@ -1,7 +1,7 @@
 import debounce from 'lodash/debounce';
 import isFunction from 'lodash/isFunction';
 import range from 'lodash/range';
-import Breakpoints, { breakpoints } from '../../../utils/breakpoints';
+import { breakpoints, GlBreakpointInstance } from '../../../utils/breakpoints';
 import { alignOptions, resizeDebounceTime } from '../../../utils/constants';
 import GlIcon from '../icon/icon';
 import GlLink from '../link/link';
@@ -165,7 +165,7 @@ var script = {
   },
   data() {
     return {
-      breakpoint: Breakpoints.getBreakpointSize(),
+      breakpoint: GlBreakpointInstance.getBreakpointSize(),
       // If total pages count is below or equal to minTotalPagesToCollapse, collapsing is disabled
       minTotalPagesToCollapse: 4
     };
@@ -268,7 +268,7 @@ var script = {
   },
   methods: {
     setBreakpoint() {
-      this.breakpoint = Breakpoints.getBreakpointSize();
+      this.breakpoint = GlBreakpointInstance.getBreakpointSize();
     },
     pageIsDisabled(page) {
       return this.disabled || page < 1 || this.isCompactPagination && page > this.value && !this.nextPage || !this.isCompactPagination && page > this.totalPages;

package/dist/components/charts/area/area.js

@@ -1,5 +1,5 @@
 import merge from 'lodash/merge';
-import defaultChartOptions, { defaultAreaOpacity, lineStyle, getThresholdConfig, generateAnnotationSeries, dataZoomAdjustments, mergeSeriesToOptions, mergeAnnotationAxisToOptions, grid, getDefaultTooltipContent } from '../../../utils/charts/config';
+import { defaultAreaOpacity, lineStyle, getThresholdConfig, generateAnnotationSeries, defaultChartOptions, dataZoomAdjustments, mergeSeriesToOptions, mergeAnnotationAxisToOptions, grid, getDefaultTooltipContent } from '../../../utils/charts/config';
 import { LEGEND_AVERAGE_TEXT, LEGEND_MAX_TEXT, LEGEND_MIN_TEXT, LEGEND_CURRENT_TEXT, LEGEND_LAYOUT_INLINE, LEGEND_LAYOUT_TABLE, DATA_TOOLTIP_LEFT_OFFSET, ANNOTATION_TOOLTIP_TOP_OFFSET } from '../../../utils/charts/constants';
 import { colorFromDefaultPalette } from '../../../utils/charts/theme';
 import { seriesHasAnnotations, isDataPointAnnotation } from '../../../utils/charts/utils';

package/dist/components/charts/chart/chart.js

@@ -1,6 +1,6 @@
 import * as echarts from 'echarts';
 import { validRenderers, defaultWidth, defaultHeight } from '../../../utils/charts/config';
-import createTheme, { themeName } from '../../../utils/charts/theme';
+import { themeName, createTheme } from '../../../utils/charts/theme';
 import { GlResizeObserverDirective } from '../../../directives/resize_observer/resize_observer';
 import __vue_normalize__ from 'vue-runtime-helpers/dist/normalize-component.js';
 

package/dist/components/charts/column/column.js

@@ -1,5 +1,5 @@
 import merge from 'lodash/merge';
-import defaultChartOptions, { yAxis, generateBarSeries, generateLineSeries, gridWithSecondaryYAxis, grid, dataZoomAdjustments, mergeSeriesToOptions, getDefaultTooltipContent } from '../../../utils/charts/config';
+import { yAxis, generateBarSeries, generateLineSeries, defaultChartOptions, gridWithSecondaryYAxis, grid, dataZoomAdjustments, mergeSeriesToOptions, getDefaultTooltipContent } from '../../../utils/charts/config';
 import { CHART_TYPE_LINE, TOOLTIP_LEFT_OFFSET } from '../../../utils/charts/constants';
 import { colorFromDefaultPalette } from '../../../utils/charts/theme';
 import { columnOptions } from '../../../utils/constants';

package/dist/components/charts/discrete_scatter/discrete_scatter.js

@@ -1,5 +1,5 @@
 import merge from 'lodash/merge';
-import defaultChartOptions, { dataZoomAdjustments, mergeSeriesToOptions } from '../../../utils/charts/config';
+import { defaultChartOptions, dataZoomAdjustments, mergeSeriesToOptions } from '../../../utils/charts/config';
 import { colorFromDefaultPalette } from '../../../utils/charts/theme';
 import { debounceByAnimationFrame } from '../../../utils/utils';
 import { ToolboxMixin } from '../../mixins/toolbox_mixin';

package/dist/components/charts/line/line.js

@@ -1,5 +1,5 @@
 import merge from 'lodash/merge';
-import defaultChartOptions, { symbolSize, lineStyle, getThresholdConfig, generateAnnotationSeries, dataZoomAdjustments, mergeSeriesToOptions, mergeAnnotationAxisToOptions, grid, getDefaultTooltipContent } from '../../../utils/charts/config';
+import { symbolSize, lineStyle, getThresholdConfig, generateAnnotationSeries, defaultChartOptions, dataZoomAdjustments, mergeSeriesToOptions, mergeAnnotationAxisToOptions, grid, getDefaultTooltipContent } from '../../../utils/charts/config';
 import { LEGEND_AVERAGE_TEXT, LEGEND_MAX_TEXT, LEGEND_MIN_TEXT, LEGEND_CURRENT_TEXT, LEGEND_LAYOUT_INLINE, LEGEND_LAYOUT_TABLE, DATA_TOOLTIP_LEFT_OFFSET, ANNOTATION_TOOLTIP_TOP_OFFSET } from '../../../utils/charts/constants';
 import { colorFromDefaultPalette } from '../../../utils/charts/theme';
 import { seriesHasAnnotations, isDataPointAnnotation } from '../../../utils/charts/utils';

package/dist/components/charts/sparkline/sparkline.js

@@ -1,6 +1,6 @@
 import merge from 'lodash/merge';
 import { GlResizeObserverDirective } from '../../../directives/resize_observer/resize_observer';
-import defaultChartOptions, { mergeSeriesToOptions, symbolSize } from '../../../utils/charts/config';
+import { defaultChartOptions, mergeSeriesToOptions, symbolSize } from '../../../utils/charts/config';
 import Chart from '../chart/chart';
 import ChartTooltip from '../tooltip/tooltip';
 import __vue_normalize__ from 'vue-runtime-helpers/dist/normalize-component.js';

package/dist/components/charts/stacked_column/stacked_column.js

@@ -1,5 +1,5 @@
 import merge from 'lodash/merge';
-import defaultChartOptions, { yAxis, generateBarSeries, generateLineSeries, gridWithSecondaryYAxis, grid, dataZoomAdjustments, mergeSeriesToOptions } from '../../../utils/charts/config';
+import { yAxis, generateBarSeries, generateLineSeries, defaultChartOptions, gridWithSecondaryYAxis, grid, dataZoomAdjustments, mergeSeriesToOptions } from '../../../utils/charts/config';
 import { LEGEND_AVERAGE_TEXT, LEGEND_MAX_TEXT, LEGEND_MIN_TEXT, LEGEND_CURRENT_TEXT, LEGEND_LAYOUT_INLINE, LEGEND_LAYOUT_TABLE, CHART_TYPE_LINE, ANNOTATION_TOOLTIP_TOP_OFFSET } from '../../../utils/charts/constants';
 import { colorFromDefaultPalette } from '../../../utils/charts/theme';
 import { columnOptions } from '../../../utils/constants';

package/dist/utils/breakpoints.js

@@ -5,7 +5,7 @@ const breakpoints = {
   sm: 576,
   xs: 0
 };
-const BreakpointInstance = {
+const GlBreakpointInstance = {
   windowWidth: () => window.innerWidth,
   getBreakpointSize() {
     const windowWidth = this.windowWidth();
@@ -17,5 +17,4 @@ const BreakpointInstance = {
   }
 };
 
-export default BreakpointInstance;
-export { breakpoints };
+export { GlBreakpointInstance, breakpoints };

package/dist/utils/charts/config.js

@@ -1,7 +1,7 @@
 import castArray from 'lodash/castArray';
 import isArray from 'lodash/isArray';
 import merge from 'lodash/merge';
-import Breakpoints from '../breakpoints';
+import { GlBreakpointInstance } from '../breakpoints';
 import { columnOptions } from '../constants';
 import { areDatesEqual } from '../datetime_utility';
 import { engineeringNotation } from '../number_utils';
@@ -38,6 +38,11 @@ const grid = {
   left: 64,
   right: 32
 };
+const defaultChartOptions = {
+  grid,
+  xAxis,
+  yAxis
+};
 const gridWithSecondaryYAxis = {
   ...grid,
   right: 64
@@ -91,7 +96,7 @@ const getDataZoomConfig = function () {
     filterMode = 'none'
   } = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
   const disabledBreakpoints = ['lg', 'xl'];
-  const disabled = disabledBreakpoints.includes(Breakpoints.getBreakpointSize());
+  const disabled = disabledBreakpoints.includes(GlBreakpointInstance.getBreakpointSize());
   const minSpan = filterMode === 'none' ? 0.01 : null;
   return {
     grid: {
@@ -530,11 +535,5 @@ const getDefaultTooltipContent = function (params) {
     tooltipContent
   };
 };
-var config = {
-  grid,
-  xAxis,
-  yAxis
-};
 
-export default config;
-export { annotationsYAxisCoords, axes, dataZoomAdjustments, defaultAreaOpacity, defaultFontSize, defaultHeight, defaultWidth, generateAnnotationSeries, generateBarSeries, generateLineSeries, getAnnotationsConfig, getDataZoomConfig, getDefaultTooltipContent, getThresholdConfig, getToolboxConfig, grid, gridWithSecondaryYAxis, lineStyle, mergeAnnotationAxisToOptions, mergeSeriesToOptions, parseAnnotations, symbolSize, validRenderers, xAxis, yAxis };
+export { annotationsYAxisCoords, axes, dataZoomAdjustments, defaultAreaOpacity, defaultChartOptions, defaultFontSize, defaultHeight, defaultWidth, generateAnnotationSeries, generateBarSeries, generateLineSeries, getAnnotationsConfig, getDataZoomConfig, getDefaultTooltipContent, getThresholdConfig, getToolboxConfig, grid, gridWithSecondaryYAxis, lineStyle, mergeAnnotationAxisToOptions, mergeSeriesToOptions, parseAnnotations, symbolSize, validRenderers, xAxis, yAxis };

package/dist/utils/charts/theme.js

@@ -225,5 +225,4 @@ const createTheme = function () {
   };
 };
 
-export default createTheme;
-export { colorFromDefaultPalette, colorPaletteDefault, gaugeNeutralHues, gaugeSafeHues, gaugeWarningHue, heatmapHues, themeName };
+export { colorFromDefaultPalette, colorPaletteDefault, createTheme, gaugeNeutralHues, gaugeSafeHues, gaugeWarningHue, heatmapHues, themeName };

package/dist/utils.js

@@ -1 +1 @@
-export { default as GlBreakpointInstance, breakpoints } from './utils/breakpoints';
+export { GlBreakpointInstance, breakpoints } from './utils/breakpoints';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gitlab/ui",
-  "version": "49.9.0",
+  "version": "49.9.1",
   "description": "GitLab UI Components",
   "license": "MIT",
   "main": "dist/index.js",
@@ -61,7 +61,7 @@
   "dependencies": {
     "@popperjs/core": "^2.11.2",
     "bootstrap-vue": "2.23.1",
-    "dompurify": "^2.4.0",
+    "dompurify": "^2.4.1",
     "echarts": "^5.3.2",
     "iframe-resizer": "^4.3.2",
     "lodash": "^4.17.20",

package/src/components/base/pagination/pagination.vue

@@ -3,7 +3,7 @@
 import debounce from 'lodash/debounce';
 import isFunction from 'lodash/isFunction';
 import range from 'lodash/range';
-import Breakpoints, { breakpoints } from '../../../utils/breakpoints';
+import { GlBreakpointInstance, breakpoints } from '../../../utils/breakpoints';
 import { alignOptions, resizeDebounceTime } from '../../../utils/constants';
 import GlIcon from '../icon/icon.vue';
 import GlLink from '../link/link.vue';
@@ -166,7 +166,7 @@ export default {
   },
   data() {
     return {
-      breakpoint: Breakpoints.getBreakpointSize(),
+      breakpoint: GlBreakpointInstance.getBreakpointSize(),
       // If total pages count is below or equal to minTotalPagesToCollapse, collapsing is disabled
       minTotalPagesToCollapse: 4,
     };
@@ -287,7 +287,7 @@ export default {
   },
   methods: {
     setBreakpoint() {
-      this.breakpoint = Breakpoints.getBreakpointSize();
+      this.breakpoint = GlBreakpointInstance.getBreakpointSize();
     },
     pageIsDisabled(page) {
       return (

package/src/components/charts/area/area.vue

@@ -17,7 +17,8 @@
  */
 
 import merge from 'lodash/merge';
-import defaultChartOptions, {
+import {
+  defaultChartOptions,
   grid,
   getThresholdConfig,
   generateAnnotationSeries,

package/src/components/charts/chart/chart.spec.js

@@ -1,6 +1,6 @@
 import { shallowMount } from '@vue/test-utils';
 import * as echarts from 'echarts';
-import createTheme from '~/utils/charts/theme';
+import { createTheme } from '~/utils/charts/theme';
 import { useMockResizeObserver } from '~helpers/mock_dom_observer';
 import Chart from './chart.vue';
 

package/src/components/charts/chart/chart.vue

@@ -2,7 +2,7 @@
 <script>
 import * as echarts from 'echarts';
 import { defaultHeight, defaultWidth, validRenderers } from '../../../utils/charts/config';
-import createTheme, { themeName } from '../../../utils/charts/theme';
+import { createTheme, themeName } from '../../../utils/charts/theme';
 import { GlResizeObserverDirective } from '../../../directives/resize_observer/resize_observer';
 
 /**

package/src/components/charts/column/column.vue

@@ -1,7 +1,8 @@
 <!-- eslint-disable vue/multi-word-component-names -->
 <script>
 import merge from 'lodash/merge';
-import defaultChartOptions, {
+import {
+  defaultChartOptions,
   grid,
   gridWithSecondaryYAxis,
   yAxis,

package/src/components/charts/discrete_scatter/discrete_scatter.vue

@@ -1,7 +1,8 @@
 <script>
 import merge from 'lodash/merge';
 import { gray200 } from '../../../../scss_to_js/scss_variables'; // eslint-disable-line import/no-unresolved
-import defaultChartOptions, {
+import {
+  defaultChartOptions,
   dataZoomAdjustments,
   mergeSeriesToOptions,
 } from '../../../utils/charts/config';

package/src/components/charts/line/line.vue

@@ -20,7 +20,8 @@
 
 import merge from 'lodash/merge';
 import { gray200 } from '../../../../scss_to_js/scss_variables'; // eslint-disable-line import/no-unresolved
-import defaultChartOptions, {
+import {
+  defaultChartOptions,
   grid,
   getThresholdConfig,
   generateAnnotationSeries,

package/src/components/charts/sparkline/sparkline.vue

@@ -2,7 +2,8 @@
 <script>
 import merge from 'lodash/merge';
 import { GlResizeObserverDirective } from '../../../directives/resize_observer/resize_observer';
-import defaultChartOptions, {
+import {
+  defaultChartOptions,
   mergeSeriesToOptions,
   symbolSize,
 } from '../../../utils/charts/config';

package/src/components/charts/stacked_column/stacked_column.vue

@@ -1,6 +1,7 @@
 <script>
 import merge from 'lodash/merge';
-import defaultChartOptions, {
+import {
+  defaultChartOptions,
   grid,
   gridWithSecondaryYAxis,
   yAxis,

package/src/utils/breakpoints.js

@@ -6,7 +6,7 @@ export const breakpoints = {
   xs: 0,
 };
 
-const BreakpointInstance = {
+export const GlBreakpointInstance = {
   windowWidth: () => window.innerWidth,
   getBreakpointSize() {
     const windowWidth = this.windowWidth();
@@ -19,5 +19,3 @@ const BreakpointInstance = {
     return ['xl', 'lg'].includes(this.getBreakpointSize());
   },
 };
-
-export default BreakpointInstance;

package/src/utils/breakpoints.spec.js

@@ -1,4 +1,4 @@
-import bp from './breakpoints';
+import { GlBreakpointInstance } from './breakpoints';
 
 describe('breakpoints', () => {
   describe.each`
@@ -10,16 +10,16 @@ describe('breakpoints', () => {
     ${'xs'} | ${0}    | ${false}
   `('$key', ({ size, key, expectedDesktop }) => {
     beforeEach(() => {
-      jest.spyOn(bp, 'windowWidth').mockImplementationOnce(() => size + 10);
+      jest.spyOn(GlBreakpointInstance, 'windowWidth').mockImplementationOnce(() => size + 10);
     });
 
     it(`returns ${key} when larger than ${size}`, () => {
-      expect(bp.getBreakpointSize()).toBe(key);
+      expect(GlBreakpointInstance.getBreakpointSize()).toBe(key);
     });
 
     describe('isDesktop', () => {
       it(`returns ${expectedDesktop} when screen size is ${size}`, () => {
-        expect(bp.isDesktop()).toBe(expectedDesktop);
+        expect(GlBreakpointInstance.isDesktop()).toBe(expectedDesktop);
       });
     });
   });

package/src/utils/charts/config.js

@@ -2,7 +2,7 @@ import castArray from 'lodash/castArray';
 import isArray from 'lodash/isArray';
 import merge from 'lodash/merge';
 import { blue500 } from '../../../scss_to_js/scss_variables'; // eslint-disable-line import/no-unresolved
-import Breakpoints from '../breakpoints';
+import { GlBreakpointInstance } from '../breakpoints';
 import { columnOptions } from '../constants';
 import { areDatesEqual } from '../datetime_utility';
 import { engineeringNotation } from '../number_utils';
@@ -42,6 +42,12 @@ export const grid = {
   right: 32,
 };
 
+export const defaultChartOptions = {
+  grid,
+  xAxis,
+  yAxis,
+};
+
 export const gridWithSecondaryYAxis = {
   ...grid,
   right: 64,
@@ -93,7 +99,7 @@ const LESS_THAN = ['<', '&lt;'];
  */
 export const getDataZoomConfig = ({ filterMode = 'none' } = {}) => {
   const disabledBreakpoints = ['lg', 'xl'];
-  const disabled = disabledBreakpoints.includes(Breakpoints.getBreakpointSize());
+  const disabled = disabledBreakpoints.includes(GlBreakpointInstance.getBreakpointSize());
   const minSpan = filterMode === 'none' ? 0.01 : null;
 
   return {
@@ -499,9 +505,3 @@ export const getDefaultTooltipContent = (params, yAxisTitle = null) => {
 
   return { xLabels, tooltipContent };
 };
-
-export default {
-  grid,
-  xAxis,
-  yAxis,
-};

package/src/utils/charts/config.spec.js

@@ -1,5 +1,5 @@
 import merge from 'lodash/merge';
-import Breakpoints from '../breakpoints';
+import { GlBreakpointInstance } from '../breakpoints';
 import { columnOptions } from '../constants';
 import { hexToRgba } from '../utils';
 import {
@@ -197,7 +197,7 @@ describe('chart config helpers', () => {
 
     describe('on small viewports', () => {
       it('creates a basic dataZoomConfig with inside scrolling being enabled', () => {
-        jest.spyOn(Breakpoints, 'getBreakpointSize').mockImplementationOnce(() => 'sm');
+        jest.spyOn(GlBreakpointInstance, 'getBreakpointSize').mockImplementationOnce(() => 'sm');
         const actual = getDataZoomConfig();
         const dataZoomWithInsideEnabled = [
           {

package/src/utils/charts/theme.js

@@ -147,7 +147,7 @@ const isLineChartWithoutArea = (options) =>
   Array.isArray(options?.series) &&
   options.series.some((series) => series.type === 'line' && !series.areaStyle);
 
-const createTheme = (options = {}) => ({
+export const createTheme = (options = {}) => ({
   color: colorPaletteDefault,
   backgroundColor: 'transparent',
   textStyle: {
@@ -268,5 +268,3 @@ const createTheme = (options = {}) => ({
   logAxis: axes,
   timeAxis: axes,
 });
-
-export default createTheme;

package/src/utils.js

@@ -1 +1 @@
-export { default as GlBreakpointInstance, breakpoints } from './utils/breakpoints';
+export { GlBreakpointInstance, breakpoints } from './utils/breakpoints';