DevactionUI.FilterMenu (devaction_ui v0.1.0)

Copy Markdown View Source

A button that opens a menu of filter groups; a group opens a submenu of ticks, checkboxes or radios. Ticking does not close the menu. The menu is a form: it sends on Apply (phx-submit), or on every tick with phx-change, as %{"filters" => %{"status" => ["progress"], "who" => ["CA"]}}. A count on each group and on the button follows the ticks, except for an option marked default, which is what the filter already means.

A group is %{key: "status", label: "Status", type: :checkbox, options: [...]} and an option is %{value: "progress", label: "In progress", count: 2, checked: true, default: false, avatar: "CA"}; count, checked, default and avatar are optional. Arrows move, → opens a submenu, ← and Esc go back, Enter and Space tick. Words are attributes and icons are slots.

Summary

Functions

filter_menu(assigns)

Attributes

  • id (:string) (required)
  • label (:string) (required) - the button's text and the menu's name.
  • groups (:list) (required)
  • apply_label (:string) (required)
  • reset_label (:string) (required)
  • close_label (:string) (required)
  • Global attributes are accepted. Supports all globals plus: ["phx-submit", "phx-change", "phx-target"].

Slots

  • trigger_icon - the icon of the button.
  • group_icon - the icon of a group's row; gets the group.
  • chevron_icon - the arrow at the end of a group's row.
  • check_icon - the mark of a ticked option.
  • close_icon - the icon of the close button.