'use strict';

var index = require('./index-C_OnxXhP.js');
var index_esm = require('./index.esm-C1i_NocP.js');

const composerToolbarCss = () => `*{box-sizing:border-box;min-width:0}:host(limebb-composer-toolbar){box-sizing:border-box;display:flex;align-items:center;width:100%;max-width:100%;gap:0.5rem}.actions{display:flex;align-items:center;flex-wrap:nowrap;flex-grow:1}limel-icon-button,::slotted(limel-icon-button){display:inline-block;scale:0.86}limel-file-input{flex-shrink:0}`;

const TRIGGER_DEFINITIONS = [
    {
        trigger: 'rich-text',
        icon: 'font_style_formatting',
        translationKey: 'webclient.composer-toolbar.rich-text',
    },
    {
        trigger: 'mention',
        icon: 'email_sign_92447',
        translationKey: 'webclient.composer-toolbar.mention',
        helperLabel: '@',
    },
    {
        trigger: 'text-snippet',
        icon: 'add_text',
        translationKey: 'webclient.composer-toolbar.text-snippet',
        helperLabel: '!',
    },
    {
        trigger: 'internal-link',
        icon: 'hashtag_large',
        translationKey: 'webclient.composer-toolbar.internal-link',
        helperLabel: '#',
    },
];
const ComposerToolbar = class {
    constructor(hostRef) {
        index.registerInstance(this, hostRef);
        this.triggerInsert = index.createEvent(this, "triggerInsert");
        this.filesSelected = index.createEvent(this, "filesSelected");
        /**
         * When `true`, displays a button that triggers
         * the mention character (`@`) in the text editor.
         */
        this.mentions = false;
        /**
         * When `true`, displays a button that triggers
         * the text snippet character (`!`) in the text editor.
         */
        this.textSnippets = false;
        /**
         * When `true`, displays a button that triggers
         * the internal link character (`#`) in the text editor.
         */
        this.internalLinks = false;
        /**
         * When `true`, displays a button that toggles the visibility
         * of the rich text formatting toolbar in the text editor.
         */
        this.richText = false;
        this.handleTriggerSelected = (event) => {
            event.stopPropagation();
            this.triggerInsert.emit(event.detail.value);
        };
        this.handleFilesSelected = (event) => {
            event.stopPropagation();
            this.filesSelected.emit(event.detail);
        };
    }
    render() {
        return [
            index.h("div", { key: '34b441a01bfcca09b934ffc5aa5f6852efd359fd', class: "actions" }, index.h("slot", { key: '7b4ebdd76e9b58a7a9aa376aeffedf146f000973', name: "leading" }), this.renderFileInput(), this.renderTriggerActions(), index.h("slot", { key: '0b3fdc53e1dde0963f131684e7994ffc49e737fa', name: "trailing" })),
            index.h("slot", { key: '82ca56d3d8a9e227f343f4bedaaadca5c075f02e', name: "primary-action" }),
        ];
    }
    get translator() {
        var _a;
        return (_a = this.platform) === null || _a === void 0 ? void 0 : _a.get(index_esm.n.Translate);
    }
    get triggerActions() {
        const enabledFlags = {
            mention: this.mentions,
            'text-snippet': this.textSnippets,
            'internal-link': this.internalLinks,
            'rich-text': this.richText,
        };
        return TRIGGER_DEFINITIONS.filter((def) => enabledFlags[def.trigger]).map((def) => {
            var _a, _b;
            return ({
                text: (_b = (_a = this.translator) === null || _a === void 0 ? void 0 : _a.get(def.translationKey)) !== null && _b !== void 0 ? _b : def.trigger,
                commandText: def.helperLabel,
                icon: def.icon,
                iconOnly: true,
                value: def.trigger,
            });
        });
    }
    renderTriggerActions() {
        const actions = this.triggerActions;
        if (actions.length === 0) {
            return;
        }
        return (index.h("limel-action-bar", { actions: actions, onItemSelected: this.handleTriggerSelected }));
    }
    renderFileInput() {
        var _a, _b, _c, _d, _e, _f;
        if (!this.fileInput) {
            return;
        }
        return (index.h("limel-file-input", { accept: (_a = this.fileInput.accept) !== null && _a !== void 0 ? _a : '*', multiple: (_b = this.fileInput.multiple) !== null && _b !== void 0 ? _b : false, disabled: (_c = this.fileInput.disabled) !== null && _c !== void 0 ? _c : false, onFilesSelected: this.handleFilesSelected }, index.h("limel-icon-button", { icon: "attach", disabled: (_d = this.fileInput.disabled) !== null && _d !== void 0 ? _d : false, label: (_e = this.translator) === null || _e === void 0 ? void 0 : _e.get('webclient.attach-files'), helperLabel: (_f = this.translator) === null || _f === void 0 ? void 0 : _f.get('webclient.attach-files-helper') })));
    }
};
ComposerToolbar.style = composerToolbarCss();

exports.limebb_composer_toolbar = ComposerToolbar;
