ExLine.Message.Flex (ExLine v0.1.0)

Builders for Flex Message containers and components.

Compose a Flex message bottom-up: build components (text/2, image/2, button/2, separator/1) into box/3es, boxes into a bubble/1 (header/hero/body/footer), bubbles optionally into a carousel/1, then wrap with flex/2.

alias ExLine.Message.Flex
Flex.flex("alt", Flex.bubble(body: Flex.box(:vertical, [Flex.text("Hello")])))

Ref: https://developers.line.biz/en/reference/messaging-api/#flex-message

Summary

Functions

box(layout, contents, opts \\ [])

Box component. layout is :horizontal | :vertical | :baseline.

bubble(opts \\ [])

Bubble container. Options: :size, :direction, :header, :hero, :body, :footer, :action (each block is a box/3, except :hero/:action).

button(action, opts \\ [])

Button component wrapping an action (from ExLine.Message.Action).

carousel(bubbles)

Carousel of bubbles.

flex(alt_text, contents)

Flex message wrapping a contents container (a bubble/1 or carousel/1).

image(url, opts \\ [])

Image component. Options: :size, :aspect_ratio, :aspect_mode, :flex.

separator(opts \\ [])

Separator component. Options: :margin, :color.

text(text, opts \\ [])

Text component. Options: :size, :weight, :color, :align, :wrap, :flex.

Functions

box(layout, contents, opts \\ [])

@spec box(atom() | String.t(), [map()], keyword()) :: map()

Box component. layout is :horizontal | :vertical | :baseline.

Options: :flex, :spacing, :margin, :padding_all, :background_color.

iex> ExLine.Message.Flex.box(:vertical, [])
%{type: "box", layout: "vertical", contents: []}

bubble(opts \\ [])

@spec bubble(keyword()) :: map()

Bubble container. Options: :size, :direction, :header, :hero, :body, :footer, :action (each block is a box/3, except :hero/:action).

button(action, opts \\ [])

@spec button(
  map(),
  keyword()
) :: map()

Button component wrapping an action (from ExLine.Message.Action).

Options: :style ("primary"/"secondary"/"link"), :color, :flex.

carousel(bubbles)

@spec carousel([map()]) :: map()

Carousel of bubbles.

flex(alt_text, contents)

@spec flex(String.t(), map()) :: map()

Flex message wrapping a contents container (a bubble/1 or carousel/1).

Ref: https://developers.line.biz/en/reference/messaging-api/#flex-message

image(url, opts \\ [])

@spec image(
  String.t(),
  keyword()
) :: map()

Image component. Options: :size, :aspect_ratio, :aspect_mode, :flex.

iex> ExLine.Message.Flex.image("https://x/i.jpg")
%{type: "image", url: "https://x/i.jpg"}

separator(opts \\ [])

@spec separator(keyword()) :: map()

Separator component. Options: :margin, :color.

iex> ExLine.Message.Flex.separator()
%{type: "separator"}

text(text, opts \\ [])

@spec text(
  String.t(),
  keyword()
) :: map()

Text component. Options: :size, :weight, :color, :align, :wrap, :flex.

iex> ExLine.Message.Flex.text("Hello", weight: "bold")
%{type: "text", text: "Hello", weight: "bold"}