ButtonGroup
Use the ButtonGroup
action set to group together Button
action set instances. You can pass this action set into your app’s TitleBar
action set. The ButtonGroup
action set does not provide functionality outside of the TitleBar
action set. If you need a standard button group component in your app, use a Polaris React button group.
Anchor to Example codeExample code
Create an app and import the Button
and ButtonGroup
modules from @shopify/app-bridge/actions
. Note that we'll be referring to this sample application throughout the examples below.
In the following example, config
is a valid App Bridge configuration object. Learn more about configuring App Bridge.
Generate a primary button with the label More actions
and two buttons with the label Settings
and Help
:
Anchor to Subscribe to updatesSubscribe to updates
You can subscribe to the button group update action by calling subscribe
. This returns a function that you can call to unsubscribe from the action:
Anchor to UnsubscribeUnsubscribe
You call unsubscribe
to remove all subscriptions on the button group and its children:
You call unsubscribe
with false
to remove only button group subscriptions while leaving child subscriptions intact. For example, you might want to unsubscribe from the button group but keep button listeners so that the buttons can be reused in a different actions (such as a modal).
Anchor to Update optionsUpdate options
You can call the set
method with partial button group options to update the options of an existing button group. This automatically triggers the update
action on the button group and merges the new given options with existing options.
You can update buttons attached to a button group. Any updates made to the button group's children automatically trigger an update
action on the button group.