Changed radio button it to select (#373)

* Add password input

* Save empty string for password in .livemd file

* Update lib/livebook_web/live/session_live/cell_component.ex

* Changed radio button it to select
* Changed radio button it to select
* Moved select it to the top
* Keep the elements in the select ordered

* Update lib/livebook_web/helpers.ex

Co-authored-by: Jonatan Kłosko <jonatanklosko@gmail.com>

* Update lib/livebook_web/live/session_live/input_cell_settings_component.ex

Co-authored-by: Jonatan Kłosko <jonatanklosko@gmail.com>

* Update lib/livebook_web/live/session_live/input_cell_settings_component.ex

Co-authored-by: Jonatan Kłosko <jonatanklosko@gmail.com>

Co-authored-by: Jonatan Kłosko <jonatanklosko@gmail.com>
This commit is contained in:
Jean Carlos 2021-06-20 10:33:10 -03:00 committed by GitHub
parent b05b12614c
commit e538bd6c93
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 14 additions and 12 deletions

View file

@ -116,18 +116,20 @@ defmodule LivebookWeb.Helpers do
end
@doc """
Renders a list of radio input options with the given one selected.
Renders a list of select input options with the given one selected.
"""
def render_radios(name, options, selected) do
def render_select(name, options, selected) do
assigns = %{name: name, options: options, selected: selected}
~L"""
<%= for {value, label} <- options do %>
<label class="flex space-x-2 items-center cursor-pointer">
<%= tag :input, type: "radio", class: "radio-base", name: @name, value: value, checked: value == selected %>
<div class="text-medium text-gray-700"><%= label %></div>
</label>
<% end %>
<select class="input" name=<%= @name %>>
<%= for {value, label} <- options do %>
<%= tag :option, value: value, selected: value == selected %>
<%= label %>
</option>
<% end %>
</select>
"""
end
end

View file

@ -24,13 +24,13 @@ defmodule LivebookWeb.SessionLive.InputCellSettingsComponent do
Cell settings
</h3>
<form phx-submit="save" phx-change="validate" phx-target="<%= @myself %>">
<div>
<div class="flex space-x-8 items-center">
<%= render_select("type", [number: "Number", password: "Password", text: "Text", url: "URL"], @type) %>
</div>
<div class="mt-4">
<div class="input-label">Name</div>
<input type="text" class="input" name="name" value="<%= @name %>" spellcheck="false" autocomplete="off" autofocus />
</div>
<div class="mt-4 flex space-x-8 items-center">
<%= render_radios("type", [text: "Text", url: "URL", number: "Number", password: "Password"], @type) %>
</div>
<div class="mt-8 flex justify-end space-x-2">
<%= live_patch "Cancel", to: @return_to, class: "button button-outlined-gray" %>
<%= content_tag :button, "Save",