DetailHero (Hero детальной страницы)

Крупный баннер детальной страницы: фон, логотип/заголовок, метаданные, бейджи и настраиваемые кнопки действий. Клик по кнопке возвращает её id.

Специфичные методы DetailHero

Метод	Аргумент	Описание
item(v)	SDKContentItem	Featured-элемент: wideImage/logo/title/subtitle/meta/badges.
actions(v)	Array<{ id, label, icon?, variant? }>	Кнопки действий. variant: ‘ghost’ — прозрачная. Значение по умолчанию: []
onAction(v)	CallbackFunction	Коллбек клика по кнопке. Передаёт id действия.

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

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

// Hero детальной страницы
const { ui } = PotokSDK;

ui.render(
  DetailHero()
    .item({
      id: "1",
      title: "Дюна: Часть вторая",
      subtitle: "Пол Атрейдес объединяется с Чани и фрименами...",
      wideImage: "https://image.tmdb.org/t/p/original/xu9zaAevzQ5nnrsXN6JcahLnG4i.jpg",
      meta: ["2024", "Фантастика", "2ч 46м"],
      badges: [{ text: "4K", color: "info" }]
    })
    .actions([
      { id: "play", label: "Смотреть", icon: "play" },
      { id: "trailer", label: "Трейлер", icon: "film", variant: "ghost" }
    ])
    .onAction((actionId) => ui.showHUD("success", "Действие: " + actionId))
);

Запустить в Sandbox