Modal (Модальное окно)

Портальное окно поверх приложения: диалог, шторка (sheet) или поповер. Закрывается по ESC и клику на фон. Управляется состоянием open; содержимое — любые дочерние компоненты.

Метод	Аргумент	Описание
`open(v)`	`boolean`	Управляет видимостью окна. Значение по умолчанию: `false`
`title(v)`	`string`	Заголовок в шапке окна.
`variant(v)`	`'modal' \| 'sheet' \| 'popover'`	Тип оверлея: центрированный диалог, нижняя шторка или поповер. Значение по умолчанию: `'modal'`
`closeOnBackdrop(v)`	`boolean`	Закрывать окно по клику на затемнённый фон. Значение по умолчанию: `true`
`onClose(v)`	`CallbackFunction`	Коллбек закрытия (ESC, клик на фон).

Базовые методы (наследуются от UIComponent)

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

// Диалог подтверждения
const { ui, createState } = PotokSDK;
const state = createState({ open: false });

function draw() {
  ui.render(
    VStack()
      .spacing(12)
      .children([
        Button("Открыть окно").onClick(() => state.open = true),
        Modal()
          .open(state.open)
          .title("Подтверждение")
          .variant("modal")
          .closeOnBackdrop(true)
          .onClose(() => state.open = false)
          .child(Text("Вы уверены, что хотите продолжить?").variant("secondary"))
          .child(
            HStack()
              .spacing(8)
              .children([
                Button("Отмена").variant("secondary").onClick(() => state.open = false),
                Button("Продолжить").variant("primary").onClick(() => {
                  state.open = false;
                  ui.showHUD("success", "Готово");
                })
              ])
          )
      ])
  );
}
state.$subscribe(draw); draw();

Запустить в Sandbox