diff --git a/plugins/ui/docs/README.md b/plugins/ui/docs/README.md index fc4b83344..1a5d99686 100644 --- a/plugins/ui/docs/README.md +++ b/plugins/ui/docs/README.md @@ -216,7 +216,6 @@ def action_group(): "Aaa", "Bbb", "Ccc", - action=action, on_action=on_action, ), ui.text(action), @@ -227,6 +226,29 @@ def action_group(): ag = action_group() ``` +## ActionMenu (string values) +ActionMenu combines an ActionButton with a Menu for simple "more actions" use cases. + +```python +@ui.component +def action_menu(): + [action, on_action] = ui.use_state() + + return ui.flex( + ui.action_menu( + "Aaa", + "Bbb", + "Ccc", + on_action=on_action, + ), + ui.text(action), + direction="column", + ) + + +ag = action_menu() +``` + ## Picker (string values) The `ui.picker` component can be used to select from a list of items. Here's a basic example for selecting from a list of string values and displaying the selected key in a text field. diff --git a/plugins/ui/src/deephaven/ui/components/__init__.py b/plugins/ui/src/deephaven/ui/components/__init__.py index 05411130a..045e9e297 100644 --- a/plugins/ui/src/deephaven/ui/components/__init__.py +++ b/plugins/ui/src/deephaven/ui/components/__init__.py @@ -23,6 +23,7 @@ __all__ = [ "action_button", "action_group", + "action_menu", "button", "button_group", "checkbox", diff --git a/plugins/ui/src/deephaven/ui/components/action_menu.py b/plugins/ui/src/deephaven/ui/components/action_menu.py new file mode 100644 index 000000000..821eeb289 --- /dev/null +++ b/plugins/ui/src/deephaven/ui/components/action_menu.py @@ -0,0 +1,12 @@ +from ..elements import BaseElement + + +def action_menu(*children, **props): + """ + ActionMenu combines an ActionButton with a Menu for simple "more actions" use cases. + + Args: + children: A list of Item or primitive elements. + **props: Any other ActionMenu prop. + """ + return BaseElement(f"deephaven.ui.components.ActionMenu", *children, **props) diff --git a/plugins/ui/src/js/src/elements/ElementConstants.ts b/plugins/ui/src/js/src/elements/ElementConstants.ts index 996a3e23d..836a8ff88 100644 --- a/plugins/ui/src/js/src/elements/ElementConstants.ts +++ b/plugins/ui/src/js/src/elements/ElementConstants.ts @@ -24,9 +24,11 @@ export const ELEMENT_NAME = { /** Other Components */ actionGroup: uiComponentName('ActionGroup'), + actionMenu: uiComponentName('ActionMenu'), fragment: uiComponentName('Fragment'), item: uiComponentName('Item'), listActionGroup: uiComponentName('ListActionGroup'), + listActionMenu: uiComponentName('ListActionMenu'), listView: uiComponentName('ListView'), picker: uiComponentName('Picker'), section: uiComponentName('Section'),