ФреймворкJavaScript
Параграф: базовый текстовый блок
Текстовый блок по умолчанию. Поддерживает полноценное строчное форматирование (жирный, курсив, ссылки, цвет). Пустые параграфы верхнего уровня не попадают в сохраняемые данные, если не включён `preserveBlank`; пустые параграфы, вложенные в другой блок (выноска, переключатель, колонка, …), сохраняются всегда.
Импорт
TypeScript
import { Paragraph } from '@bloklabs/core/tools';Конфигурация
| Опция | Тип | По умолчанию | Описание |
|---|---|---|---|
placeholder | string | "Write something or press / to select a tool" (localised) | Плейсхолдер, который показывается, когда блок пуст и находится в фокусе. |
preserveBlank | boolean | false | Если true, пустые блоки-параграфы остаются в сохраняемых данных. Исключение: документ из одного пустого блока инструмента по умолчанию всегда сохраняется как `blocks: []`, независимо от этой опции. |
styles.size | string | undefined | Собственное значение CSS-свойства font-size (например, "18px", "1.25rem"). |
styles.lineHeight | string | undefined | Собственное значение CSS-свойства line-height (например, "1.8", "28px"). |
styles.marginTop | string | undefined | Собственное значение CSS-свойства margin-top (например, "12px", "0.75rem"). |
styles.marginBottom | string | undefined | Собственное значение CSS-свойства margin-bottom. |
Формат данных
TypeScript
interface ParagraphData {
text: string; // HTML string (may include <b>, <i>, <a>, <mark>)
textColor?: string; // Block colour preset, present when set
backgroundColor?: string; // Block background colour preset, present when set
}JSON
{
"id": "abc123",
"type": "paragraph",
"data": {
"text": "Hello <b>world</b>"
}
}Пример использования
TypeScript
import { Blok } from '@bloklabs/core';
import { Paragraph } from '@bloklabs/core/tools';
const editor = new Blok({
holder: 'editor',
tools: {
paragraph: {
class: Paragraph,
placeholder: 'Start writing…',
preserveBlank: false,
},
},
});