@skbkontur/react-ui 5.1.7 → 5.2.0

package/cjs/components/Toggle/__creevey__/Toggle.creevey.mts

@@ -1,93 +0,0 @@
-import { story, kind, test } from 'creevey';
-
-import { delay } from '../../../lib/delay';
-import { ToggleDataTids } from '../Toggle';
-import { TooltipDataTids } from '../../Tooltip';
-
-kind('Toggle', () => {
-  story('Plain', ({ setStoryParameters }) => {
-    setStoryParameters({
-      skip: {
-        flaky: { in: /chrome2022(Dark)?/, tests: ['pressed', 'clicked'] },
-      },
-    });
-
-    test('plain', async (context) => {
-      await context.matchImage(await context.takeScreenshot(), 'plain');
-    });
-
-    test('pressed', async (context) => {
-      await context.webdriver
-        .actions({
-          bridge: true,
-        })
-        .move({
-          origin: context.webdriver.findElement({ css: `[data-tid="${ToggleDataTids.root}"]` }),
-        })
-        .press()
-        .perform();
-      await delay(1000);
-      await context.matchImage(await context.takeScreenshot(), 'pressed');
-    });
-
-    test('clicked', async (context) => {
-      await context.webdriver
-        .actions({
-          bridge: true,
-        })
-        .click(context.webdriver.findElement({ css: `[data-tid="${ToggleDataTids.root}"]` }))
-        .perform();
-      await delay(1000);
-      await context.matchImage(await context.takeScreenshot(), 'clicked');
-    });
-  });
-
-  story('DisabledWithTooltip', () => {
-    test('pressed', async (context) => {
-      await context.webdriver
-        .actions({
-          bridge: true,
-        })
-        .move({
-          origin: context.webdriver.findElement({ css: `[data-tid="${TooltipDataTids.root}"]` }),
-        })
-        .press()
-        .perform();
-      await delay(1000);
-      await context.matchImage(await context.takeScreenshot(), 'pressed');
-    });
-  });
-
-  story('WithChildren', () => {
-    test('plain', async (context) => {
-      await context.matchImage(await context.takeScreenshot(), 'plain');
-    });
-  });
-
-  story('WithLongDescription', ({ setStoryParameters }) => {
-    setStoryParameters({
-      skip: {
-        flaky: { in: /chrome2022(Dark)?/, tests: 'clicked' },
-      },
-    });
-
-    test('plain', async (context) => {
-      await context.matchImage(await context.takeScreenshot(), 'plain');
-    });
-
-    test('clicked', async (context) => {
-      await context.webdriver
-        .actions({
-          bridge: true,
-        })
-        .move({
-          origin: context.webdriver.findElement({ css: `[data-tid="${ToggleDataTids.root}"]` }),
-        })
-        .pause(2000)
-        .click()
-        .perform();
-      await delay(2000);
-      await context.matchImage(await context.takeScreenshot(), 'clicked');
-    });
-  });
-});

package/cjs/components/Toggle/__docs__/Toggle.mdx

@@ -1,27 +0,0 @@
-import * as ToggleStories from './Toggle.docs.stories.tsx';
-import { Primary, ArgTypes, Stories, Description } from '@storybook/blocks';
-import { Meta } from '../../../.storybook/Meta';
-import { Header } from '../../../.storybook/Header';
-import { PropsTable } from '../../../.storybook/PropsTable';
-
-<Meta of={ToggleStories} />
-
-<Header
-  component="Toggle"
-  guides="https://guides.kontur.ru/components/selection-elements/toggle/"
-  figma="https://www.figma.com/file/87ScqxPzJpF9DcVBNYWOjM/%E2%9A%A1-Kontur-UI-Modern-Layout?node-id=203%3A9888"
-/>
-
-<Description />
-
-## Базовый пример
-
-<Primary />
-
-## Пропы
-
-<PropsTable />
-
-## Примеры использования
-
-<Stories title="" includePrimary={false} />

package/cjs/components/Token/__docs__/Token.mdx

