Multi Select

Multi Select

Read
Write
State
@user_changeset = #Ecto.Changeset<action: nil, changes: %{}, errors: [],
 data: #MoonWeb.Pages.Tutorials.AddDataUsingForm.User<>, valid?: true>

@latest_params = nil
Permission
Read
Write
State
@user_changeset = #Ecto.Changeset<action: nil, changes: %{}, errors: [],
 data: #MoonWeb.Pages.Tutorials.AddDataUsingForm.User<>, valid?: true>

@latest_params = nil
Permission
Read
Write
State
@user_changeset = #Ecto.Changeset<action: nil, changes: %{}, errors: [],
 data: #MoonWeb.Pages.Tutorials.AddDataUsingForm.User<>, valid?: true>

@latest_params = nil

Small

Read
Write
Permission
Read
Write

Medium

Read
Write
Permission
Read
Write

Large

Read
Write
Permission
Read
Write

Xlarge

Read
Write
Permission
Read
Write

Disabled

Read
Write
State
@user_changeset = #Ecto.Changeset<action: nil, changes: %{}, errors: [],
 data: #MoonWeb.Pages.Tutorials.AddDataUsingForm.User<>, valid?: true>

@latest_params = nil
Props
Name Type Required Default Description
field atom true - Field for the underlying phoenix select component
size - false - TODO - size variant
options list true - Options for the select
prompt string false - Placeholder text
header slot false - TODO - header element on the options popup
footer slot false - TODO - footer element on the options popup
menu_width number false - TODO - Minimum width of the popup menu containing options
left slot false - TODO - Left content for selected option
hint slot false - TODO - Inform message under select, can be used for error message
items slot true - Content template for displaying each of the options
disabled boolean - false Whether the component is disabled
value any false - Default selected value
on_select string false - Name of the event handler function when an option is clicked
is_error boolean false - TODO - If the component is in error mode