@skbkontur/react-ui 5.1.7 → 5.2.0

package/cjs/components/Sticky/__docs__/Sticky.mdx

@@ -1,23 +0,0 @@
-import * as StickyStories from './Sticky.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={StickyStories} />
-
-<Header component="Sticky" />
-
-<Description />
-
-## Базовый пример
-
-<Primary />
-
-## Пропы
-
-<PropsTable />
-
-## Примеры использования
-
-<Stories title="" includePrimary={false} />

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

@@ -1,24 +0,0 @@
-import { story, kind, test } from 'creevey';
-
-kind('Switcher', () => {
-  story('Horizontal', () => {
-    test('idle', async (context) => {
-      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~="Button"]' }))
-        .perform();
-      await context.matchImage(await context.takeScreenshot(), 'clicked');
-    });
-  });
-  story('WithCustomRenderItems', ({ setStoryParameters }) => {
-    setStoryParameters({
-      skip: { 'chrome only': { in: /^(?!\bchrome2022\b)/ } },
-    });
-  });
-});

package/cjs/components/Switcher/__docs__/Switcher.mdx

@@ -1,27 +0,0 @@
-import * as SwitcherStories from './Switcher.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={SwitcherStories} />
-
-<Header
-  component="Switcher"
-  guides="https://guides.kontur.ru/components/selection-elements/switcher/"
-  figma="https://www.figma.com/file/87ScqxPzJpF9DcVBNYWOjM/%E2%9A%A1-Kontur-UI-Modern-Layout?node-id=281%3A17973"
-/>
-
-<Description />
-
-## Базовый пример
-
-<Primary />
-
-## Пропы
-
-<PropsTable />
-
-## Примеры использования
-
-<Stories title="" includePrimary={false} />

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

