0.6.1

0.6.1

Fixes reading the required state of input fields.

0.6.0

0.6.0

Added support for forms created with Ash Framework. See test/frameworks/ash/form_test.exs for an example.

0.5.4

0.5.4

Fixed a bug where the required marker would always be displayed, regardless of the field's required state.

0.5.3

0.5.3

Downgraded phoenix_live_view version to 0.19; both 0.19 and 0.20 should be compatible.

0.5.2

0.5.2

Added JS and CSS exports for Prompt functionality only. This is useful when you want to use menu/dialog/drawer behavior without Primer Design CSS. See the installation documentation for details.

0.5.1

Deprecated

• Component avatar_pair: renamed parent_child_avatar to avatar_pair.
• Components action_menu and select_menu: renamed is_right_aligned to is_aligned_end (added RTL support).
• Component spinner: renamed gap_color to highlight_color.

New component

• toggle_switch: Toggle switch is used to immediately toggle a setting on or off.

Updated components

• avatar: Added attr is_round.
• avatar_pair: Improved styling: support display inside flex container, add inner border to child avatar.
• button
  • Improved dimensions according to Primer Style specs, including placing a trailing icon.
  • Added attr is_aligned_start. Aligns contents to the start (at the left in left-to-right languages), while the dropdown caret (if any) is placed at the far end.
• spinner: Updated to latest Primer Style design.

0.5.0

Form elements have been revamped and aligned with the most recent form element documentation at Primer Style.

Deprecated

For all listed deprecations below: existing syntax will keep working, but log warnings will inform about the deprecation.

• form_group is replaced by form_control (and is_form_group is replaced by is_form_control). When updating your code:
  • You may need to add styling to correct the missing whitespace at top and bottom, because class "form-group" (which is also added when using attrs form_group and is_form_group) contains a top and bottom margin.
  • Without a form group, text inputs (as well as selects) will be given a default width by the browser and will probably be displayed smaller than they currently are.
• The horizontal "tab-row" layout of radio_group is not mentioned in the Primer Design specification, while "Radio group" is (with vertical layout).
  • The current radio_group has been renamed to radio_tabs.
  • The new component radio_group uses a vertical layout.
• checkbox and radio_button slot hint has been renamed to caption.
• button_group slot button is replaced by button components as children.
• For consistency, attr is_full has been renamed to is_full_width (in alert and header slot: item).

Improvements

• Added component checkbox_group.
• Added convenience component checkbox_in_group for checkboxes inside a checkbox_group.
• Added component radio_group (with vertical layout).
• Added attr caption to show hint message below the form fields.
  • Implemented for select, text_input and textarea.
  • Implemented for checkbox_group and radio_group to show a hint below the group label.
• Added a required marker to form_control, checkbox_group and radio_group. The form control label will show a required marker if the field is required.
  • Added is_required? to FieldState, so it can also be queried in validation_message and caption callbacks.
• Added disabled state to form_control:
  • With components select, text_input and textarea: the attribute disabled is automatically passed to form_control.
  • When using component form_control on its own: set explicitly with attr is_disabled.

Removed

• Form element width variation attrs is_short and is_shorter. These are no longer supported by Primer System.
• form_control class body: this extra div is removed to simplify the styling of validation states.

0.4.1

Improvements

• The open state of menus and dialogs can now be maintained when used inside forms - see Menus and dialogs.
• Improved validation message logic.
• Updated components:
  • theme_menu_options: added attr update_theme_event: the event name to be called for updating the theme.
  • radio_group: added to slot radio_button the attr label to set a custom label.
• Updated @primer/css to 21.0.7.

Breaking changes

• Removed functions related to using session for theme state - see PrimerLive.Theme for alternatives. Removed:
  • ThemeSessionController
  • ThemeEvent
  • Theme hook
• IDs of checkboxes and radio buttons have been updated to only include valid characters.

Deprecated

• For all menu components, including 'dialog' and 'drawer': passing prompt options to the toggle slot is replaced by passing prompt_options to the main component.
• In the drawer component, replace the subcomponent drawer_content with the slot body.
  • This allows the focus wrap ID to be derived from the drawer's 'id' attribute, similar to how it is done for 'dialog'.
  • When using the previous syntax, a warning message will be shown in the shell.

Other changes

• The HTML structure and some of the CSS classes of action_menu, dropdown_menu and select_menu have changed. Instead of <details> and <summary> elements, the open state is now controlled with <input type="checkbox"> and <label>.
• HTML attributes are sorted alphabetically.

0.3.2

Replaced a couple more underscores (see v0.3.1).

0.3.1

Replaced underscores in HTML element attributes with dashes because Phoenix LiveView 0.19 no longer does automatic substitution.

Updated components:

• select: attr prompt is ignored when is_multiple is also used. This prevents Phoenix.HTML.Form.multiple_select/4 from raising an error.