@gitlab/ui 80.13.1 → 80.14.0

package/src/tokens/color.constant.tokens.stories.js

@@ -1,19 +0,0 @@
-import COMPILED_TOKENS from '../../dist/tokens/json/tokens.json';
-import { createDesignTokenStory } from './common_story_options';
-
-export const Neutral = createDesignTokenStory({ tokens: COMPILED_TOKENS.color.neutral });
-
-export const Blue = createDesignTokenStory({ tokens: COMPILED_TOKENS.color.blue });
-
-export const Green = createDesignTokenStory({ tokens: COMPILED_TOKENS.color.green });
-
-export const Orange = createDesignTokenStory({ tokens: COMPILED_TOKENS.color.orange });
-
-export const Red = createDesignTokenStory({ tokens: COMPILED_TOKENS.color.red });
-
-export const Purple = createDesignTokenStory({ tokens: COMPILED_TOKENS.color.purple });
-
-// eslint-disable-next-line storybook/csf-component
-export default {
-  title: 'tokens/color/constant',
-};

package/src/tokens/color.dark.tokens.stories.js

@@ -1,26 +0,0 @@
-import COMPILED_TOKENS from './build/json/tokens.dark.json';
-import { createDesignTokenStory } from './common_story_options';
-
-export const Default = createDesignTokenStory({
-  tokens: {
-    white: COMPILED_TOKENS.white,
-    black: COMPILED_TOKENS.black,
-  },
-});
-
-export const Gray = createDesignTokenStory({ tokens: COMPILED_TOKENS.gray });
-
-export const Blue = createDesignTokenStory({ tokens: COMPILED_TOKENS.blue });
-
-export const Green = createDesignTokenStory({ tokens: COMPILED_TOKENS.green });
-
-export const Orange = createDesignTokenStory({ tokens: COMPILED_TOKENS.orange });
-
-export const Red = createDesignTokenStory({ tokens: COMPILED_TOKENS.red });
-
-export const Purple = createDesignTokenStory({ tokens: COMPILED_TOKENS.purple });
-
-// eslint-disable-next-line storybook/csf-component
-export default {
-  title: 'tokens/color/base/dark',
-};

package/src/tokens/color.data_viz.dark.tokens.stories.js

@@ -1,19 +0,0 @@
-import COMPILED_TOKENS from './build/json/tokens.dark.json';
-import { createDesignTokenStory } from './common_story_options';
-
-export const DataVizGreen = createDesignTokenStory({ tokens: COMPILED_TOKENS['data-viz'].green });
-
-export const DataVizAqua = createDesignTokenStory({ tokens: COMPILED_TOKENS['data-viz'].aqua });
-
-export const DataVizBlue = createDesignTokenStory({ tokens: COMPILED_TOKENS['data-viz'].blue });
-
-export const DataVizMagenta = createDesignTokenStory({
-  tokens: COMPILED_TOKENS['data-viz'].magenta,
-});
-
-export const DataVizOrange = createDesignTokenStory({ tokens: COMPILED_TOKENS['data-viz'].orange });
-
-// eslint-disable-next-line storybook/csf-component
-export default {
-  title: 'tokens/color/data-viz/dark',
-};

package/src/tokens/color.data_viz.tokens.stories.js

@@ -1,19 +0,0 @@
-import COMPILED_TOKENS from './build/json/tokens.json';
-import { createDesignTokenStory } from './common_story_options';
-
-export const DataVizGreen = createDesignTokenStory({ tokens: COMPILED_TOKENS['data-viz'].green });
-
-export const DataVizAqua = createDesignTokenStory({ tokens: COMPILED_TOKENS['data-viz'].aqua });
-
-export const DataVizBlue = createDesignTokenStory({ tokens: COMPILED_TOKENS['data-viz'].blue });
-
-export const DataVizMagenta = createDesignTokenStory({
-  tokens: COMPILED_TOKENS['data-viz'].magenta,
-});
-
-export const DataVizOrange = createDesignTokenStory({ tokens: COMPILED_TOKENS['data-viz'].orange });
-
-// eslint-disable-next-line storybook/csf-component
-export default {
-  title: 'tokens/color/data-viz/light',
-};

package/src/tokens/color.theme.dark.tokens.stories.js

@@ -1,21 +0,0 @@
-import COMPILED_TOKENS from './build/json/tokens.dark.json';
-import { createDesignTokenStory } from './common_story_options';
-
-export const ThemeIndigo = createDesignTokenStory({ tokens: COMPILED_TOKENS.theme.indigo });
-
-export const ThemeBlue = createDesignTokenStory({ tokens: COMPILED_TOKENS.theme.blue });
-
-export const ThemeLightBlue = createDesignTokenStory({
-  tokens: COMPILED_TOKENS.theme['light-blue'],
-});
-
-export const ThemeGreen = createDesignTokenStory({ tokens: COMPILED_TOKENS.theme.green });
-
-export const ThemeRed = createDesignTokenStory({ tokens: COMPILED_TOKENS.theme.red });
-
-export const ThemeLightRed = createDesignTokenStory({ tokens: COMPILED_TOKENS.theme['light-red'] });
-
-// eslint-disable-next-line storybook/csf-component
-export default {
-  title: 'tokens/color/themes/dark',
-};

package/src/tokens/color.theme.tokens.stories.js

