Skip to main content

Xeditor Roles

Every element in a schema must be assigned a role, which defines properties and governs behavior for that element in Xeditor. When generating a new schema configuration, the roles are defined in the info.xml file. Xeditor comes with predefined roles. Custom roles can be created in src/js/config/roles.js.

All of the available properties are listed in roles.js.

Note: For pre-defined DITA roles see DITA Roles.

The following pre-defined roles are available:

Default Container Roles​

Ext.ux.xeditor.Config.setConfigs({
    'roles:xeditor.default.base': {
        tag: 'div',
        labeled: false,
        splitable: true,
        mergeable: false,
        recursiveMerge: false,
        validate: true,
        insertSpaceAfter: true,
        showInBreadcrumb: true,
        showInContextMenu: true,
        showInAttributesPanel: true,
        showInsertMenu: false,
        showInInsertMenu: false,
        showChangeMenu: false,
        showInChangeMenu: false,
        showInSearchField: true,
        showInInsertElementPanelNavigation: true,
        showInInsertElementPanel: true,
        showInTagView: null,
        moveSelectionType: 'end',
        siblingToRemove: false,
        containerToMerge: false,
        removeIfEmpty: false,
        breakLevel: false,
        wrapPath: false,
        wholeElement: true,
        documentSplitBoundary: false,
        isInline: false,
        isLineBreak: false,
        editable: undefined,
        removable: undefined,
        preserveWhitespaces: false,
        enableCopyElementItem: true,
        enableCopyElementTextItem: true,
        enableCutElementItem: true,
        enableDeleteElementItem: true,
        enableRemoveElementItem: false,
        showInAttributesListPanelNavigation: true
    },

    'roles:xeditor.default.container': {
        extend: 'roles:xeditor.default.base',
        mergeable: true,
        recursiveMerge: true,
        showInsertMenu: true,
        showInInsertMenu: true,
        showChangeMenu: true,
        showInChangeMenu: true,
        containerToMerge: true,
        removeIfEmpty: true,
        breakLevel: true,
        documentSplitBoundary: true
    },

    'roles:xeditor.default.inline': {
        extend: 'roles:xeditor.default.base',
        mergeable: true,
        recursiveMerge: true,
        insertSpaceAfter: false,
        moveSelectionType: 'none',
        isInline: true,
        enableCopyElementItem: false,
        enableCutElementItem: false,
        enableDeleteElementItem: false,
        enableRemoveElementItem: true

    },

    //////////////////////////////

    'roles:xeditor.container': {
        extend: 'roles:xeditor.default.container',
        cssClass: 'xe-default-container'
    },

    'roles:xeditor.inline': {
        extend: 'roles:xeditor.default.inline',
        cssClass: 'xe-default-inline'
    },

    'roles:xeditor.inlineContainer': {
        extend: 'roles:xeditor.default.inline',
        cssClass: 'xe-default-inlineContainer',
        insertSpaceAfter: true
    },

    'roles:xeditor.text': {
        extend: 'roles:xeditor.default.inline',
        tag: 'span',
        cssClass: '',
        showInBreadcrumb: false,
        showInContextMenu: false,
        showInAttributesPanel: false,
        showInSearchField: false,
        showInInsertElementPanelNavigation: false,
        showInInsertElementPanel: false
    },

    'roles:xeditor.lineBreak': {
        extend: 'roles:xeditor.default.inline',
        cssClass: 'xe-default-linebreak',
        splitable: false,
        mergeable: false,
        recursiveMerge: false,
        insertSpaceAfter: true,
        siblingToRemove: true,
        isInline: false,
        isLineBreak: true
    },

    'roles:xeditor.superContainer': {
        extend: 'roles:xeditor.default.container',
        cssClass: 'xe-default-chapter',
        recursiveMerge: false
    },

    'roles:xeditor.masterContainer': {
        extend: 'roles:xeditor.default.container',
        cssClass: 'xe-default-chapter',
        splitable: false,
        mergeable: false,
        recursiveMerge: false,
        containerToMerge: false,
        removeIfEmpty: false,
        breakLevel: false,
        enableCopyElementItem: false,
        enableCutElementItem: false,
        enableDeleteElementItem: false,
        enableRemoveElementItem: false
    },

Images / Media Roles​

    'roles:xeditor.mediaBlock': {
        extend: 'roles:xeditor.default.container',
        cssClass: 'xe-default-media',
        splitable: false,
        mergeable: false,
        recursiveMerge: false,
        showInInsertMenu: false,
        showChangeMenu: false,
        showInChangeMenu: false,
        siblingToRemove: true,
        containerToMerge: false,
        removeIfEmpty: false,
        breakLevel: false,
        wholeElement: false,
        enableCopyElementItem: false,
        enableCutElementItem: false,
        enableDeleteElementItem: false,
        enableRemoveElementItem: false
    },

    'roles:xeditor.media': {
        extend: 'roles:xeditor.mediaBlock',
        cssClass: 'xe-default-media',
        insertSpaceAfter: false,
        showInsertMenu: false,
        moveSelectionType: 'none',
        wholeElement: true,
        documentSplitBoundary: false,
        enableCopyElementItem: true,
        enableCutElementItem: true,
        enableDeleteElementItem: true
    },

List Roles​

    'roles:xeditor.list': {
        extend: 'roles:xeditor.default.container',
        tag: 'ul',
        cssClass: 'xe-default-unorderedList',
        recursiveMerge: false
    },

    'roles:xeditor.listItem': {
        extend: 'roles:xeditor.default.container',
        tag: 'li',
        cssClass: 'xe-default-listItem',
        showChangeMenu: false,
        showInChangeMenu: false,
        documentSplitBoundary: false
    },

Table roles​

    'roles:xeditor.table': {
        extend: 'roles:xeditor.default.container',
        tag: 'table',
        cssClass: 'xe-default-table',
        splitable: false,
        mergeable: false,
        recursiveMerge: false,
        showInsertMenu: false,
        showInInsertMenu: false,
        showChangeMenu: false,
        showInChangeMenu: false,
        containerToMerge: false,
        removeIfEmpty: false,
        breakLevel: false
    },

    'roles:xeditor.tableCaption': {
        extend: 'roles:xeditor.table',
        tag: 'caption',
        cssClass: 'xe-default-tabCaption',
        showInsertMenu: true,
        showInInsertMenu: true,
        removeIfEmpty: true,
        documentSplitBoundary: false,
        enableCopyElementItem: false,
        enableCutElementItem: false,
    },

    'roles:xeditor.tableColGroup': {
        extend: 'roles:xeditor.table',
        tag: 'colgroup',
        cssClass: 'xe-default-hidden',
        showInSearchField: false,
        wholeElement: false,
        documentSplitBoundary: false,
        showInInsertElementPanelNavigation: false,
        showInInsertElementPanel: false,
        enableCopyElementItem: false,
        enableCopyElementTextItem: false,
        enableCutElementItem: false,
        enableDeleteElementItem: false,
        enableRemoveElementItem: false
    },

    'roles:xeditor.tableCol': {
        extend: 'roles:xeditor.table',
        tag: 'col',
        cssClass: 'xe-default-hidden',
        showInSearchField: false,
        wholeElement: false,
        documentSplitBoundary: false,
        showInInsertElementPanelNavigation: false,
        showInInsertElementPanel: false,
        enableCopyElementItem: false,
        enableCopyElementTextItem: false,
        enableCutElementItem: false,
        enableDeleteElementItem: false,
        enableRemoveElementItem: false
    },

    'roles:xeditor.tableHead': {
        extend: 'roles:xeditor.table',
        tag: 'thead',
        cssClass: 'xe-default-tabHead',
        showInSearchField: false,
        wholeElement: false,
        documentSplitBoundary: false,
        showInInsertElementPanelNavigation: true,
        showInInsertElementPanel: false,
        enableCopyElementItem: false,
        enableCutElementItem: false,
        enableDeleteElementItem: false,
        enableRemoveElementItem: false
    },

    'roles:xeditor.tableBody': {
        extend: 'roles:xeditor.table',
        tag: 'tbody',
        cssClass: 'xe-default-tabBody',
        showInSearchField: false,
        wholeElement: false,
        documentSplitBoundary: false,
        showInInsertElementPanelNavigation: true,
        showInInsertElementPanel: false,
        enableCopyElementItem: false,
        enableCutElementItem: false,
        enableDeleteElementItem: false,
        enableRemoveElementItem: false
    },

    'roles:xeditor.tableFoot': {
        extend: 'roles:xeditor.table',
        tag: 'tfoot',
        cssClass: 'xe-default-tabFoot',
        showInSearchField: false,
        wholeElement: false,
        documentSplitBoundary: false,
        showInInsertElementPanelNavigation: true,
        showInInsertElementPanel: false,
        enableCopyElementItem: false,
        enableCutElementItem: false,
        enableDeleteElementItem: false,
        enableRemoveElementItem: false
    },

    'roles:xeditor.tableRow': {
        extend: 'roles:xeditor.table',
        tag: 'tr',
        cssClass: 'xe-default-tabRow',
        showInSearchField: false,
        wholeElement: false,
        documentSplitBoundary: false,
        showInInsertElementPanelNavigation: true,
        showInInsertElementPanel: false,
        enableCopyElementItem: false,
        enableCutElementItem: false,
        enableDeleteElementItem: false,
        enableRemoveElementItem: false
    },

    'roles:xeditor.tableCell': {
        extend: 'roles:xeditor.table',
        tag: 'td',
        cssClass: 'xe-default-tabCell',
        splitable: false,
        showInInsertMenu: false,
        showInSearchField: false,
        containerToMerge: false,
        removeIfEmpty: false,
        breakLevel: false,
        wholeElement: false,
        documentSplitBoundary: false,
        showInInsertElementPanelNavigation: true,
        showInInsertElementPanel: false,
        enableCopyElementItem: false,
        enableCutElementItem: false,
        enableDeleteElementItem: false,
        enableRemoveElementItem: false
    },

    'roles:xeditor.tableHeadCell': {
        extend: 'roles:xeditor.tableCell',
        tag: 'th',
        cssClass: 'xe-default-tabHeadCell'
    },

Empty Role​

    'roles:xeditor.empty': {
        extend: 'roles:xeditor.default.inline',
        cssClass: 'xe-default-empty',
        splitable: false,
        mergeable: false,
        recursiveMerge: false,
        insertSpaceAfter: true,
        showChangeMenu: true,
        moveSelectionType: 'none',
        siblingToRemove: true,
        isInline: false,
        enableCopyElementItem: false,
        enableCutElementItem: false,
        enableDeleteElementItem: false,
        enableRemoveElementItem: false
    }