src/menu/Separator.js

   1 /**
   2  * @class Ext.menu.Separator
   3  * @extends Ext.menu.Item
   4  *
   5  * Adds a separator bar to a menu, used to divide logical groups of menu items. Generally you will
   6  * add one of these by using "-" in your call to add() or in your items config rather than creating one directly.
   7  *
   8  * {@img Ext.menu.Separator/Ext.menu.Separator.png Ext.menu.Separator component}
   9  *
  10  * ## Code
  11  *
  12  *     Ext.create('Ext.menu.Menu', {
  13  *         width: 100,
  14  *         height: 100,
  15  *         floating: false,  // usually you want this set to True (default)
  16  *         renderTo: Ext.getBody(),  // usually rendered by it's containing component
  17  *         items: [{
  18  *             text: 'icon item',
  19  *             iconCls: 'add16'
  20  *         },{
  21  *             xtype: 'menuseparator'
  22  *         },{
  23  *            text: 'seperator above',
  24  *         },{
  25  *            text: 'regular item',
  26  *         }]
  27  *     });
  28  *
  29  * @xtype menuseparator
  30  * @markdown
  31  * @constructor
  32  * @param {Object} config The config object
  33  */
  34 Ext.define('Ext.menu.Separator', {
  35     extend: 'Ext.menu.Item',
  36     alias: 'widget.menuseparator',
  37
  38     /**
  39      * @cfg {String} activeCls @hide
  40      */
  41
  42     /**
  43      * @cfg {Boolean} canActivate @hide
  44      */
  45     canActivate: false,
  46
  47     /**
  48      * @cfg {Boolean} clickHideDelay @hide
  49      */
  50
  51     /**
  52      * @cfg {Boolean} destroyMenu @hide
  53      */
  54
  55     /**
  56      * @cfg {Boolean} disabledCls @hide
  57      */
  58
  59     focusable: false,
  60
  61     /**
  62      * @cfg {String} href @hide
  63      */
  64
  65     /**
  66      * @cfg {String} hrefTarget @hide
  67      */
  68
  69     /**
  70      * @cfg {Boolean} hideOnClick @hide
  71      */
  72     hideOnClick: false,
  73
  74     /**
  75      * @cfg {String} icon @hide
  76      */
  77
  78     /**
  79      * @cfg {String} iconCls @hide
  80      */
  81
  82     /**
  83      * @cfg {Mixed} menu @hide
  84      */
  85
  86     /**
  87      * @cfg {String} menuAlign @hide
  88      */
  89
  90     /**
  91      * @cfg {Number} menuExpandDelay @hide
  92      */
  93
  94     /**
  95      * @cfg {Number} menuHideDelay @hide
  96      */
  97
  98     /**
  99      * @cfg {Boolean} plain @hide
 100      */
 101     plain: true,
 102
 103     /**
 104      * @cfg {String} separatorCls
 105      * The CSS class used by the separator item to show the incised line.
 106      * Defaults to `Ext.baseCSSPrefix + 'menu-item-separator'`.
 107      * @markdown
 108      */
 109     separatorCls: Ext.baseCSSPrefix + 'menu-item-separator',
 110
 111     /**
 112      * @cfg {String} text @hide
 113      */
 114     text: '&#160;',
 115
 116     onRender: function(ct, pos) {
 117         var me = this,
 118             sepCls = me.separatorCls;
 119
 120         me.cls += ' ' + sepCls;
 121
 122         Ext.applyIf(me.renderSelectors, {
 123             itemSepEl: '.' + sepCls
 124         });
 125
 126         me.callParent(arguments);
 127     }
 128 });