@@ -1,239 +0,0 @@
-import { story, kind, test } from 'creevey';
-import { Key } from 'selenium-webdriver';
-
-import { delay } from '../../../lib/delay';
-
-const tabsSimpleTests = () => {
-  test('move focus forward', async (context) => {
-    await context.webdriver
-      .actions({
-        bridge: true,
-      })
-      .click(context.webdriver.findElement({ css: '[data-comp-name~="Tab"]:nth-child(1)' }))
-      .perform();
-    await context.webdriver
-      .actions({
-        bridge: true,
-      })
-      .sendKeys(Key.ARROW_RIGHT)
-      .pause(500)
-      .sendKeys(Key.ARROW_DOWN)
-      .perform();
-    await context.matchImage(await context.takeScreenshot(), 'move focus forward');
-  });
-  test('move focus backward', async (context) => {
-    await context.webdriver
-      .actions({
-        bridge: true,
-      })
-      .click(context.webdriver.findElement({ css: '[data-comp-name~="Tab"]:nth-child(3)' }))
-      .perform();
-    await delay(1000);
-    await context.webdriver
-      .actions({
-        bridge: true,
-      })
-      .sendKeys(Key.ARROW_LEFT)
-      .perform();
-    await delay(1000);
-    await context.webdriver
-      .actions({
-        bridge: true,
-      })
-      .sendKeys(Key.ARROW_UP)
-      .perform();
-    await context.matchImage(await context.takeScreenshot(), 'move focus backward');
-  });
-  test('reset focus after click', async (context) => {
-    await context.webdriver
-      .actions({
-        bridge: true,
-      })
-      .click(context.webdriver.findElement({ css: '[data-comp-name~="Tab"]:nth-child(1)' }))
-      .perform();
-    await context.webdriver
-      .actions({
-        bridge: true,
-      })
-      .sendKeys(Key.ARROW_RIGHT)
-      .pause(500)
-      .click(context.webdriver.findElement({ css: '[data-comp-name~="Tab"]:nth-child(3)' }))
-      .perform();
-    await context.matchImage(await context.takeScreenshot(), 'reset focus after click');
-  });
-};
-const tabsTests = () => {
-  test('plain', async (context) => {
-    await context.matchImage(await context.takeScreenshot(), 'plain');
-  });
-
-  test('hovered', async (context) => {
-    await context.webdriver
-      .actions({
-        bridge: true,
-      })
-      .move({
-        origin: context.webdriver.findElement({ css: '[data-comp-name~="Tab"]:nth-child(2)' }),
-      })
-      .perform();
-    await context.matchImage(await context.takeScreenshot(), 'hovered');
-  });
-
-  test('clicked', async (context) => {
-    await context.webdriver
-      .actions({
-        bridge: true,
-      })
-      .click(context.webdriver.findElement({ css: '[data-comp-name~="Tab"]:nth-child(2)' }))
-      .perform();
-    await context.matchImage(await context.takeScreenshot(), 'clicked');
-  });
-
-  test('mouseLeave', async (context) => {
-    await context.webdriver
-      .actions({
-        bridge: true,
-      })
-      .click(context.webdriver.findElement({ css: '[data-comp-name~="Tab"]:nth-child(2)' }))
-      .move({
-        origin: context.webdriver.findElement({ css: 'body' }),
-      })
-      .perform();
-    await context.matchImage(await context.takeScreenshot(), 'mouseLeave');
-  });
-
-  test('focused', async (context) => {
-    await context.webdriver
-      .actions({
-        bridge: true,
-      })
-      .click(context.webdriver.findElement({ css: '[data-comp-name~="Tab"]:nth-child(2)' }))
-      .move({
-        origin: context.webdriver.findElement({ css: 'body' }),
-      })
-      .click(context.webdriver.findElement({ css: '[data-comp-name~="Tab"]:nth-child(2)' }))
-      .perform();
-    await context.matchImage(await context.takeScreenshot(), 'focused');
-  });
-
-  test('tabPress', async (context) => {
-    await context.webdriver
-      .actions({
-        bridge: true,
-      })
-      .click(context.webdriver.findElement({ css: '[data-comp-name~="Tab"]:nth-child(2)' }))
-      .perform();
-    await delay(1000);
-    await context.webdriver
-      .actions({
-        bridge: true,
-      })
-      .sendKeys(Key.TAB)
-      .perform();
-    await delay(1000);
-    await context.matchImage(await context.takeScreenshot(), 'tabPress');
-  });
-
-  test('enterPress', async (context) => {
-    await context.webdriver
-      .actions({
-        bridge: true,
-      })
-      .click(context.webdriver.findElement({ css: '[data-comp-name~="Tab"]:nth-child(2)' }))
-      .perform();
-    await delay(1000);
-    await context.webdriver
-      .actions({
-        bridge: true,
-      })
-      .sendKeys(Key.TAB)
-      .perform();
-    await delay(1000);
-    await context.webdriver
-      .actions({
-        bridge: true,
-      })
-      .sendKeys(Key.ENTER)
-      .perform();
-    await delay(1000);
-    await context.matchImage(await context.takeScreenshot(), 'enterPress');
-  });
-};
-
-kind('Tabs', () => {
-  story('WithDisabledTab', () => {
-    tabsTests();
-  });
-  story('Simple', ({ setStoryParameters }) => {
-    setStoryParameters({
-      skip: {
-        'hover does not work in chrome': {
-          in: ['chrome2022', 'chrome2022Dark'],
-          tests: ['hovered'],
-        },
-      },
-    });
-
-    tabsTests();
-    tabsSimpleTests();
-  });
-  story('SimpleMedium', ({ setStoryParameters }) => {
-    setStoryParameters({
-      skip: {
-        'hover does not work in chrome': {
-          in: ['chrome2022', 'chrome2022Dark'],
-          tests: ['hovered'],
-        },
-      },
-    });
-
-    tabsTests();
-    tabsSimpleTests();
-  });
-  story('SimpleSmall', ({ setStoryParameters }) => {
-    setStoryParameters({
-      skip: {
-        'hover does not work in chrome': {
-          in: ['chrome2022', 'chrome2022Dark'],
-          tests: ['hovered'],
-        },
-      },
-    });
-
-    tabsTests();
-    tabsSimpleTests();
-  });
-  story('Vertical', ({ setStoryParameters }) => {
-    setStoryParameters({
-      skip: {
-        'hover does not work in chrome': {
-          in: ['chrome2022', 'chrome2022Dark'],
-          tests: ['hovered', 'enterPress'],
-        },
-      },
-    });
-    tabsTests();
-  });
-  story('VerticalMedium', ({ setStoryParameters }) => {
-    setStoryParameters({
-      skip: {
-        'hover does not work in chrome': {
-          in: ['chrome2022', 'chrome2022Dark'],
-          tests: ['hovered', 'enterPress'],
-        },
-      },
-    });
-    tabsTests();
-  });
-  story('VerticalSmall', ({ setStoryParameters }) => {
-    setStoryParameters({
-      skip: {
-        'hover does not work in chrome': {
-          in: ['chrome2022', 'chrome2022Dark'],
-          tests: ['hovered', 'enterPress'],
-        },
-      },
-    });
-    tabsTests();
-  });
-});

