ФреймворкJavaScript

Переключатель: сворачиваемый контент

Сворачиваемый блок-переключатель с кликабельной стрелкой. Дочерние блоки вкладываются внутрь переключателя и скрываются, когда он свёрнут.

Переключать его можно кликом по иконке стрелки или программно через публичный Block API: api.blocks.getById(id)?.call("expand") / .call("collapse"). Сворачиваемые заголовки (блоки Header с isToggleable: true) принимают те же две команды. Это команды, которые адресуются строкой и маршрутизируются через BlockAPI.call(). Как методы экспортируемых классов инструментов они не объявлены.

Состояние «открыт или свёрнут» у каждого своё. Каждый браузер запоминает его сам, и оно никогда не сохраняется. Переключатель открывается свёрнутым, кроме как у того, кто его только что создал.

Импорт

TypeScript

import { Toggle } from '@bloklabs/core/tools';

Конфигурация

Опция	Тип	По умолчанию	Описание
`placeholder`	`string`	`"Toggle"`	Плейсхолдер, который показывается в пустом блоке переключателя.

Формат данных

TypeScript

interface ToggleData {
  text: RichText; // Toggle title as segments (ToggleToolData holds HTML)
}

JSON

{
  "id": "mno345",
  "type": "toggle",
  "data": {
    "text": [{ "text": "Click to expand" }]
  }
}

Пример использования

TypeScript

import { Blok } from '@bloklabs/core';
import { Toggle } from '@bloklabs/core/tools';

const editor = new Blok({
  holder: 'editor',
  tools: {
    toggle: {
      class: Toggle,
      placeholder: 'Toggle heading…',
    },
  },
});