For rending Sanity CMS portable text.

Examples

Basic example

use Phoenix.Component

# ...

assigns = %{
  portable_text: [
    %{
      _key: "f71173c80e3a",
      _type: "block",
      children: [%{_key: "d6c419dcf485", _type: "span", marks: [], text: "Test paragraph."}],
      mark_defs: [],
      style: "normal"
    }
  ]
}

~H"<Sanity.Components.PortableText.portable_text value={@portable_text} />"copy

Custom rendering

defmodule CustomBlock do
  use Phoenix.Component
  use Sanity.Components.PortableText

  @impl true
  def block(%{value: %{style: "normal"}} = assigns) do
    ~H"""
    <div class="custom-normal"><%= render_slot(@inner_block) %></div>
    """
  end

  def block(assigns), do: super(assigns)
endcopy

Then render the component like:

~H"<Sanity.Components.PortableText.portable_text mod={CustomBlock} value={@portable_text} />"copy

Similarly, marks and types can be customized by defining mark/1 and type/1 functions in the module.