package/cjs/components/Tabs/__docs__/Tab.mdx

@@ -1,27 +0,0 @@
-import * as TabStories from './Tab.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={TabStories} />
-
-<Header
-  component="Tab"
-  guides="https://guides.kontur.ru/components/navigation/tabs/"
-  figma="https://www.figma.com/file/87ScqxPzJpF9DcVBNYWOjM/%E2%9A%A1-Kontur-UI-Modern-Layout?node-id=281%3A17620"
-/>
-
-<Description />
-
-## Базовый пример
-
-<Primary />
-
-## Пропы
-
-<PropsTable />
-
-## Примеры использования
-
-<Stories title="" includePrimary={false} />

package/cjs/components/Tabs/__docs__/Tabs.mdx

@@ -1,27 +0,0 @@
-import * as TabsStories from './Tabs.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={TabsStories} />
-
-<Header
-  component="Tabs"
-  guides="https://guides.kontur.ru/components/navigation/tabs/"
-  figma="https://www.figma.com/file/87ScqxPzJpF9DcVBNYWOjM/%E2%9A%A1-Kontur-UI-Modern-Layout?node-id=281%3A17620"
-/>
-
-<Description />
-
-## Базовый пример
-
-<Primary />
-
-## Пропы
-
-<PropsTable />
-
-## Примеры использования
-
-<Stories title="" includePrimary={false} />

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

