Компоненты

UndoToaster

«Отменить» с тающим таймером вместо диалога подтверждения.

«Отменить» с видимым таймером вместо диалога подтверждения. Действие выполняется сразу, а рядом на несколько секунд появляется отмена с тающим кольцом.

Пример

Импорт из Trello
Отчёт по спринту
Черновик релиза
Старый бэклог

Удалите несколько подряд — предложения отмены сольются в одно с счётчиком.

<UndoToaster onUndo={(a) => restore(a.payload)}>
  {({ notify }) => (
    <button onClick={() => {
      remove(item);
      notify({ label: "Удалено", mergeKey: "delete", payload: item });
    }}>Удалить</button>
  )}
</UndoToaster>

Пропсы

Проп	Тип	По умолчанию	Описание
`onUndo`*	`(action) => void`	—	Что сделать при нажатии «Отменить».
`children`*	`(controller) => ReactNode`	—	Даёт notify — его зовут из обработчиков действий.
`ttlMs`	`number`	`5000`	Сколько живёт предложение по умолчанию.
`placement`	`"bottom" \| "bottom-left" \| "bottom-right"`	`"bottom"`	Куда прижать.

onUndo*(action) => void

Что сделать при нажатии «Отменить».

children*(controller) => ReactNode

Даёт notify — его зовут из обработчиков действий.

ttlMsnumber

по умолчанию: 5000

Сколько живёт предложение по умолчанию.

placement"bottom" | "bottom-left" | "bottom-right"

по умолчанию: "bottom"

Куда прижать.

Слияние серий

Стек отдельно

tsx

import {
  pushUndo,      // положить действие (со слиянием серий)
  expireUndo,    // разделить на живые и истёкшие
  undoProgress,  // доля прожитого времени — для кольца
  undoLabel,     // подпись с счётчиком серии
} from "@toimetdev/pathlogs-core";