View Source ExCell.Cell behaviour (ExCell v0.1.1)
Cells are used to tightly couple your templates, views and Javascript. It is heavily inspired by React by Facebook and Rails Cells by Trailblazer.
Summary
Functions
Returns the name of the module as a string. Module namespaces are replaced by a dash.
Cells require you to use the using macro to use them. This ensures that the cell namespaces are used.
Generates the HTML attribute name based on the cell name. Can be overriden to pre- or postfix the attribute name.
Generates the CSS class name based on the cell name. Can be overriden to pre- or postfix the class name or to create a distinct class name with CSS modules.
Returns the container of a cell as a Phoenix.Tag.
Returns the container of a cell as a Phoenix.Tag with attributes added to
the data-cell-params attribute. This is used to add parameters to cell-js
cells.
Combines the parameters set on the cell with custom parameters for a specific instance
Callbacks
Functions
Returns the name of the module as a string. Module namespaces are replaced by a dash.
Example
iex(0)> AvatarCell.name() "AvatarCell"
iex(1)> User.AvatarCell.name() "User-AvatarCell"
Cells require you to use the using macro to use them. This ensures that the cell namespaces are used.
The cell allows you to override the class_name and params attributes.
Options
When you use the __using__
macro you can specify a namespace it uses as its
base to add the class and cells-js tags
:namespace
- The base namespace it uses to base thename
andclass_name
on
Examples
defmodule AppWeb.AvatarCell do
use ExCell.Cell, namespace: AppWeb
end
iex(0)> AvatarCell.name
"AvatarCell"
defmodule AppWeb.AvatarCell do
use ExCell.Cell
end
iex(0)> AvatarCell.name
"AppWeb-AvatarCell"
Generates the HTML attribute name based on the cell name. Can be overriden to pre- or postfix the attribute name.
Examples
iex(0)> AvatarCell.cell_name()
"AvatarCell"
Generates the CSS class name based on the cell name. Can be overriden to pre- or postfix the class name or to create a distinct class name with CSS modules.
Examples
iex(0)> AvatarCell.class_name()
"AvatarCell"
Returns the container of a cell as a Phoenix.Tag.
iex(0)> Phoenix.HTML.safe_to_string(AvatarCell.container)
"<div class=\"AvatarCell\" data-cell=\"AvatarCell\" data-cell-params=\"{}\">"
Returns the container of a cell as a Phoenix.Tag with attributes added to
the data-cell-params attribute. This is used to add parameters to cell-js
cells.
Examples
iex(0)> Phoenix.HTML.safe_to_string(AvatarCell.container(%{ foo: "bar" }))
"<a class=\"AvatarCell\" data-cell=\"AvatarCell\" data-cell-params=\"{"foo":"bar"}">"
Combines the parameters set on the cell with custom parameters for a specific instance
Examples
iex(0)> AvatarCell.params
%{hello: "world"}
iex(0)> AvatarCell.params(%{foo: "bar"})
%{hello: "world", foo: "bar"}