@@ -1,177 +0,0 @@
-import { story, kind, test } from 'creevey';
-import { Key } from 'selenium-webdriver';
-
-import { delay } from '../../../lib/delay';
-
-kind('Textarea', () => {
-  story('DifferentStates', () => {
-    test('Plain', async (context) => {
-      await delay(1000);
-      await context.matchImage(await context.takeScreenshot(), 'Plain');
-    });
-
-    test('Focus', async (context) => {
-      await context.webdriver
-        .actions({
-          bridge: true,
-        })
-        .click(context.webdriver.findElement({ css: '#TextareaPlain textarea' }))
-        .perform();
-      await delay(1000);
-      await context.matchImage(await context.takeScreenshot(), 'Focus');
-    });
-
-    test('FocusedByTab', async (context) => {
-      await context.webdriver
-        .actions({
-          bridge: true,
-        })
-        .move({ x: 0, y: 0 })
-        .click()
-        .sendKeys(Key.TAB)
-        .sendKeys(Key.TAB)
-        .perform();
-      await delay(1000);
-      await context.matchImage(await context.takeScreenshot(), 'Focused by tab');
-    });
-
-    test('Typed', async (context) => {
-      await context.webdriver
-        .actions({
-          bridge: true,
-        })
-        .click(context.webdriver.findElement({ css: '#TextareaPlain textarea' }))
-        .sendKeys('Test...')
-        .perform();
-      await delay(1000);
-      await context.matchImage(await context.takeScreenshot(), 'Typed');
-    });
-  });
-
-  story('AutoresizableTextareaStory', () => {
-    test('autoresize', async (context) => {
-      const textArea = () => context.webdriver.findElement({ css: '[data-tid~="TextArea"]' });
-      const before = await textArea().takeScreenshot();
-      await context.webdriver
-        .actions({
-          bridge: true,
-        })
-        .click(context.webdriver.findElement({ css: '[data-tid~="AddButton"]' }))
-        .pause(500)
-        .perform();
-      const addText = await textArea().takeScreenshot();
-      await context.webdriver
-        .actions({
-          bridge: true,
-        })
-        .click(context.webdriver.findElement({ css: '[data-tid~="CollapseButton"]' }))
-        .pause(500)
-        .perform();
-      const collapse = await textArea().takeScreenshot();
-      await context.matchImages({ before, addText, collapse });
-    });
-  });
-
-  story('SelectAllByProp', () => {
-    test('Plain', async (context) => {
-      await delay(1000);
-      await context.matchImage(await context.takeScreenshot(), 'Plain');
-    });
-
-    test('Focused', async (context) => {
-      await context.webdriver
-        .actions({
-          bridge: true,
-        })
-        .click(context.webdriver.findElement({ css: 'label' }))
-        .pause(500)
-        .perform();
-      await delay(1000);
-      await context.matchImage(await context.takeScreenshot(), 'Focused');
-    });
-  });
-
-  story('SelectAllByButton', () => {
-    test('Plain', async (context) => {
-      await delay(1000);
-      await context.matchImage(await context.takeScreenshot(), 'Plain');
-    });
-
-    test('Selected', async (context) => {
-      await context.webdriver
-        .actions({
-          bridge: true,
-        })
-        .click(context.webdriver.findElement({ css: '[data-tid="select-all"]' }))
-        .pause(500)
-        .perform();
-      await delay(1000);
-      await context.matchImage(await context.takeScreenshot(), 'Selected');
-    });
-  });
-
-  story('TextareaWithCounters', ({ setStoryParameters }) => {
-    setStoryParameters({
-      skip: {
-        'flacky scrollbars height': {
-          in: ['firefox', 'firefox8px', 'firefoxFlat8px', 'firefoxDark'],
-        },
-      },
-    });
-
-    test('Plain', async (context) => {
-      await delay(1000);
-      await context.matchImage(await context.takeScreenshot(), 'Plain');
-    });
-
-    test('Focus', async (context) => {
-      await context.webdriver
-        .actions({
-          bridge: true,
-        })
-        .click(context.webdriver.findElement({ css: '#CounterPlain textarea' }))
-        .perform();
-      await delay(1000);
-      await context.matchImage(await context.takeScreenshot(), 'Focus');
-    });
-
-    test('FocusAutoresize', async (context) => {
-      await context.webdriver
-        .actions({
-          bridge: true,
-        })
-        .click(context.webdriver.findElement({ css: '#CounterAutoresizeTextarea textarea' }))
-        .perform();
-      await delay(1000);
-      await context.matchImage(await context.takeScreenshot(), 'FocusAutoresize');
-    });
-
-    test('FocusWithHelpClosed', async (context) => {
-      await context.webdriver
-        .actions({
-          bridge: true,
-        })
-        .click(context.webdriver.findElement({ css: '#CounterWithHelp textarea' }))
-        .perform();
-      await delay(1000);
-      await context.matchImage(await context.takeScreenshot(), 'CounterWithHelp');
-    });
-
-    test('FocusWithHelpOpened', async (context) => {
-      await context.webdriver
-        .actions({
-          bridge: true,
-        })
-        .click(context.webdriver.findElement({ css: '#CounterWithHelp textarea' }))
-        .perform();
-      await context.webdriver
-        .actions({
-          bridge: true,
-        })
-        .click(context.webdriver.findElement({ css: `svg` }))
-        .perform();
-      await delay(1000);
-      await context.matchImage(await context.takeScreenshot(), 'CounterWithHelpOpened');
-    });
-  });
-});

