PhoenixPaper.Tab (PhoenixPaper v0.1.0)

Copy Markdown View Source

A single clickable tab (pp_tab/1) inside a PhoenixPaper.Tabs tablist, paired with a PhoenixPaper.TabPanel sharing the same id/value. See PhoenixPaper.Tabs's moduledoc for the full composition example and for why switching is JS-command-driven rather than the CSS-only peer-checked: trick PhoenixPaper.Accordion uses.

id must be the same on every Tab/TabPanel in the group; value must be unique within it. orientation must match the parent pp_tabs/1's own orientation — like color, it can't cascade down automatically (see PhoenixPaper.Tabs's moduledoc), it only changes which side the persistent 2px indicator border reserves space on.

Summary

Functions

Renders a single tab. See the module doc.

Functions

pp_tab(assigns)

Renders a single tab. See the module doc.

Attributes

  • id (:string) (required) - shared with the parent Tabs and matching TabPanel.
  • value (:string) (required) - unique within the group; matches a TabPanel's value.
  • orientation (:string) - Defaults to "horizontal". Must be one of "horizontal", or "vertical".
  • default_selected (:boolean) - Defaults to false.
  • disabled (:boolean) - Defaults to false.
  • color (:string) - Defaults to "primary". Must be one of "primary", "secondary", "tertiary", or "error".
  • ripple (:boolean) - the Material ripple effect on click/tap — off whenever paperize is false, see PhoenixPaper.Ripple. Defaults to true.
  • paperize (:boolean) - Defaults to true.
  • class (:any) - Defaults to nil.
  • Global attributes are accepted.

Slots

  • icon - optional leading icon, e.g. a <.pp_icon>.
  • inner_block (required)