@shopify/app-bridge-core/esm/actions/ButtonGroup/index.js

**[Join our team and work on libraries like this one.](https://www.shopify.ca/careers)**

import { getSingleButton } from '../buttonHelper.js';
import { getMergedProps, updateActionFromPayload, getEventNameSpace, actionWrapper } from '../helper.js';
import { ActionSetWithChildren } from '../ActionSet.js';
import { ComponentType, Group } from '../types.js';

var Action;
(function (Action) {
    Action["UPDATE"] = "UPDATE";
})(Action || (Action = {}));
function update(group, component, props) {
    return buttonActionWrapper(group, component, Action.UPDATE, props);
}
function isGroupedButton(options) {
    const castOptions = options;
    return castOptions.buttons && castOptions.buttons.length > 0 && castOptions.label !== undefined;
}
function isGroupedButtonPayload(payload) {
    const castOptions = payload;
    return (Array.isArray(castOptions.buttons) &&
        typeof castOptions.id === 'string' &&
        typeof castOptions.label === 'string');
}
class ButtonGroup extends ActionSetWithChildren {
    label;
    disabled = false;
    plain = false;
    buttonsOptions = [];
    buttons = [];
    constructor(app, options) {
        super(app, ComponentType.ButtonGroup, Group.ButtonGroup);
        this.set(options, false);
    }
    get options() {
        return {
            buttons: this.buttonsOptions,
            disabled: this.disabled,
            label: this.label,
            plain: this.plain,
        };
    }
    get payload() {
        return {
            ...this.options,
            buttons: this.buttons,
            id: this.id,
        };
    }
    set(options, shouldUpdate = true) {
        const mergedOptions = getMergedProps(this.options, options);
        const { label, disabled, buttons, plain } = mergedOptions;
        this.label = label;
        this.disabled = Boolean(disabled);
        this.buttons = this.getButtons(buttons);
        this.plain = Boolean(plain);
        if (shouldUpdate) {
            this.dispatch(Action.UPDATE);
        }
        return this;
    }
    dispatch(action) {
        switch (action) {
            case Action.UPDATE: {
                const updateAction = update(this.group, this.component, this.payload);
                this.app.dispatch(updateAction);
                break;
            }
        }
        return this;
    }
    updateButtons(newPayload) {
        if (!this.buttons || this.buttons.length === 0) {
            return;
        }
        let updated;
        for (const action of this.buttons) {
            updated = updateActionFromPayload(action, newPayload);
            if (updated) {
                break;
            }
        }
        if (updated) {
            this.dispatch(Action.UPDATE);
        }
    }
    getSingleButton(button) {
        return getSingleButton(this, button, this.subgroups, this.updateButtons);
    }
    getButtons(buttonOptions) {
        const buttons = [];
        if (!buttonOptions) {
            return [];
        }
        buttonOptions.forEach((button) => {
            const singleButton = getSingleButton(this, button, this.subgroups, this.updateButtons);
            buttons.push(singleButton);
        });
        this.buttonsOptions = buttonOptions;
        return buttons;
    }
}
function create(app, options) {
    return new ButtonGroup(app, options);
}
function buttonActionWrapper(group, component, eventName, props, payload) {
    const { id } = component;
    const { label } = props;
    const action = getEventNameSpace(group, eventName, component);
    const buttonPayload = {
        ...props,
        id,
        label,
        payload,
    };
    return actionWrapper({ type: action, group, payload: buttonPayload });
}

export { Action, ButtonGroup, create, isGroupedButton, isGroupedButtonPayload, update };