package/cjs/components/Textarea/__docs__/Textarea.mdx

@@ -1,27 +0,0 @@
-import * as TextareaStories from './Textarea.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={TextareaStories} />
-
-<Header
-  component="Textarea"
-  guides="https://guides.kontur.ru/components/input-fields/textarea/"
-  figma="https://www.figma.com/file/87ScqxPzJpF9DcVBNYWOjM/%E2%9A%A1-Kontur-UI-Modern-Layout?node-id=203%3A2333"
-/>
-
-<Description />
-
-## Базовый пример
-
-<Primary />
-
-## Пропы
-
-<PropsTable />
-
-## Примеры использования
-
-<Stories title="" includePrimary={false} />

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

@@ -1,77 +0,0 @@
-import { story, kind, test } from 'creevey';
-
-import { delay } from '../../../lib/delay';
-
-const kindTests = () => {
-  test('toastShown', async (context) => {
-    const showToast = context.webdriver.findElement({ css: '[data-tid~="show-toast"]' });
-    await context.webdriver.actions({ bridge: true }).click(showToast).move({ x: 0, y: 0 }).click().perform();
-    await delay(1000);
-    await context.matchImage(await context.takeScreenshot());
-  });
-};
-
-kind('Toast', () => {
-  story('SimpleNotification', () => {
-    kindTests();
-  });
-
-  story('TestNotifier', () => {
-    kindTests();
-  });
-
-  story('ComplexNotification', () => {
-    kindTests();
-  });
-
-  story('complex', () => {
-    kindTests();
-  });
-
-  story('StaticMethod', () => {
-    kindTests();
-  });
-
-  story('button', () => {
-    kindTests();
-  });
-
-  story('data-tid', () => {
-    kindTests();
-  });
-
-  story('onClick', () => {
-    kindTests();
-  });
-
-  story('Toast', () => {
-    kindTests();
-  });
-
-  story('push', () => {
-    kindTests();
-  });
-
-  story('ToastWithCross', () => {
-    test('idle', async (context) => {
-      const showStaticToastButton = context.webdriver.findElement({ css: '[data-tid="show-static-toast"]' });
-      const showInstanceToastButton = context.webdriver.findElement({ css: '[data-tid="show-instance-toast"]' });
-
-      await context.webdriver.actions({ bridge: true }).click(showStaticToastButton).perform();
-      await delay(1000);
-      const staticToast = await context.takeScreenshot();
-
-      const closeFirstToast = context.webdriver.findElement({ css: '[data-tid="ToastView__close"]' });
-      await context.webdriver
-        .actions({ bridge: true })
-        .click(closeFirstToast)
-        .pause(100)
-        .click(showInstanceToastButton)
-        .perform();
-      await delay(1000);
-      const instanceToast = await context.takeScreenshot();
-
-      await context.matchImages({ staticToast, instanceToast });
-    });
-  });
-});

package/cjs/components/Toast/__docs__/Toast.mdx

@@ -1,27 +0,0 @@
-import * as ToastStories from './Toast.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={ToastStories} />
-
-<Header
-  component="Toast"
-  guides="https://guides.kontur.ru/components/popup-elements/toast/"
-  figma="https://www.figma.com/file/87ScqxPzJpF9DcVBNYWOjM/%E2%9A%A1-Kontur-UI-Modern-Layout?node-id=230%3A5203"
-/>
-
-<Description />
-
-## Базовый пример
-
-<Primary />
-
-## Пропы
-
-<PropsTable />
-
-## Примеры использования
-
-<Stories title="" includePrimary={false} />