From 99bc8b9780948e62782fd8e1b6fdd54ae7b960a0 Mon Sep 17 00:00:00 2001 From: noogen Date: Wed, 5 Jan 2022 16:43:02 -0600 Subject: [PATCH] update packages to datatables.net 1.11.3 --- dist/index.js.LICENSE.txt | 2 +- example/index.js | 17113 +++--------------------------------- example/index.js.map | 2 +- example/mix-manifest.json | 2 +- index.html | 2 +- package-lock.json | 114 +- package.json | 6 +- 7 files changed, 1030 insertions(+), 16211 deletions(-) diff --git a/dist/index.js.LICENSE.txt b/dist/index.js.LICENSE.txt index d6b7b8a..999f36f 100644 --- a/dist/index.js.LICENSE.txt +++ b/dist/index.js.LICENSE.txt @@ -2,7 +2,7 @@ * vue-datatables-net * Vue jQuery DataTables.net wrapper component * - * @version v1.5.5 + * @version v1.6.0 * @author friends@niiknow.org * @repository https://github.com/niiknow/vue-datatables-net.git */ diff --git a/example/index.js b/example/index.js index 1cc797b..7aebaf3 100644 --- a/example/index.js +++ b/example/index.js @@ -2,7 +2,7 @@ * vue-datatables-net * Vue jQuery DataTables.net wrapper component * - * @version v1.5.5 + * @version v1.6.0 * @author friends@niiknow.org * @repository https://github.com/niiknow/vue-datatables-net.git */ @@ -4831,6 +4831,21 @@ $.extend( true, DataTable.Buttons.defaults, { active: 'active', disabled: 'disabled' } + }, + splitWrapper: { + tag: 'div', + className: 'dt-btn-split-wrapper btn-group', + }, + splitDropdown: { + tag: 'button', + text: '', + className: 'btn btn-secondary dt-btn-split-drop dropdown-toggle dropdown-toggle-split', + align: 'split-left', + splitAlignClass: 'dt-button-split-left' + }, + splitDropdownButton: { + tag: 'button', + className: 'dt-btn-split-drop-button btn btn-secondary' } }, buttonCreated: function ( config, button ) { @@ -5609,7 +5624,7 @@ var excelStrings = { // Ref: section 3.8.30 - built in formatters in open spreadsheet // https://www.ecma-international.org/news/TC45_current_work/Office%20Open%20XML%20Part%204%20-%20Markup%20Language%20Reference.pdf var _excelSpecials = [ - { match: /^\-?\d+\.\d%$/, style: 60, fmt: function (d) { return d/100; } }, // Precent with d.p. + { match: /^\-?\d+\.\d%$/, style: 60, fmt: function (d) { return d/100; } }, // Percent with d.p. { match: /^\-?\d+\.?\d*%$/, style: 56, fmt: function (d) { return d/100; } }, // Percent { match: /^\-?\$[\d,]+.?\d*$/, style: 57 }, // Dollars { match: /^\-?£[\d,]+.?\d*$/, style: 58 }, // Pounds @@ -5935,7 +5950,7 @@ DataTable.ext.buttons.excelHtml5 = { if ( ! cell ) { if ( typeof row[i] === 'number' || ( row[i].match && - row[i].match(/^-?\d+(\.\d+)?$/) && + row[i].match(/^-?\d+(\.\d+)?([eE]\-?\d+)?$/) && // Includes exponential format ! row[i].match(/^0\d+/) ) ) { // Detect numbers - don't match numbers with leading zeros @@ -6519,7 +6534,7 @@ return DataTable.Buttons; \**********************************************************************/ /***/ (function(module, exports, __webpack_require__) { -var __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_DEFINE_RESULT__;/*! Buttons for DataTables 1.7.1 +var __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_DEFINE_RESULT__;/*! Buttons for DataTables 2.1.1 * ©2016-2021 SpryMedia Ltd - datatables.net/license */ @@ -6552,6 +6567,7 @@ function _fadeIn(el, duration, fn) { el .stop() .fadeIn( duration, fn ); + } else { el.css('display', 'block'); @@ -6684,9 +6700,11 @@ $.extend( Buttons.prototype, { * Add a new button * @param {object} config Button configuration object, base string name or function * @param {int|string} [idx] Button index for where to insert the button + * @param {boolean} [draw=true] Trigger a draw. Set a false when adding + * lots of buttons, until the last button. * @return {Buttons} Self for chaining */ - add: function ( config, idx ) + add: function ( config, idx, draw ) { var buttons = this.s.buttons; @@ -6702,12 +6720,54 @@ $.extend( Buttons.prototype, { idx = split[ split.length-1 ]*1; } - this._expandButton( buttons, config, base !== undefined, idx ); - this._draw(); + this._expandButton( + buttons, + config, + config !== undefined ? config.split : undefined, + (config === undefined || config.split === undefined || config.split.length === 0) && base !== undefined, + false, + idx + ); + if (draw === undefined || draw === true) { + this._draw(); + } + return this; }, + /** + * Clear buttons from a collection and then insert new buttons + */ + collectionRebuild: function ( node, newButtons ) + { + var button = this._nodeToButton( node ); + + if(newButtons !== undefined) { + var i; + // Need to reverse the array + for (i=button.buttons.length-1; i>=0; i--) { + this.remove(button.buttons[i].node); + } + + for (i=0; i'); + + if ( built.conf.buttons || built.conf.split ) { + built.collection = $('<'+(isSplit ? this.c.dom.splitCollection.tag : this.c.dom.collection.tag)+'/>'); built.conf._collection = built.collection; - this._expandButton( built.buttons, built.conf.buttons, true, attachPoint ); + if(built.conf.split) { + for(var j = 0; j < built.conf.split.length; j++) { + if(typeof built.conf.split[j] === "object") { + built.conf.split[i].parent = parentConf; + if(built.conf.split[j].collectionLayout === undefined) { + built.conf.split[j].collectionLayout = built.conf.collectionLayout; + } + if(built.conf.split[j].dropup === undefined) { + built.conf.split[j].dropup = built.conf.dropup; + } + if(built.conf.split[j].fade === undefined) { + built.conf.split[j].fade = built.conf.fade; + } + } + } + } + else { + $(built.node).append($(''+this.c.dom.splitDropdown.text+'')) + } + + this._expandButton( built.buttons, built.conf.buttons, built.conf.split, !isSplit, isSplit, attachPoint, built.conf ); } + built.conf.parent = parentConf; // init call is made here, rather than buildButton as it needs to // be selectable, and for that it needs to be in the buttons array @@ -7069,11 +7209,14 @@ $.extend( Buttons.prototype, { * @return {jQuery} Created button node (jQuery) * @private */ - _buildButton: function ( config, inCollection ) + _buildButton: function ( config, inCollection, isSplit, inSplit ) { var buttonDom = this.c.dom.button; var linerDom = this.c.dom.buttonLiner; var collectionDom = this.c.dom.collection; + var splitDom = this.c.dom.split; + var splitCollectionDom = this.c.dom.splitCollection; + var splitDropdownButton = this.c.dom.splitDropdownButton; var dt = this.s.dt; var text = function ( opt ) { return typeof opt === 'function' ? @@ -7081,97 +7224,137 @@ $.extend( Buttons.prototype, { opt; }; - if ( inCollection && collectionDom.button ) { - buttonDom = collectionDom.button; + // Spacers don't do much other than insert an element into the DOM + if (config.spacer) { + var spacer = $('') + .addClass('dt-button-spacer ' + config.style + ' ' + buttonDom.spacerClass) + .html(text(config.text)); + + return { + conf: config, + node: spacer, + inserter: spacer, + buttons: [], + inCollection: inCollection, + isSplit: isSplit, + inSplit: inSplit, + collection: null + }; } - if ( inCollection && collectionDom.buttonLiner ) { + if ( !isSplit && inSplit && splitCollectionDom ) { + buttonDom = splitDropdownButton; + } + else if ( !isSplit && inCollection && collectionDom.button ) { + buttonDom = collectionDom.button; + } + + if ( !isSplit && inSplit && splitCollectionDom.buttonLiner ) { + linerDom = splitCollectionDom.buttonLiner + } + else if ( !isSplit && inCollection && collectionDom.buttonLiner ) { linerDom = collectionDom.buttonLiner; } // Make sure that the button is available based on whatever requirements // it has. For example, PDF button require pdfmake - if ( config.available && ! config.available( dt, config ) ) { + if ( config.available && ! config.available( dt, config ) && !config.hasOwnProperty('html') ) { return false; } - var action = function ( e, dt, button, config ) { - config.action.call( dt.button( button ), e, dt, button, config ); + var button; + if(!config.hasOwnProperty('html')) { + var action = function ( e, dt, button, config ) { + config.action.call( dt.button( button ), e, dt, button, config ); + + $(dt.table().node()).triggerHandler( 'buttons-action.dt', [ + dt.button( button ), dt, button, config + ] ); + }; - $(dt.table().node()).triggerHandler( 'buttons-action.dt', [ - dt.button( button ), dt, button, config - ] ); - }; + var tag = config.tag || buttonDom.tag; + var clickBlurs = config.clickBlurs === undefined + ? true : + config.clickBlurs; - var tag = config.tag || buttonDom.tag; - var clickBlurs = config.clickBlurs === undefined ? true : config.clickBlurs - var button = $('<'+tag+'/>') - .addClass( buttonDom.className ) - .attr( 'tabindex', this.s.dt.settings()[0].iTabIndex ) - .attr( 'aria-controls', this.s.dt.table().node().id ) - .on( 'click.dtb', function (e) { - e.preventDefault(); - - if ( ! button.hasClass( buttonDom.disabled ) && config.action ) { - action( e, dt, button, config ); - } - if( clickBlurs ) { - button.trigger('blur'); - } - } ) - .on( 'keyup.dtb', function (e) { - if ( e.keyCode === 13 ) { + button = $('<'+tag+'/>') + .addClass( buttonDom.className ) + .addClass( inSplit ? this.c.dom.splitDropdownButton.className : '') + .attr( 'tabindex', this.s.dt.settings()[0].iTabIndex ) + .attr( 'aria-controls', this.s.dt.table().node().id ) + .on( 'click.dtb', function (e) { + e.preventDefault(); + if ( ! button.hasClass( buttonDom.disabled ) && config.action ) { action( e, dt, button, config ); } - } - } ); - - // Make `a` tags act like a link - if ( tag.toLowerCase() === 'a' ) { - button.attr( 'href', '#' ); - } - - // Button tags should have `type=button` so they don't have any default behaviour - if ( tag.toLowerCase() === 'button' ) { - button.attr( 'type', 'button' ); - } - - if ( linerDom.tag ) { - var liner = $('<'+linerDom.tag+'/>') - .html( text( config.text ) ) - .addClass( linerDom.className ); + if( clickBlurs ) { + button.trigger('blur'); + } + } ) + .on( 'keypress.dtb', function (e) { + if ( e.keyCode === 13 ) { + e.preventDefault(); - if ( linerDom.tag.toLowerCase() === 'a' ) { - liner.attr( 'href', '#' ); + if ( ! button.hasClass( buttonDom.disabled ) && config.action ) { + action( e, dt, button, config ); + } + } + } ); + + // Make `a` tags act like a link + if ( tag.toLowerCase() === 'a' ) { + button.attr( 'href', '#' ); + } + + // Button tags should have `type=button` so they don't have any default behaviour + if ( tag.toLowerCase() === 'button' ) { + button.attr( 'type', 'button' ); + } + + if ( linerDom.tag ) { + var liner = $('<'+linerDom.tag+'/>') + .html( text( config.text ) ) + .addClass( linerDom.className ); + + if ( linerDom.tag.toLowerCase() === 'a' ) { + liner.attr( 'href', '#' ); + } + + button.append( liner ); + } + else { + button.html( text( config.text ) ); + } + + if ( config.enabled === false ) { + button.addClass( buttonDom.disabled ); + } + + if ( config.className ) { + button.addClass( config.className ); + } + + if ( config.titleAttr ) { + button.attr( 'title', text( config.titleAttr ) ); + } + + if ( config.attr ) { + button.attr( config.attr ); + } + + if ( ! config.namespace ) { + config.namespace = '.dt-button-'+(_buttonCounter++); } - button.append( liner ); + if ( config.config !== undefined && config.config.split ) { + config.split = config.config.split; + } } else { - button.html( text( config.text ) ); - } - - if ( config.enabled === false ) { - button.addClass( buttonDom.disabled ); + button = $(config.html) } - - if ( config.className ) { - button.addClass( config.className ); - } - - if ( config.titleAttr ) { - button.attr( 'title', text( config.titleAttr ) ); - } - - if ( config.attr ) { - button.attr( config.attr ); - } - - if ( ! config.namespace ) { - config.namespace = '.dt-button-'+(_buttonCounter++); - } - + var buttonContainer = this.c.dom.buttonContainer; var inserter; if ( buttonContainer && buttonContainer.tag ) { @@ -7192,12 +7375,70 @@ $.extend( Buttons.prototype, { inserter = this.c.buttonCreated( config, inserter ); } + var splitDiv; + if(isSplit) { + splitDiv = $('
').addClass(this.c.dom.splitWrapper.className) + splitDiv.append(button); + var dropButtonConfig = $.extend(config, { + text: this.c.dom.splitDropdown.text, + className: this.c.dom.splitDropdown.className, + attr: { + 'aria-haspopup': true, + 'aria-expanded': false + }, + align: this.c.dom.splitDropdown.align, + splitAlignClass: this.c.dom.splitDropdown.splitAlignClass + + }) + + this._addKey(dropButtonConfig); + + var splitAction = function ( e, dt, button, config ) { + _dtButtons.split.action.call( dt.button($('div.dt-btn-split-wrapper')[0] ), e, dt, button, config ); + + $(dt.table().node()).triggerHandler( 'buttons-action.dt', [ + dt.button( button ), dt, button, config + ] ); + button.attr('aria-expanded', true) + }; + + var dropButton = $('') + .on( 'click.dtb', function (e) { + e.preventDefault(); + e.stopPropagation(); + + if ( ! dropButton.hasClass( buttonDom.disabled )) { + splitAction( e, dt, dropButton, dropButtonConfig ); + } + if ( clickBlurs ) { + dropButton.trigger('blur'); + } + } ) + .on( 'keypress.dtb', function (e) { + if ( e.keyCode === 13 ) { + e.preventDefault(); + + if ( ! dropButton.hasClass( buttonDom.disabled ) ) { + splitAction( e, dt, dropButton, dropButtonConfig ); + } + } + } ); + + if(config.split.length === 0) { + dropButton.addClass('dtb-hide-drop'); + } + + splitDiv.append(dropButton).attr(dropButtonConfig.attr); + } + return { conf: config, - node: button.get(0), - inserter: inserter, + node: isSplit ? splitDiv.get(0) : button.get(0), + inserter: isSplit ? splitDiv : inserter, buttons: [], inCollection: inCollection, + isSplit: isSplit, + inSplit: inSplit, collection: null }; }, @@ -7351,6 +7592,7 @@ $.extend( Buttons.prototype, { */ _resolveExtends: function ( conf ) { + var that = this; var dt = this.s.dt; var i, ien; var toConfObject = function ( base ) { @@ -7365,7 +7607,7 @@ $.extend( Buttons.prototype, { } if ( typeof base === 'function' ) { - base = base( dt, conf ); + base = base.call( that, dt, conf ); if ( ! base ) { return false; @@ -7373,7 +7615,7 @@ $.extend( Buttons.prototype, { } else if ( typeof base === 'string' ) { if ( ! _dtButtons[ base ] ) { - throw 'Unknown button type: '+base; + return {html: base} } base = _dtButtons[ base ]; @@ -7414,6 +7656,10 @@ $.extend( Buttons.prototype, { // Stash the current class name var originalClassName = objArray.className; + if (conf.config !== undefined && objArray.config !== undefined) { + conf.config = $.extend({}, objArray.config, conf.config) + } + conf = $.extend( {}, objArray, conf ); // The extend will have overwritten the original class name if the @@ -7466,11 +7712,12 @@ $.extend( Buttons.prototype, { * @param {DataTable.Api} hostButton DT API instance of the button * @param {object} inOpts Options (see object below for all options) */ - _popover: function ( content, hostButton, inOpts ) { + _popover: function ( content, hostButton, inOpts, e ) { var dt = hostButton; var buttonsSettings = this.c; + var closed = false; var options = $.extend( { - align: 'button-left', // button-right, dt-container + align: 'button-left', // button-right, dt-container, split-left, split-right autoClose: false, background: true, backgroundClassName: 'dt-button-background', @@ -7479,12 +7726,18 @@ $.extend( Buttons.prototype, { collectionTitle: '', dropup: false, fade: 400, + popoverTitle: '', rightAlignClassName: 'dt-button-right', + splitRightAlignClassName: 'dt-button-split-right', + splitLeftAlignClassName: 'dt-button-split-left', tag: buttonsSettings.dom.collection.tag }, inOpts ); + var hostNode = hostButton.node(); var close = function () { + closed = true; + _fadeOut( $('.dt-button-collection'), options.fade, @@ -7501,15 +7754,20 @@ $.extend( Buttons.prototype, { $('body').off( '.dtb-collection' ); dt.off( 'buttons-action.b-internal' ); + dt.off( 'destroy' ); }; if (content === false) { close(); + return; } var existingExpanded = $(dt.buttons( '[aria-haspopup="true"][aria-expanded="true"]' ).nodes()); if ( existingExpanded.length ) { - hostNode = existingExpanded.eq(0); + // Reuse the current position if the button that was triggered is inside an existing collection + if (hostNode.closest('div.dt-button-collection').length) { + hostNode = existingExpanded.eq(0); + } close(); } @@ -7517,6 +7775,7 @@ $.extend( Buttons.prototype, { var display = $('
') .addClass('dt-button-collection') .addClass(options.collectionLayout) + .addClass(options.splitAlignClass) .css('display', 'none'); content = $(content) @@ -7530,7 +7789,10 @@ $.extend( Buttons.prototype, { hostNode = document.body.lastChild; } - if ( options.collectionTitle ) { + if ( options.popoverTitle ) { + display.prepend('
'+options.popoverTitle+'
'); + } + else if ( options.collectionTitle ) { display.prepend('
'+options.collectionTitle+'
'); } @@ -7552,7 +7814,9 @@ $.extend( Buttons.prototype, { var buttonPosition = $(hostButton.node()).position(); display.css( { - top: buttonPosition.top + hostNode.outerHeight(), + top: $($(hostButton[0].node).parent()[0]).hasClass('dt-buttons') + ? buttonPosition.top + hostNode.outerHeight() + : hostPosition.top + hostNode.outerHeight(), left: hostPosition.left } ); @@ -7580,7 +7844,15 @@ $.extend( Buttons.prototype, { // Get the size of the popover (left and width - and ...) var popoverLeft = display.offset().left; - var popoverWidth = display.width(); + var popoverWidth = display.outerWidth(); + + // Foundations display dom element has a width of 0 - the true width is within the child + if (popoverWidth === 0) { + if (display.children().length > 0) { + popoverWidth = $(display.children()[0]).outerWidth(); + } + } + var popoverRight = popoverLeft + popoverWidth; // Get the size of the host buttons (left and width - and ...) @@ -7591,8 +7863,20 @@ $.extend( Buttons.prototype, { if ( display.hasClass( options.rightAlignClassName ) || display.hasClass( options.leftAlignClassName ) || + display.hasClass( options.splitAlignClass ) || options.align === 'dt-container' ){ + // default to the other buttons values + var splitButtonLeft = buttonsLeft; + var splitButtonWidth = buttonsWidth; + var splitButtonRight = buttonsRight; + + // If the button is a split button then need to calculate some more values + if (hostNode.hasClass('dt-btn-split-wrapper') && hostNode.children('button.dt-btn-split-drop').length > 0) { + splitButtonLeft = hostNode.children('button.dt-btn-split-drop').offset().left; + splitButtonWidth = hostNode.children('button.dt-btn-split-drop').outerWidth(); + splitButtonRight = splitButtonLeft + splitButtonWidth; + } // You've then got all the numbers you need to do some calculations and if statements, // so we can do some quick JS maths and apply it only once // If it has the right align class OR the buttons are right aligned OR the button container is floated right, @@ -7614,6 +7898,36 @@ $.extend( Buttons.prototype, { } } } + else if ( display.hasClass( options.splitRightAlignClassName )) { + popoverShuffle = splitButtonRight - popoverRight; + if(tableLeft > (popoverLeft + popoverShuffle)){ + var leftGap = tableLeft - (popoverLeft + popoverShuffle); + var rightGap = tableRight - (popoverRight + popoverShuffle); + + if(leftGap > rightGap){ + popoverShuffle += rightGap; + } + else { + popoverShuffle += leftGap; + } + } + } + else if ( display.hasClass( options.splitLeftAlignClassName )) { + popoverShuffle = splitButtonLeft - popoverLeft; + + if(tableRight < (popoverRight + popoverShuffle) || tableLeft > (popoverLeft + popoverShuffle)){ + var leftGap = tableLeft - (popoverLeft + popoverShuffle); + var rightGap = tableRight - (popoverRight + popoverShuffle); + + if(leftGap > rightGap ){ + popoverShuffle += rightGap; + } + else { + popoverShuffle += leftGap; + } + + } + } // else attempt to left align the popover to the button. Similar to above, if the popover's right goes past the table container's right, // then move it back, but not so much that it goes past the left of the table container else { @@ -7659,7 +7973,12 @@ $.extend( Buttons.prototype, { } if ( options.background ) { - Buttons.background( true, options.backgroundClassName, options.fade, hostNode ); + Buttons.background( + true, + options.backgroundClassName, + options.fade, + options.backgroundHost || hostNode + ); } // This is bonkers, but if we don't have a click listener on the @@ -7668,22 +7987,6 @@ $.extend( Buttons.prototype, { // required to make it work... $('div.dt-button-background').on( 'click.dtb-collection', function () {} ); - $('body') - .on( 'click.dtb-collection', function (e) { - // andSelf is deprecated in jQ1.8, but we want 1.7 compat - var back = $.fn.addBack ? 'addBack' : 'andSelf'; - var parent = $(e.target).parent()[0]; - - if (( ! $(e.target).parents()[back]().filter( content ).length && !$(parent).hasClass('dt-buttons')) || $(e.target).hasClass('dt-button-background')) { - close(); - } - } ) - .on( 'keyup.dtb-collection', function (e) { - if ( e.keyCode === 27 ) { - close(); - } - } ); - if ( options.autoClose ) { setTimeout( function () { dt.on( 'buttons-action.b-internal', function (e, btn, dt, node) { @@ -7694,8 +7997,34 @@ $.extend( Buttons.prototype, { } ); }, 0); } - + $(display).trigger('buttons-popover.dt'); + + + dt.on('destroy', close); + + setTimeout(function() { + closed = false; + $('body') + .on( 'click.dtb-collection', function (e) { + if (closed) { + return; + } + + // andSelf is deprecated in jQ1.8, but we want 1.7 compat + var back = $.fn.addBack ? 'addBack' : 'andSelf'; + var parent = $(e.target).parent()[0]; + + if (( ! $(e.target).parents()[back]().filter( content ).length && !$(parent).hasClass('dt-buttons')) || $(e.target).hasClass('dt-button-background')) { + close(); + } + } ) + .on( 'keyup.dtb-collection', function (e) { + if ( e.keyCode === 27 ) { + close(); + } + } ); + }, 0); } } ); @@ -7793,6 +8122,10 @@ Buttons.instanceSelector = function ( group, buttons ) // Index selector ret.push( buttons[ input ].inst ); } + else if ( typeof input === 'object' ) { + // Actual instance selector + ret.push( input ); + } }; process( group ); @@ -7865,10 +8198,12 @@ Buttons.buttonSelector = function ( insts, selector ) } else if ( typeof selector === 'number' ) { // Main button index selector - ret.push( { - inst: inst, - node: inst.s.buttons[ selector ].node - } ); + if (inst.s.buttons[ selector ]) { + ret.push( { + inst: inst, + node: inst.s.buttons[ selector ].node + } ); + } } else if ( typeof selector === 'string' ) { if ( selector.indexOf( ',' ) !== -1 ) { @@ -7995,11 +8330,35 @@ Buttons.defaults = { tag: 'button', className: 'dt-button', active: 'active', - disabled: 'disabled' + disabled: 'disabled', + spacerClass: '' }, buttonLiner: { tag: 'span', className: '' + }, + split: { + tag: 'div', + className: 'dt-button-split', + }, + splitWrapper: { + tag: 'div', + className: 'dt-btn-split-wrapper', + }, + splitDropdown: { + tag: 'button', + text: '▼', + className: 'dt-btn-split-drop', + align: 'split-right', + splitAlignClass: 'dt-button-split-left' + }, + splitDropdownButton: { + tag: 'button', + className: 'dt-btn-split-drop-button dt-button', + }, + splitCollection: { + tag: 'div', + className: 'dt-button-split-collection', } } }; @@ -8009,7 +8368,7 @@ Buttons.defaults = { * @type {string} * @static */ -Buttons.version = '1.7.1'; +Buttons.version = '2.1.1'; $.extend( _dtButtons, { @@ -8022,8 +8381,6 @@ $.extend( _dtButtons, { button.attr( 'aria-expanded', false ); }, action: function ( e, dt, button, config ) { - e.stopPropagation(); - if ( config._collection.parents('body').length ) { this.popover(false, config); } @@ -8036,6 +8393,22 @@ $.extend( _dtButtons, { } // Also the popover options, defined in Buttons.popover }, + split: { + text: function ( dt ) { + return dt.i18n( 'buttons.split', 'Split' ); + }, + className: 'buttons-split', + init: function ( dt, button, config ) { + return button.attr( 'aria-expanded', false ); + }, + action: function ( e, dt, button, config ) { + this.popover(config._collection, config); + }, + attr: { + 'aria-haspopup': true + } + // Also the popover options, defined in Buttons.popover + }, copy: function ( dt, conf ) { if ( _dtButtons.copyHtml5 ) { return 'copyHtml5'; @@ -8124,6 +8497,13 @@ $.extend( _dtButtons, { dt.off( 'length.dt'+conf.namespace ); } }; + }, + spacer: { + style: 'empty', + spacer: true, + text: function ( dt ) { + return dt.i18n( 'buttons.spacer', '' ); + } } } ); @@ -8196,6 +8576,18 @@ DataTable.Api.registerPlural( 'buttons().action()', 'button().action()', functio } ); } ); +// Collection control +DataTable.Api.registerPlural( 'buttons().collectionRebuild()', 'button().collectionRebuild()', function ( buttons ) { + return this.each( function ( set ) { + for(var i = 0; i < buttons.length; i++) { + if(typeof buttons[i] === 'object') { + buttons[i].parentConf = set; + } + } + set.inst.collectionRebuild( set.node, buttons ); + } ); +} ); + // Enable / disable buttons DataTable.Api.register( ['buttons().enable()', 'button().enable()'], function ( flag ) { return this.each( function ( set ) { @@ -8210,6 +8602,21 @@ DataTable.Api.register( ['buttons().disable()', 'button().disable()'], function } ); } ); +// Button index +DataTable.Api.register( 'button().index()', function () { + var idx = null; + + this.each( function ( set ) { + var res = set.inst.index( set.node ); + + if (res !== null) { + idx = res; + } + } ); + + return idx; +} ); + // Get button nodes DataTable.Api.registerPlural( 'buttons().nodes()', 'button().node()', function () { var jq = $(); @@ -8288,7 +8695,7 @@ DataTable.Api.register( 'buttons().container()', function () { } ); // Add a new button -DataTable.Api.register( 'button().add()', function ( idx, conf ) { +DataTable.Api.register( 'button().add()', function ( idx, conf, draw ) { var ctx = this.context; // Don't use `this` as it could be empty - select the instances directly @@ -8296,7 +8703,7 @@ DataTable.Api.register( 'button().add()', function ( idx, conf ) { var inst = Buttons.instanceSelector( this._groupSelector, ctx[0]._buttons ); if ( inst.length ) { - inst[0].add( conf, idx ); + inst[0].add( conf, idx , draw); } } @@ -8647,7 +9054,7 @@ var __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_DEFINE_RESULT__;/*! Bootstrap 4 (function( factory ){ if ( true ) { // AMD - !(__WEBPACK_AMD_DEFINE_ARRAY__ = [__webpack_require__(/*! jquery */ "jquery"), __webpack_require__(/*! datatables.net-bs4 */ "./node_modules/datatables.net-select-bs4/node_modules/datatables.net-bs4/js/dataTables.bootstrap4.js"), __webpack_require__(/*! datatables.net-select */ "./node_modules/datatables.net-select/js/dataTables.select.js")], __WEBPACK_AMD_DEFINE_RESULT__ = (function ( $ ) { + !(__WEBPACK_AMD_DEFINE_ARRAY__ = [__webpack_require__(/*! jquery */ "jquery"), __webpack_require__(/*! datatables.net-bs4 */ "./node_modules/datatables.net-bs4/js/dataTables.bootstrap4.js"), __webpack_require__(/*! datatables.net-select */ "./node_modules/datatables.net-select/js/dataTables.select.js")], __WEBPACK_AMD_DEFINE_RESULT__ = (function ( $ ) { return factory( $, window, document ); }).apply(exports, __WEBPACK_AMD_DEFINE_ARRAY__), __WEBPACK_AMD_DEFINE_RESULT__ !== undefined && (module.exports = __WEBPACK_AMD_DEFINE_RESULT__)); @@ -8659,181 +9066,6 @@ return $.fn.dataTable; })); -/***/ }), - -/***/ "./node_modules/datatables.net-select-bs4/node_modules/datatables.net-bs4/js/dataTables.bootstrap4.js": -/*!************************************************************************************************************!*\ - !*** ./node_modules/datatables.net-select-bs4/node_modules/datatables.net-bs4/js/dataTables.bootstrap4.js ***! - \************************************************************************************************************/ -/***/ (function(module, exports, __webpack_require__) { - -var __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_DEFINE_RESULT__;/*! DataTables Bootstrap 4 integration - * ©2011-2017 SpryMedia Ltd - datatables.net/license - */ - -/** - * DataTables integration for Bootstrap 4. This requires Bootstrap 4 and - * DataTables 1.10 or newer. - * - * This file sets the defaults and adds options to DataTables to style its - * controls using Bootstrap. See http://datatables.net/manual/styling/bootstrap - * for further information. - */ -(function( factory ){ - if ( true ) { - // AMD - !(__WEBPACK_AMD_DEFINE_ARRAY__ = [__webpack_require__(/*! jquery */ "jquery"), __webpack_require__(/*! datatables.net */ "./node_modules/datatables.net/js/jquery.dataTables.js")], __WEBPACK_AMD_DEFINE_RESULT__ = (function ( $ ) { - return factory( $, window, document ); - }).apply(exports, __WEBPACK_AMD_DEFINE_ARRAY__), - __WEBPACK_AMD_DEFINE_RESULT__ !== undefined && (module.exports = __WEBPACK_AMD_DEFINE_RESULT__)); - } - else {} -}(function( $, window, document, undefined ) { -'use strict'; -var DataTable = $.fn.dataTable; - - -/* Set the defaults for DataTables initialisation */ -$.extend( true, DataTable.defaults, { - dom: - "<'row'<'col-sm-12 col-md-6'l><'col-sm-12 col-md-6'f>>" + - "<'row'<'col-sm-12'tr>>" + - "<'row'<'col-sm-12 col-md-5'i><'col-sm-12 col-md-7'p>>", - renderer: 'bootstrap' -} ); - - -/* Default class modification */ -$.extend( DataTable.ext.classes, { - sWrapper: "dataTables_wrapper dt-bootstrap4", - sFilterInput: "form-control form-control-sm", - sLengthSelect: "custom-select custom-select-sm form-control form-control-sm", - sProcessing: "dataTables_processing card", - sPageButton: "paginate_button page-item" -} ); - - -/* Bootstrap paging button renderer */ -DataTable.ext.renderer.pageButton.bootstrap = function ( settings, host, idx, buttons, page, pages ) { - var api = new DataTable.Api( settings ); - var classes = settings.oClasses; - var lang = settings.oLanguage.oPaginate; - var aria = settings.oLanguage.oAria.paginate || {}; - var btnDisplay, btnClass, counter=0; - - var attach = function( container, buttons ) { - var i, ien, node, button; - var clickHandler = function ( e ) { - e.preventDefault(); - if ( !$(e.currentTarget).hasClass('disabled') && api.page() != e.data.action ) { - api.page( e.data.action ).draw( 'page' ); - } - }; - - for ( i=0, ien=buttons.length ; i 0 ? - '' : ' disabled'); - break; - - case 'previous': - btnDisplay = lang.sPrevious; - btnClass = button + (page > 0 ? - '' : ' disabled'); - break; - - case 'next': - btnDisplay = lang.sNext; - btnClass = button + (page < pages-1 ? - '' : ' disabled'); - break; - - case 'last': - btnDisplay = lang.sLast; - btnClass = button + (page < pages-1 ? - '' : ' disabled'); - break; - - default: - btnDisplay = button + 1; - btnClass = page === button ? - 'active' : ''; - break; - } - - if ( btnDisplay ) { - node = $('
  • ', { - 'class': classes.sPageButton+' '+btnClass, - 'id': idx === 0 && typeof button === 'string' ? - settings.sTableId +'_'+ button : - null - } ) - .append( $('', { - 'href': '#', - 'aria-controls': settings.sTableId, - 'aria-label': aria[ button ], - 'data-dt-idx': counter, - 'tabindex': settings.iTabIndex, - 'class': 'page-link' - } ) - .html( btnDisplay ) - ) - .appendTo( container ); - - settings.oApi._fnBindAction( - node, {action: button}, clickHandler - ); - - counter++; - } - } - } - }; - - // IE9 throws an 'unknown error' if document.activeElement is used - // inside an iframe or frame. - var activeEl; - - try { - // Because this approach is destroying and recreating the paging - // elements, focus is lost on the select button which is bad for - // accessibility. So we want to restore focus once the draw has - // completed - activeEl = $(host).find(document.activeElement).data('dt-idx'); - } - catch (e) {} - - attach( - $(host).empty().html('