Компоненты

EditableText

Правка текста по клику прямо на месте.

Текст, который правится по клику прямо на месте: название задачи, описание, заметка. Без отдельной формы и без режима редактирования у всей страницы.

Пример

Починить импорт из Trello

Падает на досках, где больше 500 карточек.

import { EditableText } from "@toimetdev/pathlogs-core";

<EditableText
  value={task.title}
  onSave={(next) => updateTask(task.id, { title: next })}
  big
  tip="Нажмите, чтобы переименовать"
/>

<EditableText
  value={task.description}
  onSave={(next) => updateTask(task.id, { description: next })}
  multiline
  markdown
  placeholder="Добавить описание…"
/>

Поведение

Сохранение — по потере фокуса и по Enter в однострочном поле. В многострочном Enter переносит строку, как и положено.
Escape отменяет правку и возвращает исходное значение.
Клавиатура открывает правку так же, как мышь: Enter или пробел на сфокусированном тексте.
Пока идёт сохранение текст приглушён — видно, что изменение ещё не доехало.

Пропсы

Проп	Тип	По умолчанию	Описание
`value`*	`string`	—	Текущее значение.
`onSave`*	`(next: string) => void \| Promise<void>`	—	Сохранение. Пока промис не разрешится, текст показан приглушённо.
`multiline`	`boolean`	`false`	Многострочное поле вместо однострочного.
`markdown`	`boolean`	`false`	Показывать значение как ограниченный Markdown в режиме просмотра. Работает вместе с multiline.
`big`	`boolean`	`false`	Крупный кегль — для заголовков.
`placeholder`	`string`	`"—"`	Что показать вместо пустого значения.
`tip`	`string`	—	Подсказка при наведении на текст.
`rows`	`number`	`5`	Высота многострочного поля.
`disabled`	`boolean`	`false`	Правка запрещена — например, нет прав.

value*string

Текущее значение.

onSave*(next: string) => void | Promise<void>

Сохранение. Пока промис не разрешится, текст показан приглушённо.

multilineboolean

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

Многострочное поле вместо однострочного.

markdownboolean

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

Показывать значение как ограниченный Markdown в режиме просмотра. Работает вместе с multiline.

bigboolean

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

Крупный кегль — для заголовков.

placeholderstring

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

Что показать вместо пустого значения.

tipstring

Подсказка при наведении на текст.

rowsnumber

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

Высота многострочного поля.

disabledboolean

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

Правка запрещена — например, нет прав.