Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Select refactor #43

Merged
merged 5 commits into from
Nov 18, 2020
Merged

Select refactor #43

merged 5 commits into from
Nov 18, 2020

Conversation

staylorwr
Copy link
Contributor

This PR includes a major update to the Select field by introducing
options/2, searchable/1 and depreciating with_options/2 and
display_using_labels/1.

Options

Define the options for the select field. The function accepts a list of
options that are either strings or maps with of value and label keys. If
the list members are strings, the value will be used for both the value and label
of the <option> element it represents.

options are expected to be an enumerable which will be used to generate
each respective option. The enumerable may have:

  • keyword lists - each keyword list is expected to have the keys :key and
    :value. Additional keys such as :disabled may be given to customize
    the option

  • two-item tuples - where the first element is an atom, string or integer to
    be used as the option label and the second element is an atom, string or
    integer to be used as the option value

  • atom, string or integer - which will be used as both label and value for
    the generated select

Optgroups

If options is a map or keyword list where the firs element is a string, atom,
or integer and the second element is a list or a map, it is assumed the key
will be wrapped in an <optgroup> and teh value will be used to generate
<options> nested under the group.

This functionality is equivalent to Phoenix.HTML.Form.select/3

Searchable

At times it's convenient to be able to search or filter the list of options in a
select field. You can enable this by calling Select.searchable on the field:

Select.make(:type) |> Select.options(~w(foo bar)) |> Select.searchable()

When using this field, Teal will display an input field which allows you to filter
the list based on it's key.

Depreciations

with_options/2 and display_using_labels/1 are now depreciated and emit a
warning when called.

@staylorwr staylorwr changed the title st/select refactor Select refactor Nov 18, 2020
@staylorwr staylorwr merged commit b6738cf into master Nov 18, 2020
@staylorwr staylorwr deleted the st/select-refactor branch November 18, 2020 15:02
staylorwr added a commit that referenced this pull request Nov 18, 2020
This commit includes a major update to the `Select` field by introducing
`options/2`, `searchable/1` and depreciating `with_options/2` and
`display_using_labels/1`.

Define the options for the select field.  The function accepts a list of
options that are either strings or maps with of `value` and `label` keys.  If
the list members are strings, the value will be used for both the value and label
of the `<option>` element it represents.

`options` are expected to be an enumerable which will be used to generate
each respective `option`.  The enumerable may have:

  * keyword lists - each keyword list is expected to have the keys `:key` and
    `:value`.  Additional keys such as `:disabled` may be given to customize
    the option

  * two-item tuples - where the first element is an atom, string or integer to
    be used as the option label and the second element is an atom, string or
    integer to be used as the option value

  * atom, string or integer - which will be used as both label and value for
    the generated select

If `options` is a map or keyword list where the firs element is a string, atom,
or integer and the second element is a list or a map, it is assumed the key
will be wrapped in an `<optgroup>` and teh value will be used to generate
`<options>` nested under the group.

This functionality is equivalent to `Phoenix.HTML.Form.select/3`

At times it's convenient to be able to search or filter the list of options in a
select field.  You can enable this by calling `Select.searchable` on the field:

```
Select.make(:type) |> Select.options(~w(foo bar)) |> Select.searchable()
```

When using this field, Teal will display an input field which allows you to filter
the list based on it's key.

`with_options/2` and `display_using_labels/1` are now depreciated and emit a
warning when called.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

1 participant