@@ -1,21 +0,0 @@
-import COMPILED_TOKENS from './build/json/tokens.json';
-import { createDesignTokenStory } from './common_story_options';
-
-export const ThemeIndigo = createDesignTokenStory({ tokens: COMPILED_TOKENS.theme.indigo });
-
-export const ThemeBlue = createDesignTokenStory({ tokens: COMPILED_TOKENS.theme.blue });
-
-export const ThemeLightBlue = createDesignTokenStory({
-  tokens: COMPILED_TOKENS.theme['light-blue'],
-});
-
-export const ThemeGreen = createDesignTokenStory({ tokens: COMPILED_TOKENS.theme.green });
-
-export const ThemeRed = createDesignTokenStory({ tokens: COMPILED_TOKENS.theme.red });
-
-export const ThemeLightRed = createDesignTokenStory({ tokens: COMPILED_TOKENS.theme['light-red'] });
-
-// eslint-disable-next-line storybook/csf-component
-export default {
-  title: 'tokens/color/themes/light',
-};

package/src/tokens/color.tokens.stories.js

@@ -1,26 +0,0 @@
-import COMPILED_TOKENS from './build/json/tokens.json';
-import { createDesignTokenStory } from './common_story_options';
-
-export const Default = createDesignTokenStory({
-  tokens: {
-    white: COMPILED_TOKENS.white,
-    black: COMPILED_TOKENS.black,
-  },
-});
-
-export const Gray = createDesignTokenStory({ tokens: COMPILED_TOKENS.gray });
-
-export const Blue = createDesignTokenStory({ tokens: COMPILED_TOKENS.blue });
-
-export const Green = createDesignTokenStory({ tokens: COMPILED_TOKENS.green });
-
-export const Orange = createDesignTokenStory({ tokens: COMPILED_TOKENS.orange });
-
-export const Red = createDesignTokenStory({ tokens: COMPILED_TOKENS.red });
-
-export const Purple = createDesignTokenStory({ tokens: COMPILED_TOKENS.purple });
-
-// eslint-disable-next-line storybook/csf-component
-export default {
-  title: 'tokens/color/base/light',
-};

package/src/tokens/color.transparency.tokens.stories.js

@@ -1,14 +0,0 @@
-import COMPILED_TOKENS from './build/json/tokens.json';
-import { createDesignTokenStory } from './common_story_options';
-
-export const Gray = createDesignTokenStory({ tokens: COMPILED_TOKENS['t-gray-a'] });
-
-export const White = createDesignTokenStory({
-  tokens: COMPILED_TOKENS['t-white-a'],
-  containerClass: 'gl-bg-gray-900 gl-text-white',
-});
-
-// eslint-disable-next-line storybook/csf-component
-export default {
-  title: 'tokens/color/transparency',
-};

package/src/tokens/text.dark.tokens.stories.js

@@ -1,18 +0,0 @@
-import COMPILED_TOKENS from './build/json/tokens.dark.json';
-import { createDesignTokenStory } from './common_story_options';
-
-export const Default = createDesignTokenStory({
-  containerClass: 'gl-bg-gray-950',
-  tokens: {
-    primary: COMPILED_TOKENS.text.primary,
-    secondary: COMPILED_TOKENS.text.secondary,
-    tertiary: COMPILED_TOKENS.text.tertiary,
-    ...COMPILED_TOKENS.text.color,
-  },
-  isBackgroundColorStory: false,
-});
-
-// eslint-disable-next-line storybook/csf-component
-export default {
-  title: 'tokens/text/dark',
-};

package/src/tokens/text.tokens.stories.js

@@ -1,17 +0,0 @@
-import COMPILED_TOKENS from './build/json/tokens.json';
-import { createDesignTokenStory } from './common_story_options';
-
-export const Default = createDesignTokenStory({
-  tokens: {
-    primary: COMPILED_TOKENS.text.primary,
-    secondary: COMPILED_TOKENS.text.secondary,
-    tertiary: COMPILED_TOKENS.text.tertiary,
-    ...COMPILED_TOKENS.text.color,
-  },
-  isBackgroundColorStory: false,
-});
-
-// eslint-disable-next-line storybook/csf-component
-export default {
-  title: 'tokens/text/light',
-};

package/src/tokens/tokens.stories.js

@@ -1,16 +0,0 @@
-import TokensTable from './tokens_table.vue';
-
-const Template = () => ({
-  components: {
-    TokensTable,
-  },
-  template: `<tokens-table />`,
-});
-
-export const Default = Template.bind({});
-
-export default {
-  title: 'tokens/all',
-  component: TokensTable,
-  tags: ['skip-visual-test'],
-};

package/src/utils/breakpoints.spec.js

@@ -1,26 +0,0 @@
-import { GlBreakpointInstance } from './breakpoints';
-
-describe('breakpoints', () => {
-  describe.each`
-    key     | size    | expectedDesktop
-    ${'xl'} | ${1200} | ${true}
-    ${'lg'} | ${992}  | ${true}
-    ${'md'} | ${768}  | ${false}
-    ${'sm'} | ${576}  | ${false}
-    ${'xs'} | ${0}    | ${false}
-  `('$key', ({ size, key, expectedDesktop }) => {
-    beforeEach(() => {
-      jest.spyOn(GlBreakpointInstance, 'windowWidth').mockImplementationOnce(() => size + 10);
-    });
-
-    it(`returns ${key} when larger than ${size}`, () => {
-      expect(GlBreakpointInstance.getBreakpointSize()).toBe(key);
-    });
-
-    describe('isDesktop', () => {
-      it(`returns ${expectedDesktop} when screen size is ${size}`, () => {
-        expect(GlBreakpointInstance.isDesktop()).toBe(expectedDesktop);
-      });
-    });
-  });
-});