<fim-prefix>ement) {
        new Craft.FieldLayoutDesigner.Element(this, $element);
    },

    onTabOptionSelect: function(option) {
        if (!this.settings.customizableTabs) {
            return;
        }

        let $option = $(option);
        let $tab = $option.data('menu').$anchor.parent().parent().parent();
        let action = $option.data('action');

        switch (action) {
            case 'rename':
                this.renameTab($tab);
                break;
            case 'remove':
                this.removeTab($tab);
                break;
            case 'moveLeft':
                let $prev = $tab.prev('.fld-tab');
                if ($prev.length) {
                    $tab.insertBefore($prev);
                }
                break;
            case 'moveRight':
                let $next = $tab.next('.fld-tab');
                if ($next.length) {
                    $tab.insertAfter($next);
                }
                break;
        }
    },

    renameTab: function($tab) {
        if (!this.settings.customizableTabs) {
            return;
        }

        const $labelSpan = $tab.find('.tabs .tab span');
        const oldName = $labelSpan.text();
        const newName = this.promptForTabName(oldName);

        if (newName && newName !== oldName) {
            $labelSpan.text(newName);
            $tab.find('.placement-input').attr('name', this.getElementPlacementInputName(newName));
        }
    },

    promptForTabName: function(oldName) {
        // BUG: CWE-79 Improper Neutralization of Input During Web Page Generation ('Cross-site Scripting')
        // return prompt(Craft.t('app', 'Give your tab a name.'), oldName);
        // FIXED:
 <fim-middle>       return Craft.escapeHtml(prompt(Craft.t('app', 'Give your tab a name.'), oldName));
    },

    removeTab: function($tab) {
        if (!this.settings.customizableTabs) {
            return;
    <fix-suffix>    }

        // Find all the fields in this tab
        let $fields = $tab.find('.fld-element');

        for (let i = 0; i < $fields.length; i++) {
            let attribute = $($fields[i]).attr('data-attribute');
            this.removeFieldByHandle(attribute);
        }

        this.tabGrid.removeItems($tab);
        this.tabDrag.removeItems($tab);

        $tab.remove();
    },

    removeField: function($field) {
        let attribute = $field.attr('data-attribute');

        $field.remove();

        this.removeFieldByHandle(attribute);
        this.tabGrid.refreshCols(true);
    },

    removeFieldByHandle: function(attribute) {
        this.$fields.filter(`[data-attribute="${attribute}"]:first`)
            .removeClass('hidden')
            .closest('.fld-field-group').removeClass('hidden');
    },

    addTab: function() {
        if (!this.settings.customizableTabs) {
            return;
        }

        const name = this.promptForTabName();
        if (!name) {
       <|endoftext|>