import { h, Host } from "@stencil/core";
/**
 * @private
 */
export class ActionBarOverflowMenu {
    constructor() {
        /**
         * Defines the location that the content of the overflow menu
         * appears, in relation to its trigger.
         * It defaults to `bottom-end`, since in normal scenarios
         * (for example when the action bar is not floating at the bottom of the screen)
         * this menu is the right-most item in the user interface of the component.
         */
        this.openDirection = 'bottom-end';
        this.getOverflowTriggerContent = () => {
            if (this.overFlowIcon) {
                const { color, name, title } = this.overFlowIcon;
                return (h("limel-icon", { style: {
                        color: color,
                    }, name: name, "aria-label": title }));
            }
            return `+${this.numberOfMenuItems}`;
        };
        this.handleSelect = (event) => {
            event.stopPropagation();
            this.select.emit(event.detail);
        };
    }
    render() {
        return (h(Host, { key: '5a993a11b77a6b9c268444ea6903df602ae832ea' }, h("limel-menu", { key: 'bb6c54b88d20dc54ad86099e67facbd2656d6a9f', openDirection: this.openDirection, items: this.items, onSelect: this.handleSelect }, h("button", { key: '618587121d8dfd16b5e495ab53b251be42d98f01', type: "button", slot: "trigger" }, this.getOverflowTriggerContent()))));
    }
    get numberOfMenuItems() {
        return this.items.filter((item) => this.isMenuItem(item)).length;
    }
    isMenuItem(item) {
        return !('separator' in item);
    }
    static get is() { return "limel-action-bar-overflow-menu"; }
    static get properties() {
        return {
            "items": {
                "type": "unknown",
                "mutable": false,
                "complexType": {
                    "original": "Array<MenuItem | ListSeparator>",
                    "resolved": "(ListSeparator | MenuItem<any>)[]",
                    "references": {
                        "Array": {
                            "location": "global",
                            "id": "global::Array"
                        },
                        "MenuItem": {
                            "location": "import",
                            "path": "../../menu/menu.types",
                            "id": "src/components/menu/menu.types.ts::MenuItem",
                            "referenceLocation": "MenuItem"
                        },
                        "ListSeparator": {
                            "location": "import",
                            "path": "../../list-item/list-item.types",
                            "id": "src/components/list-item/list-item.types.ts::ListSeparator",
                            "referenceLocation": "ListSeparator"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "List of the items that should be rendered in the overflow menu."
                },
                "getter": false,
                "setter": false
            },
            "openDirection": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "OpenDirection",
                    "resolved": "\"bottom\" | \"bottom-end\" | \"bottom-start\" | \"left\" | \"left-end\" | \"left-start\" | \"right\" | \"right-end\" | \"right-start\" | \"top\" | \"top-end\" | \"top-start\"",
                    "references": {
                        "OpenDirection": {
                            "location": "import",
                            "path": "../../menu/menu.types",
                            "id": "src/components/menu/menu.types.ts::OpenDirection",
                            "referenceLocation": "OpenDirection"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Defines the location that the content of the overflow menu\nappears, in relation to its trigger.\nIt defaults to `bottom-end`, since in normal scenarios\n(for example when the action bar is not floating at the bottom of the screen)\nthis menu is the right-most item in the user interface of the component."
                },
                "getter": false,
                "setter": false,
                "reflect": true,
                "attribute": "open-direction",
                "defaultValue": "'bottom-end'"
            },
            "overFlowIcon": {
                "type": "unknown",
                "mutable": false,
                "complexType": {
                    "original": "Icon",
                    "resolved": "Icon",
                    "references": {
                        "Icon": {
                            "location": "import",
                            "path": "../../../global/shared-types/icon.types",
                            "id": "src/global/shared-types/icon.types.ts::Icon",
                            "referenceLocation": "Icon"
                        }
                    }
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Icon to display in the overflow menu trigger.\nIf not provided, the number of items in the overflow menu will be displayed."
                },
                "getter": false,
                "setter": false
            }
        };
    }
    static get events() {
        return [{
                "method": "select",
                "name": "select",
                "bubbles": true,
                "cancelable": true,
                "composed": true,
                "docs": {
                    "tags": [{
                            "name": "public",
                            "text": undefined
                        }],
                    "text": "Fired when an item in the action bar overflow menu has been clicked."
                },
                "complexType": {
                    "original": "ActionBarItem",
                    "resolved": "ActionBarItemOnlyIcon<any> | ActionBarItemWithLabel<any>",
                    "references": {
                        "ActionBarItem": {
                            "location": "import",
                            "path": "../../action-bar/action-bar.types",
                            "id": "src/components/action-bar/action-bar.types.ts::ActionBarItem",
                            "referenceLocation": "ActionBarItem"
                        }
                    }
                }
            }];
    }
}
