@snack-uikit/stepper 0.8.38 → 0.8.39

package/CHANGELOG.md

@@ -3,6 +3,16 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## <small>0.8.39 (2026-01-19)</small>
+
+* chore(FF-6693): migrate tests from TestCafe to Playwright ([f32aff8](https://github.com/cloud-ru-tech/snack-uikit/commit/f32aff8))
+* chore(FF-6693): tune test configs ([d194f4d](https://github.com/cloud-ru-tech/snack-uikit/commit/d194f4d))
+* docs(FF-7788): readme update ([e3142b8](https://github.com/cloud-ru-tech/snack-uikit/commit/e3142b8))
+
+
+
+
+
 ## <small>0.8.38 (2025-11-28)</small>
 
 ### Only dependencies have been changed

package/README.md

@@ -1,47 +1,60 @@
 # Stepper
 
-Компонент отображения состояния пошагового процесса.
-
 ## Installation
 `npm i @snack-uikit/stepper`
 
 [Changelog](./CHANGELOG.md)
 
-#### Использование
+## Description
 
-Компонент принимает массив шагов. В проп children принимает render-колбек, в который отдает сам компонент, методы управления и поля состояния.
-При вызове метода `goNext` вызывается валидация текущего шага. Функция валидации принимает индекс текущего шага и должна вернуть результат валидации в Promise<boolean>. При успешной валдиции компонент переходит на следующий шаг, а при ошибке остается на текущем.
-При вызове метода `goPrev` компонент переходит на предыдущий шаг.
+- Пакет `@snack-uikit/stepper` предоставляет компонент `Stepper` для отображения состояния пошагового процесса и управления навигацией между шагами.
+- Компонент использует паттерн render prop: принимает функцию-колбек в пропе `children`, которая получает JSX-элемент степпера, методы управления навигацией (`goNext`, `goPrev`) и состояние процесса (`isCompleted`, `currentStepIndex`, `stepCount`).
+- Поддерживает валидацию шагов через асинхронную функцию-валидатор (`validator`), которая вызывается при переходе на следующий шаг и должна вернуть `Promise<boolean>`: при успешной валидации происходит переход, при ошибке шаг остаётся в состоянии отклонения (`rejected`).
+- Каждый шаг может находиться в одном из состояний: `completed` (завершён), `current` (текущий), `loading` (идёт валидация), `waiting` (ожидает выполнения) или `rejected` (отклонён).
+- Позволяет навигироваться между шагами программно через методы API или кликом по шагам: можно перейти на следующий шаг, вернуться на предыдущий, а также кликнуть на завершённый шаг для возврата к нему.
+- Поддерживает отслеживание завершённости всего процесса, сброс состояния валидации для текущего шага и динамическое переопределение валидатора через `setValidator`.
+- Каждый шаг может содержать заголовок (`title`) и описание (`description`), которые отображаются в визуальном представлении степпера.
+- Figma: [`Stepper`](https://www.figma.com/file/jtGxAPvFJOMir7V0eQFukN/Snack-UI-Kit-1.1.0?node-id=41%3A33355&mode=design).
 
+## Example
 
 ```tsx
-const steps = [
-  { title: 'Step #1' },
-  { title: 'Step #2' },
-  { title: 'Step #3' },
-  { title: 'Step #4' },
-];
-
-// ...
-
-return (
-  <Stepper steps={steps} validator={validatorFunction}>
-    {({
-        stepper, // JSX элемент компонента
-        isCompleted, // состояние завершенности всей цепочки
-        goNext, // функция перехода к след. шагу
-        goPrev, // функция перехода к предыдущему шагу
-        setValidator, // функция установки валидатора
-      }) => (
-      <>
-        {stepper}
-
-        <button onClick={() => goPrev()}>go back</button>
-        <button onClick={() => goNext()}>go next</button>
-      </>
-    )}
-  </Stepper>
-)
+import { Stepper } from '@snack-uikit/stepper';
+
+function Example() {
+  const steps = [
+    { title: 'First step', description: 'First step long description two lines truncated' },
+    { title: 'Second step', description: 'Second step long description two lines truncated' },
+    { title: 'Third step', description: 'Third step long description two lines truncated' },
+    { title: 'Fourth step', description: 'Fourth step long description two lines truncated' },
+  ];
+
+  const validator = (currentStepIndex: number, newStepIndex: number) => {
+    // Асинхронная валидация текущего шага
+    return new Promise<boolean>(resolve => {
+      setTimeout(() => {
+        resolve(true); // или false при ошибке валидации
+      }, 1000);
+    });
+  };
+
+  return (
+    <Stepper steps={steps} validator={validator}>
+      {({ stepper, isCompleted, goNext, goPrev, resetValidation, currentStepIndex }) => (
+        <>
+          {stepper}
+          <div>
+            <button onClick={() => goPrev()}>Назад</button>
+            <button onClick={() => goNext()}>Далее</button>
+            <button onClick={resetValidation}>Сбросить валидацию</button>
+          </div>
+          <div>Текущий шаг: {currentStepIndex + 1}</div>
+          <div>Процесс завершён: {isCompleted ? 'да' : 'нет'}</div>
+        </>
+      )}
+    </Stepper>
+  );
+}
 ```
 [//]: DOCUMENTATION_SECTION_START
 [//]: THIS_SECTION_IS_AUTOGENERATED_PLEASE_DONT_EDIT_IT

package/package.json

@@ -4,7 +4,7 @@
     "access": "public"
   },
   "title": "Stepper",
-  "version": "0.8.38",
+  "version": "0.8.39",
   "sideEffects": [
     "*.css",
     "*.woff",
@@ -36,12 +36,12 @@
   "license": "Apache-2.0",
   "scripts": {},
   "dependencies": {
-    "@snack-uikit/icons": "0.27.4",
-    "@snack-uikit/loaders": "0.9.9",
-    "@snack-uikit/truncate-string": "0.7.6",
-    "@snack-uikit/typography": "0.8.11",
-    "@snack-uikit/utils": "4.0.0",
+    "@snack-uikit/icons": "0.27.5",
+    "@snack-uikit/loaders": "0.9.10",
+    "@snack-uikit/truncate-string": "0.7.7",
+    "@snack-uikit/typography": "0.8.12",
+    "@snack-uikit/utils": "4.0.1",
     "classnames": "2.5.1"
   },
-  "gitHead": "6b39e180766635f8190da903bf560d1fbcbfaf52"
+  "gitHead": "84371bbf91915f650a852df849cd71d416c5b7b2"
 }