import { createElement } from '@syncfusion/ej2-base';
import { RIBBON_ID } from '../ribbon-base/ribbon-constants';
import { RibbonItemSize } from '@syncfusion/ej2-ribbon';
import { BulletListHelper } from '../../helper/bullet-list-helper';
// Numbering list constants
export var NUMBER_LIST_ID = '_number_list';
/**
 * NumberingGroup class for handling numbering list operations in Document Editor ribbon
 * @private
 */
var NumberingGroup = /** @class */ (function () {
    /**
     * Constructor for NumberingGroup
     * @param {DocumentEditorContainer} container - DocumentEditorContainer instance
     */
    function NumberingGroup(container) {
        // Track the last applied numbering style
        this.appliedNumberingStyle = 'arabic';
        // Event handlers for numbering options
        this.numberedAndBulletNoneClickHandler = this.bulletNoneClick.bind(this);
        this.numberedNumberDotClickHandler = this.numberedNumberDotClick.bind(this);
        this.numberedLowLetterClickHandler = this.numberedLowLetterClick.bind(this);
        this.numberedUpLetterClickHandler = this.numberedUpLetterClick.bind(this);
        this.numberedLowRomanClickHandler = this.numberedLowRomanClick.bind(this);
        this.numberedUpRomanClickHandler = this.numberedUpRomanClick.bind(this);
        this.container = container;
        this.ribbonId = this.container.element.id + RIBBON_ID;
        this.localObj = this.container.localObj;
    }
    Object.defineProperty(NumberingGroup.prototype, "documentEditor", {
        get: function () {
            return this.container.documentEditor;
        },
        enumerable: true,
        configurable: true
    });
    /**
     * Get the numbering list split button item configuration
     * @returns {RibbonItemModel} - Numbering list split button item configuration
     * @private
     */
    NumberingGroup.prototype.getNumberingListItem = function () {
        var id = this.ribbonId;
        return {
            type: 'SplitButton',
            keyTip: 'N',
            allowedSizes: RibbonItemSize.Small,
            splitButtonSettings: this.createNumberingSplitButton(),
            id: id + NUMBER_LIST_ID,
            ribbonTooltipSettings: { content: this.localObj.getConstant('Numbering') }
        };
    };
    NumberingGroup.prototype.createNumberingSplitButton = function () {
        var _this = this;
        var numberIconCss = 'e-de-ctnr-numbering e-icons';
        if (this.container.enableRtl) {
            numberIconCss += ' e-de-flip';
        }
        // Create the HTML template for numbering dropdown
        var numberListDropDiv = createElement('div', {
            id: this.ribbonId + '_number_list_div',
            styles: 'width: 211px;height: auto;visibility: hidden'
        });
        var numberListDropUlTag = createElement('ul', {
            styles: 'visibility: visible; outline: 0px;',
            id: this.ribbonId + '_numberListMenu',
            className: 'e-de-floating-menu e-de-bullets-menu e-de-list-container e-de-list-thumbnail'
        });
        numberListDropDiv.appendChild(numberListDropUlTag);
        // Create numbering list options using BulletListHelper
        this.noneNumberTag = BulletListHelper.createNumberNoneListTag(numberListDropUlTag, this.localObj);
        this.noneNumberTag.addEventListener('click', this.numberedAndBulletNoneClickHandler);
        this.numberList = BulletListHelper.createNumberListTag(numberListDropUlTag, '1.', '2.', '3.');
        this.numberList.addEventListener('click', this.numberedNumberDotClickHandler);
        this.lowLetter = BulletListHelper.createNumberListTag(numberListDropUlTag, 'a.', 'b.', 'c.');
        this.lowLetter.addEventListener('click', this.numberedLowLetterClickHandler);
        this.upLetter = BulletListHelper.createNumberListTag(numberListDropUlTag, 'A.', 'B.', 'C.');
        this.upLetter.addEventListener('click', this.numberedUpLetterClickHandler);
        this.lowRoman = BulletListHelper.createNumberListTag(numberListDropUlTag, 'i.', 'ii.', 'iii.');
        this.lowRoman.addEventListener('click', this.numberedLowRomanClickHandler);
        this.upRoman = BulletListHelper.createNumberListTag(numberListDropUlTag, 'I.', 'II.', 'III.');
        this.upRoman.addEventListener('click', this.numberedUpRomanClickHandler);
        // Initialize element map for easier management
        this.numberElements = {
            'none': this.noneNumberTag,
            'number': this.numberList,
            'lowletter': this.lowLetter,
            'upletter': this.upLetter,
            'lowroman': this.lowRoman,
            'uproman': this.upRoman
        };
        return {
            target: numberListDropDiv,
            iconCss: numberIconCss,
            items: this.getNumberingItems(),
            content: this.localObj.getConstant('Numbering'),
            select: this.handleNumberingSelection.bind(this),
            beforeOpen: function () {
                numberListDropDiv.style.visibility = 'visible';
                var levelPattern = BulletListHelper.getCurrentListPattern(_this.documentEditor);
                _this.updateSelectedNumberedListType(levelPattern);
            },
            beforeClose: function () {
                numberListDropDiv.style.visibility = 'hidden';
                _this.removeSelectedList();
            },
            click: function () {
                _this.applyLastAppliedNumbering();
            },
            close: function () {
                _this.refreshHomeSelection();
            }
        };
    };
    NumberingGroup.prototype.getNumberingItems = function () {
        return [
            { id: this.ribbonId + '_number-none', text: this.localObj.getConstant('None') },
            { id: this.ribbonId + '_number-arabic', text: this.localObj.getConstant('Arabic') },
            { id: this.ribbonId + '_number-lowletter', text: this.localObj.getConstant('Lower Letter') },
            { id: this.ribbonId + '_number-upletter', text: this.localObj.getConstant('Upper Letter') },
            { id: this.ribbonId + '_number-lowroman', text: this.localObj.getConstant('Lower Roman') },
            { id: this.ribbonId + '_number-uproman', text: this.localObj.getConstant('Upper Roman') }
        ];
    };
    NumberingGroup.prototype.removeSelectedList = function () {
        BulletListHelper.removeSelectedList(this.numberElements);
    };
    NumberingGroup.prototype.updateSelectedNumberedListType = function (listPattern) {
        BulletListHelper.updateSelectedNumberedListType(listPattern, this.numberElements);
    };
    /**
     * Apply the last used numbering style
     * @returns {void}
     * @private
     */
    NumberingGroup.prototype.applyLastAppliedNumbering = function () {
        switch (this.appliedNumberingStyle) {
            case 'arabic':
                this.numberedNumberDotClick();
                break;
            case this.ribbonId + '_lowroman':
                this.numberedLowRomanClick();
                break;
            case this.ribbonId + '_uproman':
                this.numberedUpRomanClick();
                break;
            case this.ribbonId + '_lowletter':
                this.numberedLowLetterClick();
                break;
            case this.ribbonId + '_upletter':
                this.numberedUpLetterClick();
                break;
            default:
                this.numberedNumberDotClick();
                break;
        }
    };
    NumberingGroup.prototype.handleNumberingSelection = function (args) {
        switch (args.item.id) {
            case this.ribbonId + '_number-none':
                this.bulletNoneClick();
                break;
            case this.ribbonId + '_number-arabic':
                this.numberedNumberDotClick();
                break;
            case this.ribbonId + '_number-lowroman':
                this.numberedLowRomanClick();
                break;
            case this.ribbonId + '_number-uproman':
                this.numberedUpRomanClick();
                break;
            case this.ribbonId + '_number-lowletter':
                this.numberedLowLetterClick();
                break;
            case this.ribbonId + '_number-upletter':
                this.numberedUpLetterClick();
                break;
        }
    };
    NumberingGroup.prototype.bulletNoneClick = function () {
        BulletListHelper.clearList(this.documentEditor);
        this.refreshHomeSelection();
    };
    NumberingGroup.prototype.numberedNumberDotClick = function () {
        this.applyNumbering('Arabic', 'arabic');
    };
    NumberingGroup.prototype.numberedLowLetterClick = function () {
        this.applyNumbering('LowLetter', 'lowletter');
    };
    NumberingGroup.prototype.numberedUpLetterClick = function () {
        this.applyNumbering('UpLetter', 'upletter');
    };
    NumberingGroup.prototype.numberedLowRomanClick = function () {
        this.applyNumbering('LowRoman', 'lowroman');
    };
    NumberingGroup.prototype.numberedUpRomanClick = function () {
        this.applyNumbering('UpRoman', 'uproman');
    };
    NumberingGroup.prototype.applyNumbering = function (pattern, style) {
        var _this = this;
        if (!this.documentEditor.isReadOnly && this.documentEditor.editorModule) {
            this.appliedNumberingStyle = style;
            var format = BulletListHelper.getLevelFormatNumber(this.documentEditor);
            this.documentEditor.editorModule.applyNumbering(format, pattern);
            setTimeout(function () {
                _this.documentEditor.focusIn();
                _this.refreshHomeSelection();
            }, 30);
        }
    };
    NumberingGroup.prototype.refreshHomeSelection = function () {
        var ribbonModule = this.container.ribbonModule;
        if (ribbonModule && ribbonModule.tabManager && ribbonModule.tabManager.homeTab) {
            ribbonModule.tabManager.homeTab.updateSelection();
        }
    };
    NumberingGroup.prototype.destroy = function () {
        // Remove event listeners for numbering tags
        if (this.noneNumberTag) {
            this.noneNumberTag.removeEventListener('click', this.numberedAndBulletNoneClickHandler);
        }
        if (this.numberList) {
            this.numberList.removeEventListener('click', this.numberedNumberDotClickHandler);
        }
        if (this.lowLetter) {
            this.lowLetter.removeEventListener('click', this.numberedLowLetterClickHandler);
        }
        if (this.upLetter) {
            this.upLetter.removeEventListener('click', this.numberedUpLetterClickHandler);
        }
        if (this.lowRoman) {
            this.lowRoman.removeEventListener('click', this.numberedLowRomanClickHandler);
        }
        if (this.upRoman) {
            this.upRoman.removeEventListener('click', this.numberedUpRomanClickHandler);
        }
        // Clear references
        this.noneNumberTag = null;
        this.numberList = null;
        this.lowLetter = null;
        this.upLetter = null;
        this.lowRoman = null;
        this.upRoman = null;
    };
    return NumberingGroup;
}());
export { NumberingGroup };