@@ -1,27 +0,0 @@
-import * as TokenStories from './Token.docs.stories.tsx';
-import { Primary, ArgTypes, Stories, Description } from '@storybook/blocks';
-import { Meta } from '../../../.storybook/Meta';
-import { Header } from '../../../.storybook/Header';
-import { PropsTable } from '../../../.storybook/PropsTable';
-
-<Meta of={TokenStories} />
-
-<Header
-  component="Token"
-  guides="https://guides.kontur.ru/components/input-fields/tokens/"
-  figma="https://www.figma.com/file/87ScqxPzJpF9DcVBNYWOjM/%E2%9A%A1-Kontur-UI-Modern-Layout?node-id=230%3A2955"
-/>
-
-<Description />
-
-## Базовый пример
-
-<Primary />
-
-## Пропы
-
-<PropsTable />
-
-## Примеры использования
-
-<Stories title="" includePrimary={false} />

package/cjs/components/TokenInput/__creevey__/TokenInput.creevey.mts

@@ -1,442 +0,0 @@
-import { story, kind, test } from 'creevey';
-import { Key } from 'selenium-webdriver';
-
-import { delay } from '../../../lib/delay';
-
-kind('TokenInput', () => {
-  story('EmptyWithReference', ({ setStoryParameters }) => {
-    setStoryParameters({
-      captureElement: '.tokens-test-container',
-      skip: {
-        'do not pass on teamcity': {
-          in: ['firefox', 'firefox8px', 'firefoxFlat8px', 'firefoxDark', 'firefox2022', 'firefox2022Dark'],
-          tests: ['clicked', 'withMenu'],
-        },
-      },
-    });
-
-    test('idle', async (context) => {
-      await delay(100);
-      await context.matchImage(await context.takeScreenshot(), 'idle');
-    });
-
-    test('clicked', async (context) => {
-      await context.webdriver
-        .actions({
-          bridge: true,
-        })
-        .click(context.webdriver.findElement({ css: '[data-comp-name~="TokenInput"]' }))
-        .perform();
-      await context.matchImage(await context.takeScreenshot(), 'clicked');
-    });
-
-    test('withMenu', async (context) => {
-      await context.webdriver
-        .actions({
-          bridge: true,
-        })
-        .click(context.webdriver.findElement({ css: '[data-comp-name~="TokenInput"]' }))
-        .sendKeys('a')
-        .perform();
-      await context.matchImage(await context.takeScreenshot(), 'withMenu');
-    });
-  });
-
-  story('EmptyCombined', ({ setStoryParameters }) => {
-    setStoryParameters({
-      skip: {
-        'flaky tests': { in: /firefox/ },
-      },
-    });
-
-    test('selectFirst', async (context) => {
-      await context.webdriver
-        .actions({
-          bridge: true,
-        })
-        .click(context.webdriver.findElement({ css: '[data-comp-name~="TokenInput"]' }))
-        .sendKeys('a')
-        .perform();
-      await delay(1000);
-      await context.matchImage(await context.takeScreenshot());
-    });
-  });
-
-  story('CombinedFilled', ({ setStoryParameters }) => {
-    setStoryParameters({
-      skip: {
-        'do not pass on teamcity': { in: ['firefox2022', 'firefox2022Dark'], tests: ['editToken'] },
-        flaky: { in: /firefox/, tests: ['selectAndType', 'editToken'] },
-      },
-    });
-
-    test('selectAndType', async (context) => {
-      await context.webdriver
-        .actions({
-          bridge: true,
-        })
-        .click(context.webdriver.findElement({ css: '[data-comp-name~="Token"]' }))
-        .perform();
-      const selected = await context.takeScreenshot();
-      await context.webdriver
-        .actions({
-          bridge: true,
-        })
-        .sendKeys('a')
-        .pause(300)
-        .move({ x: 0, y: 0 })
-        .perform();
-      const typed = await context.takeScreenshot();
-      await context.matchImages({ selected, typed });
-    });
-
-    test('editToken', async (context) => {
-      await context.webdriver
-        .actions({
-          bridge: true,
-        })
-        .doubleClick(context.webdriver.findElement({ css: '[data-comp-name~="Token"]' }))
-        .perform();
-      const doubleClickOnToken = await context.takeScreenshot();
-      await context.webdriver
-        .actions({
-          bridge: true,
-        })
-        .click(context.webdriver.findElement({ css: '[data-comp-name~="MenuItem"]' }))
-        .perform();
-      const clickOnMenuItem = await context.takeScreenshot();
-      await context.webdriver
-        .actions({
-          bridge: true,
-        })
-        .sendKeys(Key.ENTER)
-        .perform();
-      const enterOnActiveToken = await context.takeScreenshot();
-      await context.webdriver
-        .actions({
-          bridge: true,
-        })
-        .sendKeys('EDITED')
-        .perform();
-      const editToken = await context.takeScreenshot();
-      await context.webdriver
-        .actions({
-          bridge: true,
-        })
-        .sendKeys(Key.ENTER)
-        .perform();
-      const enterAfterEdit = await context.takeScreenshot();
-      await context.matchImages({
-        doubleClickOnToken,
-        clickOnMenuItem,
-        enterOnActiveToken,
-        editToken,
-        enterAfterEdit,
-      });
-    });
-  });
-
-  story('CustomAddButton', ({ setStoryParameters }) => {
-    setStoryParameters({
-      skip: {
-        'do not pass on teamcity': {
-          in: ['firefox', 'firefox8px', 'firefoxFlat8px', 'firefoxDark', 'firefox2022', 'firefox2022Dark'],
-          tests: ['addButton'],
-        },
-      },
-    });
-
-    test('addButton', async (context) => {
-      await context.webdriver
-        .actions({
-          bridge: true,
-        })
-        .click(context.webdriver.findElement({ css: '[data-comp-name~="TokenInput"]' }))
-        .sendKeys('zzz')
-        .perform();
-      await context.matchImage(await context.takeScreenshot());
-    });
-  });
-
-  story('OnUnexpectedInputValidation', ({ setStoryParameters }) => {
-    setStoryParameters({
-      skip: {
-        flacky: {
-          in: ['firefox', 'firefox8px', 'firefoxFlat8px', 'firefoxDark', 'firefox2022', 'firefox2022Dark'],
-          tests: ['token select', 'token edit'],
-        },
-      },
-    });
-
-    test('token select', async (context) => {
-      await context.webdriver
-        .actions({
-          bridge: true,
-        })
-        .click(context.webdriver.findElement({ css: '[data-comp-name~="TokenInput"]' }))
-        .pause(1000)
-        .sendKeys('aaa')
-        .pause(1000)
-        .move({ x: 0, y: 0 })
-        .click()
-        .pause(1000)
-        .perform();
-      const withNotSelectedToken = await context.takeScreenshot();
-      await context.webdriver
-        .actions({
-          bridge: true,
-        })
-        .click(context.webdriver.findElement({ css: '[data-comp-name~="TokenInput"]' }))
-        .sendKeys(Key.BACK_SPACE)
-        .sendKeys(Key.BACK_SPACE)
-        .sendKeys(Key.BACK_SPACE)
-        .sendKeys(Key.BACK_SPACE)
-        .sendKeys(Key.BACK_SPACE)
-        .sendKeys('aaaccc')
-        .move({ x: 0, y: 0 })
-        .click()
-        .perform();
-      const withAutoSelectedTokens = await context.takeScreenshot();
-      await context.webdriver
-        .actions({
-          bridge: true,
-        })
-        .click(context.webdriver.findElement({ css: '[data-comp-name~="TokenInput"]' }))
-        .pause(1000)
-        .sendKeys('clear')
-        .move({ x: 0, y: 0 })
-        .click()
-        .perform();
-      await delay(1000);
-      const clearedOnNullReturn = await context.takeScreenshot();
-      await context.webdriver
-        .actions({
-          bridge: true,
-        })
-        .clear();
-      await context.webdriver
-        .actions({
-          bridge: true,
-        })
-        .click(context.webdriver.findElement({ css: '[data-comp-name~="TokenInput"]' }))
-        .sendKeys(Key.BACK_SPACE)
-        .sendKeys(Key.BACK_SPACE)
-        .sendKeys(Key.BACK_SPACE)
-        .sendKeys('aaa')
-        .sendKeys(Key.ENTER)
-        .pause(1000)
-        .sendKeys('bbb')
-        .sendKeys(Key.ENTER)
-        .move({ x: 0, y: 0 })
-        .click()
-        .perform();
-      const withSelectedTokens = await context.takeScreenshot();
-      await context.matchImages({
-        withNotSelectedToken,
-        withAutoSelectedTokens,
-        clearedOnNullReturn,
-        withSelectedTokens,
-      });
-    });
-
-    test('token edit', async (context) => {
-      await context.webdriver
-        .actions({
-          bridge: true,
-        })
-        .click(context.webdriver.findElement({ css: '[data-comp-name~="TokenInput"]' }))
-        .pause(300)
-        .sendKeys('aaa')
-        .pause(300)
-        .sendKeys(Key.ENTER)
-        .pause(300)
-        .sendKeys('bbb')
-        .pause(300)
-        .sendKeys(Key.ENTER)
-        .pause(300)
-        .perform();
-      await context.webdriver
-        .actions({
-          bridge: true,
-        })
-        .doubleClick(context.webdriver.findElement({ css: '[data-comp-name~="Token"]' }))
-        .pause(1000)
-        .sendKeys('aaa')
-        .pause(300)
-        .move({ x: 0, y: 0 })
-        .click()
-        .pause(300)
-        .perform();
-      const withSameValue = await context.takeScreenshot();
-      await context.webdriver
-        .actions({
-          bridge: true,
-        })
-        .doubleClick(context.webdriver.findElement({ css: '[data-comp-name~="Token"]' }))
-        .pause(1000)
-        .sendKeys('zzz')
-        .pause(300)
-        .move({ x: 0, y: 0 })
-        .click()
-        .pause(300)
-        .perform();
-      const withNotEditedToken = await context.takeScreenshot();
-      await context.webdriver
-        .actions({
-          bridge: true,
-        })
-        .doubleClick(context.webdriver.findElement({ css: '[data-comp-name~="Token"]' }))
-        .pause(1000)
-        .sendKeys(Key.BACK_SPACE)
-        .sendKeys(Key.BACK_SPACE)
-        .sendKeys(Key.BACK_SPACE)
-        .sendKeys(Key.BACK_SPACE)
-        .sendKeys(Key.BACK_SPACE)
-        .sendKeys('clear')
-        .pause(300)
-        .move({ x: 0, y: 0 })
-        .click()
-        .pause(300)
-        .perform();
-      const withRemovedToken = await context.takeScreenshot();
-      await context.webdriver
-        .actions({
-          bridge: true,
-        })
-        .doubleClick(context.webdriver.findElement({ css: '[data-comp-name~="Token"]' }))
-        .pause(1000)
-        .sendKeys('EDITED')
-        .pause(300)
-        .sendKeys(Key.ARROW_DOWN)
-        .sendKeys(Key.ENTER)
-        .pause(300)
-        .move({ x: 0, y: 0 })
-        .click()
-        .pause(300)
-        .perform();
-      const withEditedToken = await context.takeScreenshot();
-      await context.matchImages({ withSameValue, withNotEditedToken, withRemovedToken, withEditedToken });
-    });
-  });
-
-  story('FullWidthMenu', ({ setStoryParameters }) => {
-    setStoryParameters({
-      skip: {
-        'do not pass on teamcity': {
-          in: ['firefox', 'firefox8px', 'firefoxFlat8px', 'firefoxDark', 'firefox2022', 'firefox2022Dark'],
-          tests: ['selectFirst'],
-        },
-      },
-    });
-
-    test('selectFirst', async (context) => {
-      await context.webdriver
-        .actions({
-          bridge: true,
-        })
-        .click(context.webdriver.findElement({ css: '[data-comp-name~="TokenInput"]' }))
-        .sendKeys('a')
-        .perform();
-      await context.matchImage(await context.takeScreenshot());
-    });
-  });
-
-  story('CustomRenderTotalCount', ({ setStoryParameters }) => {
-    setStoryParameters({
-      skip: {
-        'do not pass on teamcity': {
-          in: ['firefox', 'firefox8px', 'firefoxFlat8px', 'firefoxDark', 'firefox2022', 'firefox2022Dark'],
-          tests: ['renderTotalCount'],
-        },
-      },
-    });
-
-    test('renderTotalCount', async (context) => {
-      await context.webdriver
-        .actions({
-          bridge: true,
-        })
-        .click(context.webdriver.findElement({ css: '[data-comp-name~="TokenInput"]' }))
-        .perform();
-      await delay(1000);
-      await context.matchImage(await context.takeScreenshot());
-    });
-  });
-
-  story('WithPlaceholderAndWidth', ({ setStoryParameters }) => {
-    setStoryParameters({
-      skip: {
-        flaky: { in: /firefox/, tests: ['selected'] },
-      },
-    });
-    test('idle', async (context) => {
-      await context.matchImage(await context.takeScreenshot());
-    });
-
-    test('selected', async (context) => {
-      await context.webdriver
-        .actions({
-          bridge: true,
-        })
-        .click(context.webdriver.findElement({ css: '[data-comp-name~="TokenInput"]' }))
-        .pause(500)
-        .sendKeys('a')
-        .perform();
-      await delay(1000);
-      await context.webdriver
-        .actions({
-          bridge: true,
-        })
-
-        .click(context.webdriver.findElement({ css: '[data-comp-name~="MenuItem"]' }))
-        .perform();
-      await delay(1000);
-      await context.matchImage(await context.takeScreenshot());
-    });
-  });
-
-  story('Size', ({ setStoryParameters }) => {
-    setStoryParameters({
-      captureElement: '[data-tid="Gapped__vertical"]',
-    });
-
-    test('MenuItem inherits size', async (context) => {
-      await context.webdriver.actions({ bridge: true }).keyDown(Key.TAB).perform();
-      const tab1 = await context.takeScreenshot();
-
-      await context.webdriver.actions({ bridge: true }).keyDown(Key.TAB).perform();
-      const tab2 = await context.takeScreenshot();
-
-      await context.webdriver.actions({ bridge: true }).keyDown(Key.TAB).perform();
-      const tab3 = await context.takeScreenshot();
-
-      await context.matchImages({ tab1, tab2, tab3 });
-    });
-  });
-
-  story('VariousMenuPositions', ({ setStoryParameters }) => {
-    setStoryParameters({
-      skip: { 'chrome only': { in: /^(?!\bchrome2022\b)/ } },
-    });
-
-    test('all positions in viewport', async (context) => {
-      async function clickOnTokenInput(tid: string): Promise<Buffer> {
-        await context.webdriver
-          .actions({ bridge: true })
-          .click(context.webdriver.findElement({ css: `[data-tid~="${tid}"]` }))
-          .perform();
-        await delay(800);
-        return await context.takeScreenshot();
-      }
-
-      const leftTop = await clickOnTokenInput('TokenInputViewLeftTop');
-      const leftMiddle = await clickOnTokenInput('TokenInputViewLeftMiddle');
-      const leftBottom = await clickOnTokenInput('TokenInputViewLeftBottom');
-      const rightTop = await clickOnTokenInput('TokenInputViewRightTop');
-      const rightMiddle = await clickOnTokenInput('TokenInputViewRightMiddle');
-      const rightBottom = await clickOnTokenInput('TokenInputViewRightBottom');
-
-      await context.matchImages({ leftTop, leftMiddle, leftBottom, rightTop, rightMiddle, rightBottom });
-    });
-  });
-});

package/cjs/components/TokenInput/__docs__/TokenInput.mdx

@@ -1,27 +0,0 @@
-import * as TokenInputStories from './TokenInput.docs.stories.tsx';
-import { Primary, ArgTypes, Stories, Description } from '@storybook/blocks';
-import { Meta } from '../../../.storybook/Meta';
-import { Header } from '../../../.storybook/Header';
-import { PropsTable } from '../../../.storybook/PropsTable';
-
-<Meta of={TokenInputStories} />
-
-<Header
-  component="TokenInput"
-  guides="https://guides.kontur.ru/components/input-fields/tokens/"
-  figma="https://www.figma.com/file/87ScqxPzJpF9DcVBNYWOjM/%E2%9A%A1-Kontur-UI-Modern-Layout?node-id=230%3A2955"
-/>
-
-<Description />
-
-## Базовый пример
-
-<Primary />
-
-## Пропы
-
-<PropsTable />
-
-## Примеры использования
-
-<Stories title="" includePrimary={false} />