diff --git a/js/src/alert.js b/js/src/alert.js index afd7736c705a..ca57d72e845b 100644 --- a/js/src/alert.js +++ b/js/src/alert.js @@ -9,9 +9,7 @@ import $ from 'jquery' import Util from './util' /** - * ------------------------------------------------------------------------ * Constants - * ------------------------------------------------------------------------ */ const NAME = 'alert' @@ -21,20 +19,18 @@ const EVENT_KEY = `.${DATA_KEY}` const DATA_API_KEY = '.data-api' const JQUERY_NO_CONFLICT = $.fn[NAME] -const SELECTOR_DISMISS = '[data-dismiss="alert"]' +const CLASS_NAME_ALERT = 'alert' +const CLASS_NAME_FADE = 'fade' +const CLASS_NAME_SHOW = 'show' const EVENT_CLOSE = `close${EVENT_KEY}` const EVENT_CLOSED = `closed${EVENT_KEY}` const EVENT_CLICK_DATA_API = `click${EVENT_KEY}${DATA_API_KEY}` -const CLASS_NAME_ALERT = 'alert' -const CLASS_NAME_FADE = 'fade' -const CLASS_NAME_SHOW = 'show' +const SELECTOR_DISMISS = '[data-dismiss="alert"]' /** - * ------------------------------------------------------------------------ - * Class Definition - * ------------------------------------------------------------------------ + * Class definition */ class Alert { @@ -43,13 +39,11 @@ class Alert { } // Getters - static get VERSION() { return VERSION } // Public - close(element) { let rootElement = this._element if (element) { @@ -71,7 +65,6 @@ class Alert { } // Private - _getRootElement(element) { const selector = Util.getSelectorFromElement(element) let parent = false @@ -117,7 +110,6 @@ class Alert { } // Static - static _jQueryInterface(config) { return this.each(function () { const $element = $(this) @@ -146,9 +138,7 @@ class Alert { } /** - * ------------------------------------------------------------------------ - * Data Api implementation - * ------------------------------------------------------------------------ + * Data API implementation */ $(document).on( @@ -158,9 +148,7 @@ $(document).on( ) /** - * ------------------------------------------------------------------------ * jQuery - * ------------------------------------------------------------------------ */ $.fn[NAME] = Alert._jQueryInterface diff --git a/js/src/button.js b/js/src/button.js index 316387e8e472..872c643a7222 100644 --- a/js/src/button.js +++ b/js/src/button.js @@ -8,9 +8,7 @@ import $ from 'jquery' /** - * ------------------------------------------------------------------------ * Constants - * ------------------------------------------------------------------------ */ const NAME = 'button' @@ -24,6 +22,11 @@ const CLASS_NAME_ACTIVE = 'active' const CLASS_NAME_BUTTON = 'btn' const CLASS_NAME_FOCUS = 'focus' +const EVENT_CLICK_DATA_API = `click${EVENT_KEY}${DATA_API_KEY}` +const EVENT_FOCUS_BLUR_DATA_API = `focus${EVENT_KEY}${DATA_API_KEY} ` + + `blur${EVENT_KEY}${DATA_API_KEY}` +const EVENT_LOAD_DATA_API = `load${EVENT_KEY}${DATA_API_KEY}` + const SELECTOR_DATA_TOGGLE_CARROT = '[data-toggle^="button"]' const SELECTOR_DATA_TOGGLES = '[data-toggle="buttons"]' const SELECTOR_DATA_TOGGLE = '[data-toggle="button"]' @@ -32,15 +35,8 @@ const SELECTOR_INPUT = 'input:not([type="hidden"])' const SELECTOR_ACTIVE = '.active' const SELECTOR_BUTTON = '.btn' -const EVENT_CLICK_DATA_API = `click${EVENT_KEY}${DATA_API_KEY}` -const EVENT_FOCUS_BLUR_DATA_API = `focus${EVENT_KEY}${DATA_API_KEY} ` + - `blur${EVENT_KEY}${DATA_API_KEY}` -const EVENT_LOAD_DATA_API = `load${EVENT_KEY}${DATA_API_KEY}` - /** - * ------------------------------------------------------------------------ - * Class Definition - * ------------------------------------------------------------------------ + * Class definition */ class Button { @@ -50,13 +46,11 @@ class Button { } // Getters - static get VERSION() { return VERSION } // Public - toggle() { let triggerChangeEvent = true let addAriaPressed = true @@ -111,7 +105,6 @@ class Button { } // Static - static _jQueryInterface(config, avoidTriggerChange) { return this.each(function () { const $element = $(this) @@ -132,9 +125,7 @@ class Button { } /** - * ------------------------------------------------------------------------ - * Data Api implementation - * ------------------------------------------------------------------------ + * Data API implementation */ $(document) @@ -194,9 +185,7 @@ $(window).on(EVENT_LOAD_DATA_API, () => { }) /** - * ------------------------------------------------------------------------ * jQuery - * ------------------------------------------------------------------------ */ $.fn[NAME] = Button._jQueryInterface diff --git a/js/src/carousel.js b/js/src/carousel.js index 08a4df742af7..4f1eeb9042c3 100644 --- a/js/src/carousel.js +++ b/js/src/carousel.js @@ -9,9 +9,7 @@ import $ from 'jquery' import Util from './util' /** - * ------------------------------------------------------------------------ * Constants - * ------------------------------------------------------------------------ */ const NAME = 'carousel' @@ -25,23 +23,14 @@ const ARROW_RIGHT_KEYCODE = 39 // KeyboardEvent.which value for right arrow key const TOUCHEVENT_COMPAT_WAIT = 500 // Time for mouse compat events to fire after touch const SWIPE_THRESHOLD = 40 -const Default = { - interval: 5000, - keyboard: true, - slide: false, - pause: 'hover', - wrap: true, - touch: true -} - -const DefaultType = { - interval: '(number|boolean)', - keyboard: 'boolean', - slide: '(boolean|string)', - pause: '(string|boolean)', - wrap: 'boolean', - touch: 'boolean' -} +const CLASS_NAME_CAROUSEL = 'carousel' +const CLASS_NAME_ACTIVE = 'active' +const CLASS_NAME_SLIDE = 'slide' +const CLASS_NAME_RIGHT = 'carousel-item-right' +const CLASS_NAME_LEFT = 'carousel-item-left' +const CLASS_NAME_NEXT = 'carousel-item-next' +const CLASS_NAME_PREV = 'carousel-item-prev' +const CLASS_NAME_POINTER_EVENT = 'pointer-event' const DIRECTION_NEXT = 'next' const DIRECTION_PREV = 'prev' @@ -62,15 +51,6 @@ const EVENT_DRAG_START = `dragstart${EVENT_KEY}` const EVENT_LOAD_DATA_API = `load${EVENT_KEY}${DATA_API_KEY}` const EVENT_CLICK_DATA_API = `click${EVENT_KEY}${DATA_API_KEY}` -const CLASS_NAME_CAROUSEL = 'carousel' -const CLASS_NAME_ACTIVE = 'active' -const CLASS_NAME_SLIDE = 'slide' -const CLASS_NAME_RIGHT = 'carousel-item-right' -const CLASS_NAME_LEFT = 'carousel-item-left' -const CLASS_NAME_NEXT = 'carousel-item-next' -const CLASS_NAME_PREV = 'carousel-item-prev' -const CLASS_NAME_POINTER_EVENT = 'pointer-event' - const SELECTOR_ACTIVE = '.active' const SELECTOR_ACTIVE_ITEM = '.active.carousel-item' const SELECTOR_ITEM = '.carousel-item' @@ -80,16 +60,33 @@ const SELECTOR_INDICATORS = '.carousel-indicators' const SELECTOR_DATA_SLIDE = '[data-slide], [data-slide-to]' const SELECTOR_DATA_RIDE = '[data-ride="carousel"]' +const Default = { + interval: 5000, + keyboard: true, + slide: false, + pause: 'hover', + wrap: true, + touch: true +} + +const DefaultType = { + interval: '(number|boolean)', + keyboard: 'boolean', + slide: '(boolean|string)', + pause: '(string|boolean)', + wrap: 'boolean', + touch: 'boolean' +} + const PointerType = { TOUCH: 'touch', PEN: 'pen' } /** - * ------------------------------------------------------------------------ - * Class Definition - * ------------------------------------------------------------------------ + * Class definition */ + class Carousel { constructor(element, config) { this._items = null @@ -111,7 +108,6 @@ class Carousel { } // Getters - static get VERSION() { return VERSION } @@ -121,7 +117,6 @@ class Carousel { } // Public - next() { if (!this._isSliding) { this._slide(DIRECTION_NEXT) @@ -220,7 +215,6 @@ class Carousel { } // Private - _getConfig(config) { config = { ...Default, @@ -508,7 +502,6 @@ class Carousel { } // Static - static _jQueryInterface(config) { return this.each(function () { let data = $(this).data(DATA_KEY) @@ -580,9 +573,7 @@ class Carousel { } /** - * ------------------------------------------------------------------------ - * Data Api implementation - * ------------------------------------------------------------------------ + * Data API implementation */ $(document).on(EVENT_CLICK_DATA_API, SELECTOR_DATA_SLIDE, Carousel._dataApiClickHandler) @@ -596,9 +587,7 @@ $(window).on(EVENT_LOAD_DATA_API, () => { }) /** - * ------------------------------------------------------------------------ * jQuery - * ------------------------------------------------------------------------ */ $.fn[NAME] = Carousel._jQueryInterface diff --git a/js/src/collapse.js b/js/src/collapse.js index af3163be92a3..d7afa3c60853 100644 --- a/js/src/collapse.js +++ b/js/src/collapse.js @@ -9,9 +9,7 @@ import $ from 'jquery' import Util from './util' /** - * ------------------------------------------------------------------------ * Constants - * ------------------------------------------------------------------------ */ const NAME = 'collapse' @@ -21,22 +19,6 @@ const EVENT_KEY = `.${DATA_KEY}` const DATA_API_KEY = '.data-api' const JQUERY_NO_CONFLICT = $.fn[NAME] -const Default = { - toggle: true, - parent: '' -} - -const DefaultType = { - toggle: 'boolean', - parent: '(string|element)' -} - -const EVENT_SHOW = `show${EVENT_KEY}` -const EVENT_SHOWN = `shown${EVENT_KEY}` -const EVENT_HIDE = `hide${EVENT_KEY}` -const EVENT_HIDDEN = `hidden${EVENT_KEY}` -const EVENT_CLICK_DATA_API = `click${EVENT_KEY}${DATA_API_KEY}` - const CLASS_NAME_SHOW = 'show' const CLASS_NAME_COLLAPSE = 'collapse' const CLASS_NAME_COLLAPSING = 'collapsing' @@ -45,13 +27,27 @@ const CLASS_NAME_COLLAPSED = 'collapsed' const DIMENSION_WIDTH = 'width' const DIMENSION_HEIGHT = 'height' +const EVENT_SHOW = `show${EVENT_KEY}` +const EVENT_SHOWN = `shown${EVENT_KEY}` +const EVENT_HIDE = `hide${EVENT_KEY}` +const EVENT_HIDDEN = `hidden${EVENT_KEY}` +const EVENT_CLICK_DATA_API = `click${EVENT_KEY}${DATA_API_KEY}` + const SELECTOR_ACTIVES = '.show, .collapsing' const SELECTOR_DATA_TOGGLE = '[data-toggle="collapse"]' +const Default = { + toggle: true, + parent: '' +} + +const DefaultType = { + toggle: 'boolean', + parent: '(string|element)' +} + /** - * ------------------------------------------------------------------------ - * Class Definition - * ------------------------------------------------------------------------ + * Class definition */ class Collapse { @@ -89,7 +85,6 @@ class Collapse { } // Getters - static get VERSION() { return VERSION } @@ -99,7 +94,6 @@ class Collapse { } // Public - toggle() { if ($(this._element).hasClass(CLASS_NAME_SHOW)) { this.hide() @@ -262,7 +256,6 @@ class Collapse { } // Private - _getConfig(config) { config = { ...Default, @@ -316,7 +309,6 @@ class Collapse { } // Static - static _getTargetFromElement(element) { const selector = Util.getSelectorFromElement(element) return selector ? document.querySelector(selector) : null @@ -353,9 +345,7 @@ class Collapse { } /** - * ------------------------------------------------------------------------ - * Data Api implementation - * ------------------------------------------------------------------------ + * Data API implementation */ $(document).on(EVENT_CLICK_DATA_API, SELECTOR_DATA_TOGGLE, function (event) { @@ -377,9 +367,7 @@ $(document).on(EVENT_CLICK_DATA_API, SELECTOR_DATA_TOGGLE, function (event) { }) /** - * ------------------------------------------------------------------------ * jQuery - * ------------------------------------------------------------------------ */ $.fn[NAME] = Collapse._jQueryInterface diff --git a/js/src/dropdown.js b/js/src/dropdown.js index 0db7d50361f6..f2c1da0dbd6a 100644 --- a/js/src/dropdown.js +++ b/js/src/dropdown.js @@ -10,9 +10,7 @@ import Popper from 'popper.js' import Util from './util' /** - * ------------------------------------------------------------------------ * Constants - * ------------------------------------------------------------------------ */ const NAME = 'dropdown' @@ -29,6 +27,14 @@ const ARROW_DOWN_KEYCODE = 40 // KeyboardEvent.which value for down arrow key const RIGHT_MOUSE_BUTTON_WHICH = 3 // MouseEvent.which value for the right button (assuming a right-handed mouse) const REGEXP_KEYDOWN = new RegExp(`${ARROW_UP_KEYCODE}|${ARROW_DOWN_KEYCODE}|${ESCAPE_KEYCODE}`) +const CLASS_NAME_DISABLED = 'disabled' +const CLASS_NAME_SHOW = 'show' +const CLASS_NAME_DROPUP = 'dropup' +const CLASS_NAME_DROPRIGHT = 'dropright' +const CLASS_NAME_DROPLEFT = 'dropleft' +const CLASS_NAME_MENURIGHT = 'dropdown-menu-right' +const CLASS_NAME_POSITION_STATIC = 'position-static' + const EVENT_HIDE = `hide${EVENT_KEY}` const EVENT_HIDDEN = `hidden${EVENT_KEY}` const EVENT_SHOW = `show${EVENT_KEY}` @@ -38,14 +44,6 @@ const EVENT_CLICK_DATA_API = `click${EVENT_KEY}${DATA_API_KEY}` const EVENT_KEYDOWN_DATA_API = `keydown${EVENT_KEY}${DATA_API_KEY}` const EVENT_KEYUP_DATA_API = `keyup${EVENT_KEY}${DATA_API_KEY}` -const CLASS_NAME_DISABLED = 'disabled' -const CLASS_NAME_SHOW = 'show' -const CLASS_NAME_DROPUP = 'dropup' -const CLASS_NAME_DROPRIGHT = 'dropright' -const CLASS_NAME_DROPLEFT = 'dropleft' -const CLASS_NAME_MENURIGHT = 'dropdown-menu-right' -const CLASS_NAME_POSITION_STATIC = 'position-static' - const SELECTOR_DATA_TOGGLE = '[data-toggle="dropdown"]' const SELECTOR_FORM_CHILD = '.dropdown form' const SELECTOR_MENU = '.dropdown-menu' @@ -78,9 +76,7 @@ const DefaultType = { } /** - * ------------------------------------------------------------------------ - * Class Definition - * ------------------------------------------------------------------------ + * Class definition */ class Dropdown { @@ -95,7 +91,6 @@ class Dropdown { } // Getters - static get VERSION() { return VERSION } @@ -109,7 +104,6 @@ class Dropdown { } // Public - toggle() { if (this._element.disabled || $(this._element).hasClass(CLASS_NAME_DISABLED)) { return @@ -145,10 +139,7 @@ class Dropdown { // Totally disable Popper for Dropdowns in Navbar if (!this._inNavbar && usePopper) { - /** - * Check for Popper dependency - * Popper - https://popper.js.org - */ + // Check for Popper dependency if (typeof Popper === 'undefined') { throw new TypeError('Bootstrap\'s dropdowns require Popper (https://popper.js.org)') } @@ -240,7 +231,6 @@ class Dropdown { } // Private - _addEventListeners() { $(this._element).on(EVENT_CLICK, event => { event.preventDefault() @@ -348,7 +338,6 @@ class Dropdown { } // Static - static _jQueryInterface(config) { return this.each(function () { let data = $(this).data(DATA_KEY) @@ -504,9 +493,7 @@ class Dropdown { } /** - * ------------------------------------------------------------------------ - * Data Api implementation - * ------------------------------------------------------------------------ + * Data API implementation */ $(document) @@ -523,9 +510,7 @@ $(document) }) /** - * ------------------------------------------------------------------------ * jQuery - * ------------------------------------------------------------------------ */ $.fn[NAME] = Dropdown._jQueryInterface diff --git a/js/src/modal.js b/js/src/modal.js index a23bfc1ba6d0..efe9e19d1d20 100644 --- a/js/src/modal.js +++ b/js/src/modal.js @@ -9,9 +9,7 @@ import $ from 'jquery' import Util from './util' /** - * ------------------------------------------------------------------------ * Constants - * ------------------------------------------------------------------------ */ const NAME = 'modal' @@ -22,19 +20,13 @@ const DATA_API_KEY = '.data-api' const JQUERY_NO_CONFLICT = $.fn[NAME] const ESCAPE_KEYCODE = 27 // KeyboardEvent.which value for Escape (Esc) key -const Default = { - backdrop: true, - keyboard: true, - focus: true, - show: true -} - -const DefaultType = { - backdrop: '(boolean|string)', - keyboard: 'boolean', - focus: 'boolean', - show: 'boolean' -} +const CLASS_NAME_SCROLLABLE = 'modal-dialog-scrollable' +const CLASS_NAME_SCROLLBAR_MEASURER = 'modal-scrollbar-measure' +const CLASS_NAME_BACKDROP = 'modal-backdrop' +const CLASS_NAME_OPEN = 'modal-open' +const CLASS_NAME_FADE = 'fade' +const CLASS_NAME_SHOW = 'show' +const CLASS_NAME_STATIC = 'modal-static' const EVENT_HIDE = `hide${EVENT_KEY}` const EVENT_HIDE_PREVENTED = `hidePrevented${EVENT_KEY}` @@ -49,14 +41,6 @@ const EVENT_MOUSEUP_DISMISS = `mouseup.dismiss${EVENT_KEY}` const EVENT_MOUSEDOWN_DISMISS = `mousedown.dismiss${EVENT_KEY}` const EVENT_CLICK_DATA_API = `click${EVENT_KEY}${DATA_API_KEY}` -const CLASS_NAME_SCROLLABLE = 'modal-dialog-scrollable' -const CLASS_NAME_SCROLLBAR_MEASURER = 'modal-scrollbar-measure' -const CLASS_NAME_BACKDROP = 'modal-backdrop' -const CLASS_NAME_OPEN = 'modal-open' -const CLASS_NAME_FADE = 'fade' -const CLASS_NAME_SHOW = 'show' -const CLASS_NAME_STATIC = 'modal-static' - const SELECTOR_DIALOG = '.modal-dialog' const SELECTOR_MODAL_BODY = '.modal-body' const SELECTOR_DATA_TOGGLE = '[data-toggle="modal"]' @@ -64,10 +48,22 @@ const SELECTOR_DATA_DISMISS = '[data-dismiss="modal"]' const SELECTOR_FIXED_CONTENT = '.fixed-top, .fixed-bottom, .is-fixed, .sticky-top' const SELECTOR_STICKY_CONTENT = '.sticky-top' +const Default = { + backdrop: true, + keyboard: true, + focus: true, + show: true +} + +const DefaultType = { + backdrop: '(boolean|string)', + keyboard: 'boolean', + focus: 'boolean', + show: 'boolean' +} + /** - * ------------------------------------------------------------------------ - * Class Definition - * ------------------------------------------------------------------------ + * Class definition */ class Modal { @@ -84,7 +80,6 @@ class Modal { } // Getters - static get VERSION() { return VERSION } @@ -94,7 +89,6 @@ class Modal { } // Public - toggle(relatedTarget) { return this._isShown ? this.hide() : this.show(relatedTarget) } @@ -219,7 +213,6 @@ class Modal { } // Private - _getConfig(config) { config = { ...Default, @@ -545,7 +538,6 @@ class Modal { } // Static - static _jQueryInterface(config, relatedTarget) { return this.each(function () { let data = $(this).data(DATA_KEY) @@ -574,9 +566,7 @@ class Modal { } /** - * ------------------------------------------------------------------------ - * Data Api implementation - * ------------------------------------------------------------------------ + * Data API implementation */ $(document).on(EVENT_CLICK_DATA_API, SELECTOR_DATA_TOGGLE, function (event) { @@ -614,9 +604,7 @@ $(document).on(EVENT_CLICK_DATA_API, SELECTOR_DATA_TOGGLE, function (event) { }) /** - * ------------------------------------------------------------------------ * jQuery - * ------------------------------------------------------------------------ */ $.fn[NAME] = Modal._jQueryInterface diff --git a/js/src/popover.js b/js/src/popover.js index 4e2c260b9065..19046b976567 100644 --- a/js/src/popover.js +++ b/js/src/popover.js @@ -9,9 +9,7 @@ import $ from 'jquery' import Tooltip from './tooltip' /** - * ------------------------------------------------------------------------ * Constants - * ------------------------------------------------------------------------ */ const NAME = 'popover' @@ -22,6 +20,12 @@ const JQUERY_NO_CONFLICT = $.fn[NAME] const CLASS_PREFIX = 'bs-popover' const BSCLS_PREFIX_REGEX = new RegExp(`(^|\\s)${CLASS_PREFIX}\\S+`, 'g') +const CLASS_NAME_FADE = 'fade' +const CLASS_NAME_SHOW = 'show' + +const SELECTOR_TITLE = '.popover-header' +const SELECTOR_CONTENT = '.popover-body' + const Default = { ...Tooltip.Default, placement: 'right', @@ -38,12 +42,6 @@ const DefaultType = { content: '(string|element|function)' } -const CLASS_NAME_FADE = 'fade' -const CLASS_NAME_SHOW = 'show' - -const SELECTOR_TITLE = '.popover-header' -const SELECTOR_CONTENT = '.popover-body' - const Event = { HIDE: `hide${EVENT_KEY}`, HIDDEN: `hidden${EVENT_KEY}`, @@ -58,14 +56,11 @@ const Event = { } /** - * ------------------------------------------------------------------------ - * Class Definition - * ------------------------------------------------------------------------ + * Class definition */ class Popover extends Tooltip { // Getters - static get VERSION() { return VERSION } @@ -95,7 +90,6 @@ class Popover extends Tooltip { } // Overrides - isWithContent() { return this.getTitle() || this._getContent() } @@ -125,7 +119,6 @@ class Popover extends Tooltip { } // Private - _getContent() { return this.element.getAttribute('data-content') || this.config.content @@ -140,7 +133,6 @@ class Popover extends Tooltip { } // Static - static _jQueryInterface(config) { return this.each(function () { let data = $(this).data(DATA_KEY) @@ -167,9 +159,7 @@ class Popover extends Tooltip { } /** - * ------------------------------------------------------------------------ * jQuery - * ------------------------------------------------------------------------ */ $.fn[NAME] = Popover._jQueryInterface diff --git a/js/src/scrollspy.js b/js/src/scrollspy.js index 351df0649d14..d240e3a1c2ec 100644 --- a/js/src/scrollspy.js +++ b/js/src/scrollspy.js @@ -9,9 +9,7 @@ import $ from 'jquery' import Util from './util' /** - * ------------------------------------------------------------------------ * Constants - * ------------------------------------------------------------------------ */ const NAME = 'scrollspy' @@ -21,24 +19,15 @@ const EVENT_KEY = `.${DATA_KEY}` const DATA_API_KEY = '.data-api' const JQUERY_NO_CONFLICT = $.fn[NAME] -const Default = { - offset: 10, - method: 'auto', - target: '' -} - -const DefaultType = { - offset: 'number', - method: 'string', - target: '(string|element)' -} +const CLASS_NAME_DROPDOWN_ITEM = 'dropdown-item' +const CLASS_NAME_ACTIVE = 'active' const EVENT_ACTIVATE = `activate${EVENT_KEY}` const EVENT_SCROLL = `scroll${EVENT_KEY}` const EVENT_LOAD_DATA_API = `load${EVENT_KEY}${DATA_API_KEY}` -const CLASS_NAME_DROPDOWN_ITEM = 'dropdown-item' -const CLASS_NAME_ACTIVE = 'active' +const METHOD_OFFSET = 'offset' +const METHOD_POSITION = 'position' const SELECTOR_DATA_SPY = '[data-spy="scroll"]' const SELECTOR_NAV_LIST_GROUP = '.nav, .list-group' @@ -49,13 +38,20 @@ const SELECTOR_DROPDOWN = '.dropdown' const SELECTOR_DROPDOWN_ITEMS = '.dropdown-item' const SELECTOR_DROPDOWN_TOGGLE = '.dropdown-toggle' -const METHOD_OFFSET = 'offset' -const METHOD_POSITION = 'position' +const Default = { + offset: 10, + method: 'auto', + target: '' +} + +const DefaultType = { + offset: 'number', + method: 'string', + target: '(string|element)' +} /** - * ------------------------------------------------------------------------ - * Class Definition - * ------------------------------------------------------------------------ + * Class definition */ class ScrollSpy { @@ -78,7 +74,6 @@ class ScrollSpy { } // Getters - static get VERSION() { return VERSION } @@ -88,7 +83,6 @@ class ScrollSpy { } // Public - refresh() { const autoMethod = this._scrollElement === this._scrollElement.window ? METHOD_OFFSET : METHOD_POSITION @@ -151,7 +145,6 @@ class ScrollSpy { } // Private - _getConfig(config) { config = { ...Default, @@ -270,7 +263,6 @@ class ScrollSpy { } // Static - static _jQueryInterface(config) { return this.each(function () { let data = $(this).data(DATA_KEY) @@ -293,9 +285,7 @@ class ScrollSpy { } /** - * ------------------------------------------------------------------------ - * Data Api implementation - * ------------------------------------------------------------------------ + * Data API implementation */ $(window).on(EVENT_LOAD_DATA_API, () => { @@ -309,9 +299,7 @@ $(window).on(EVENT_LOAD_DATA_API, () => { }) /** - * ------------------------------------------------------------------------ * jQuery - * ------------------------------------------------------------------------ */ $.fn[NAME] = ScrollSpy._jQueryInterface diff --git a/js/src/tab.js b/js/src/tab.js index bcbb5c5ea258..9d34e521c563 100644 --- a/js/src/tab.js +++ b/js/src/tab.js @@ -9,9 +9,7 @@ import $ from 'jquery' import Util from './util' /** - * ------------------------------------------------------------------------ * Constants - * ------------------------------------------------------------------------ */ const NAME = 'tab' @@ -21,18 +19,18 @@ const EVENT_KEY = `.${DATA_KEY}` const DATA_API_KEY = '.data-api' const JQUERY_NO_CONFLICT = $.fn[NAME] -const EVENT_HIDE = `hide${EVENT_KEY}` -const EVENT_HIDDEN = `hidden${EVENT_KEY}` -const EVENT_SHOW = `show${EVENT_KEY}` -const EVENT_SHOWN = `shown${EVENT_KEY}` -const EVENT_CLICK_DATA_API = `click${EVENT_KEY}${DATA_API_KEY}` - const CLASS_NAME_DROPDOWN_MENU = 'dropdown-menu' const CLASS_NAME_ACTIVE = 'active' const CLASS_NAME_DISABLED = 'disabled' const CLASS_NAME_FADE = 'fade' const CLASS_NAME_SHOW = 'show' +const EVENT_HIDE = `hide${EVENT_KEY}` +const EVENT_HIDDEN = `hidden${EVENT_KEY}` +const EVENT_SHOW = `show${EVENT_KEY}` +const EVENT_SHOWN = `shown${EVENT_KEY}` +const EVENT_CLICK_DATA_API = `click${EVENT_KEY}${DATA_API_KEY}` + const SELECTOR_DROPDOWN = '.dropdown' const SELECTOR_NAV_LIST_GROUP = '.nav, .list-group' const SELECTOR_ACTIVE = '.active' @@ -42,9 +40,7 @@ const SELECTOR_DROPDOWN_TOGGLE = '.dropdown-toggle' const SELECTOR_DROPDOWN_ACTIVE_CHILD = '> .dropdown-menu .active' /** - * ------------------------------------------------------------------------ - * Class Definition - * ------------------------------------------------------------------------ + * Class definition */ class Tab { @@ -53,13 +49,11 @@ class Tab { } // Getters - static get VERSION() { return VERSION } // Public - show() { if (this._element.parentNode && this._element.parentNode.nodeType === Node.ELEMENT_NODE && @@ -133,7 +127,6 @@ class Tab { } // Private - _activate(element, container, callback) { const activeElements = container && (container.nodeName === 'UL' || container.nodeName === 'OL') ? $(container).find(SELECTOR_ACTIVE_UL) : @@ -210,7 +203,6 @@ class Tab { } // Static - static _jQueryInterface(config) { return this.each(function () { const $this = $(this) @@ -233,9 +225,7 @@ class Tab { } /** - * ------------------------------------------------------------------------ - * Data Api implementation - * ------------------------------------------------------------------------ + * Data API implementation */ $(document) @@ -245,9 +235,7 @@ $(document) }) /** - * ------------------------------------------------------------------------ * jQuery - * ------------------------------------------------------------------------ */ $.fn[NAME] = Tab._jQueryInterface diff --git a/js/src/toast.js b/js/src/toast.js index 0c21869080a8..a47f53794476 100644 --- a/js/src/toast.js +++ b/js/src/toast.js @@ -9,9 +9,7 @@ import $ from 'jquery' import Util from './util' /** - * ------------------------------------------------------------------------ * Constants - * ------------------------------------------------------------------------ */ const NAME = 'toast' @@ -20,22 +18,18 @@ const DATA_KEY = 'bs.toast' const EVENT_KEY = `.${DATA_KEY}` const JQUERY_NO_CONFLICT = $.fn[NAME] +const CLASS_NAME_FADE = 'fade' +const CLASS_NAME_HIDE = 'hide' +const CLASS_NAME_SHOW = 'show' +const CLASS_NAME_SHOWING = 'showing' + const EVENT_CLICK_DISMISS = `click.dismiss${EVENT_KEY}` const EVENT_HIDE = `hide${EVENT_KEY}` const EVENT_HIDDEN = `hidden${EVENT_KEY}` const EVENT_SHOW = `show${EVENT_KEY}` const EVENT_SHOWN = `shown${EVENT_KEY}` -const CLASS_NAME_FADE = 'fade' -const CLASS_NAME_HIDE = 'hide' -const CLASS_NAME_SHOW = 'show' -const CLASS_NAME_SHOWING = 'showing' - -const DefaultType = { - animation: 'boolean', - autohide: 'boolean', - delay: 'number' -} +const SELECTOR_DATA_DISMISS = '[data-dismiss="toast"]' const Default = { animation: true, @@ -43,12 +37,14 @@ const Default = { delay: 500 } -const SELECTOR_DATA_DISMISS = '[data-dismiss="toast"]' +const DefaultType = { + animation: 'boolean', + autohide: 'boolean', + delay: 'number' +} /** - * ------------------------------------------------------------------------ - * Class Definition - * ------------------------------------------------------------------------ + * Class definition */ class Toast { @@ -60,7 +56,6 @@ class Toast { } // Getters - static get VERSION() { return VERSION } @@ -74,7 +69,6 @@ class Toast { } // Public - show() { const showEvent = $.Event(EVENT_SHOW) @@ -146,7 +140,6 @@ class Toast { } // Private - _getConfig(config) { config = { ...Default, @@ -191,7 +184,6 @@ class Toast { } // Static - static _jQueryInterface(config) { return this.each(function () { const $element = $(this) @@ -215,9 +207,7 @@ class Toast { } /** - * ------------------------------------------------------------------------ * jQuery - * ------------------------------------------------------------------------ */ $.fn[NAME] = Toast._jQueryInterface diff --git a/js/src/tooltip.js b/js/src/tooltip.js index 1923d0da6c6f..00529809d242 100644 --- a/js/src/tooltip.js +++ b/js/src/tooltip.js @@ -5,18 +5,13 @@ * -------------------------------------------------------------------------- */ -import { - DefaultWhitelist, - sanitizeHtml -} from './tools/sanitizer' +import { DefaultWhitelist, sanitizeHtml } from './tools/sanitizer' import $ from 'jquery' import Popper from 'popper.js' import Util from './util' /** - * ------------------------------------------------------------------------ * Constants - * ------------------------------------------------------------------------ */ const NAME = 'tooltip' @@ -28,25 +23,19 @@ const CLASS_PREFIX = 'bs-tooltip' const BSCLS_PREFIX_REGEX = new RegExp(`(^|\\s)${CLASS_PREFIX}\\S+`, 'g') const DISALLOWED_ATTRIBUTES = ['sanitize', 'whiteList', 'sanitizeFn'] -const DefaultType = { - animation: 'boolean', - template: 'string', - title: '(string|element|function)', - trigger: 'string', - delay: '(number|object)', - html: 'boolean', - selector: '(string|boolean)', - placement: '(string|function)', - offset: '(number|string|function)', - container: '(string|element|boolean)', - fallbackPlacement: '(string|array)', - boundary: '(string|element)', - customClass: '(string|function)', - sanitize: 'boolean', - sanitizeFn: '(null|function)', - whiteList: 'object', - popperConfig: '(null|object)' -} +const CLASS_NAME_FADE = 'fade' +const CLASS_NAME_SHOW = 'show' + +const HOVER_STATE_SHOW = 'show' +const HOVER_STATE_OUT = 'out' + +const SELECTOR_TOOLTIP_INNER = '.tooltip-inner' +const SELECTOR_ARROW = '.arrow' + +const TRIGGER_HOVER = 'hover' +const TRIGGER_FOCUS = 'focus' +const TRIGGER_CLICK = 'click' +const TRIGGER_MANUAL = 'manual' const AttachmentMap = { AUTO: 'auto', @@ -78,8 +67,25 @@ const Default = { popperConfig: null } -const HOVER_STATE_SHOW = 'show' -const HOVER_STATE_OUT = 'out' +const DefaultType = { + animation: 'boolean', + template: 'string', + title: '(string|element|function)', + trigger: 'string', + delay: '(number|object)', + html: 'boolean', + selector: '(string|boolean)', + placement: '(string|function)', + offset: '(number|string|function)', + container: '(string|element|boolean)', + fallbackPlacement: '(string|array)', + boundary: '(string|element)', + customClass: '(string|function)', + sanitize: 'boolean', + sanitizeFn: '(null|function)', + whiteList: 'object', + popperConfig: '(null|object)' +} const Event = { HIDE: `hide${EVENT_KEY}`, @@ -94,21 +100,8 @@ const Event = { MOUSELEAVE: `mouseleave${EVENT_KEY}` } -const CLASS_NAME_FADE = 'fade' -const CLASS_NAME_SHOW = 'show' - -const SELECTOR_TOOLTIP_INNER = '.tooltip-inner' -const SELECTOR_ARROW = '.arrow' - -const TRIGGER_HOVER = 'hover' -const TRIGGER_FOCUS = 'focus' -const TRIGGER_CLICK = 'click' -const TRIGGER_MANUAL = 'manual' - /** - * ------------------------------------------------------------------------ - * Class Definition - * ------------------------------------------------------------------------ + * Class definition */ class Tooltip { @@ -117,7 +110,7 @@ class Tooltip { throw new TypeError('Bootstrap\'s tooltips require Popper (https://popper.js.org)') } - // private + // Private this._isEnabled = true this._timeout = 0 this._hoverState = '' @@ -133,7 +126,6 @@ class Tooltip { } // Getters - static get VERSION() { return VERSION } @@ -163,7 +155,6 @@ class Tooltip { } // Public - enable() { this._isEnabled = true } @@ -381,7 +372,6 @@ class Tooltip { } // Protected - isWithContent() { return Boolean(this.getTitle()) } @@ -439,7 +429,6 @@ class Tooltip { } // Private - _getPopperConfig(attachment) { const defaultBsConfig = { placement: attachment, @@ -735,7 +724,6 @@ class Tooltip { } // Static - static _jQueryInterface(config) { return this.each(function () { const $element = $(this) @@ -763,9 +751,7 @@ class Tooltip { } /** - * ------------------------------------------------------------------------ * jQuery - * ------------------------------------------------------------------------ */ $.fn[NAME] = Tooltip._jQueryInterface diff --git a/js/src/util.js b/js/src/util.js index cd9d5e3b8c51..55bde494becb 100644 --- a/js/src/util.js +++ b/js/src/util.js @@ -8,9 +8,7 @@ import $ from 'jquery' /** - * ------------------------------------------------------------------------ * Private TransitionEnd Helpers - * ------------------------------------------------------------------------ */ const TRANSITION_END = 'transitionend' @@ -62,9 +60,7 @@ function setTransitionEndSupport() { } /** - * -------------------------------------------------------------------------- - * Public Util Api - * -------------------------------------------------------------------------- + * Public Util API */ const Util = {