import { r as registerInstance, c as createEvent, h } from './index-BIwHMk6j.js';
import { n } from './index.esm-mwnk3PIM.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: 'rich_text_converter',
        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) {
        registerInstance(this, hostRef);
        this.triggerInsert = createEvent(this, "triggerInsert");
        this.filesSelected = 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 [
            h("div", { key: '6034b2945edfd9b613f606f8bb4fb0db81c1390f', class: "actions" }, h("slot", { key: '82b9bc14d80aedd3320af70bc63d3a908db6a7b2', name: "leading" }), this.renderFileInput(), this.renderTriggerActions(), h("slot", { key: '338fc1b7c7ec3f7dfedb123b7e09dd05f75fc45c', name: "trailing" })),
            h("slot", { key: '57b277b772cbaf702e619ecbd6ff9032718b87b7', name: "primary-action" }),
        ];
    }
    get translator() {
        var _a;
        return (_a = this.platform) === null || _a === void 0 ? void 0 : _a.get(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 (h("limel-action-bar", { actions: actions, onItemSelected: this.handleTriggerSelected }));
    }
    renderFileInput() {
        var _a, _b, _c, _d, _e, _f;
        if (!this.fileInput) {
            return;
        }
        return (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 }, 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();

export { ComposerToolbar as limebb_composer_toolbar };
