Skip to content

Switch to strings constants. #30358

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
XhmikosR merged 2 commits into from
Mar 18, 2020
Merged

Switch to strings constants. #30358

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
b8b8d8d
Switch to strings constants.
XhmikosR Mar 7, 2020
c3b36d3
Tighten bundlesize JS limits.
XhmikosR Mar 7, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions bundlesize.config.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -38,7 +38,7 @@
},
{
"path": "./dist/js/bootstrap.bundle.min.js",
"maxSize": "24 kB"
"maxSize": "23 kB"
},
{
"path": "./dist/js/bootstrap.esm.js",
Expand All @@ -54,7 +54,7 @@
},
{
"path": "./dist/js/bootstrap.min.js",
"maxSize": "17.5 kB"
"maxSize": "16.5 kB"
}
]
}
32 changes: 13 additions & 19 deletions js/src/alert.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -28,21 +28,15 @@ const DATA_KEY = 'bs.alert'
const EVENT_KEY = `.${DATA_KEY}`
const DATA_API_KEY = '.data-api'

const Selector = {
DISMISS: '[data-dismiss="alert"]'
}
const SELECTOR_DISMISS = '[data-dismiss="alert"]'

const Event = {
CLOSE: `close${EVENT_KEY}`,
CLOSED: `closed${EVENT_KEY}`,
CLICK_DATA_API: `click${EVENT_KEY}${DATA_API_KEY}`
}
const EVENT_CLOSE = `close${EVENT_KEY}`
const EVENT_CLOSED = `closed${EVENT_KEY}`
const EVENT_CLICK_DATA_API = `click${EVENT_KEY}${DATA_API_KEY}`

const ClassName = {
ALERT: 'alert',
FADE: 'fade',
SHOW: 'show'
}
const CLASSNAME_ALERT = 'alert'
const CLASSNAME_FADE = 'fade'
const CLASSNAME_SHOW = 'show'

/**
* ------------------------------------------------------------------------
Expand Down Expand Up @@ -93,20 +87,20 @@ class Alert {
let parent = getElementFromSelector(element)

if (!parent) {
parent = SelectorEngine.closest(element, `.${ClassName.ALERT}`)
parent = SelectorEngine.closest(element, `.${CLASSNAME_ALERT}`)
}

return parent
}

_triggerCloseEvent(element) {
return EventHandler.trigger(element, Event.CLOSE)
return EventHandler.trigger(element, EVENT_CLOSE)
}

_removeElement(element) {
element.classList.remove(ClassName.SHOW)
element.classList.remove(CLASSNAME_SHOW)

if (!element.classList.contains(ClassName.FADE)) {
if (!element.classList.contains(CLASSNAME_FADE)) {
this._destroyElement(element)
return
}
Expand All @@ -123,7 +117,7 @@ class Alert {
element.parentNode.removeChild(element)
}

EventHandler.trigger(element, Event.CLOSED)
EventHandler.trigger(element, EVENT_CLOSED)
}

// Static
Expand Down Expand Up @@ -163,7 +157,7 @@ class Alert {
* ------------------------------------------------------------------------
*/
EventHandler
.on(document, Event.CLICK_DATA_API, Selector.DISMISS, Alert.handleDismiss(new Alert()))
.on(document, EVENT_CLICK_DATA_API, SELECTOR_DISMISS, Alert.handleDismiss(new Alert()))

const $ = getjQuery()

Expand Down
68 changes: 31 additions & 37 deletions js/src/button.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22,26 +22,20 @@ const DATA_KEY = 'bs.button'
const EVENT_KEY = `.${DATA_KEY}`
const DATA_API_KEY = '.data-api'

const ClassName = {
ACTIVE: 'active',
BUTTON: 'btn',
DISABLED: 'disabled',
FOCUS: 'focus'
}
const CLASS_NAME_ACTIVE = 'active'
const CLASS_NAME_BUTTON = 'btn'
const CLASS_NAME_DISABLED = 'disabled'
const CLASS_NAME_FOCUS = 'focus'

const Selector = {
DATA_TOGGLE_CARROT: '[data-toggle^="button"]',
DATA_TOGGLE: '[data-toggle="buttons"]',
INPUT: 'input:not([type="hidden"])',
ACTIVE: '.active',
BUTTON: '.btn'
}
const SELECTOR_DATA_TOGGLE_CARROT = '[data-toggle^="button"]'
const SELECTOR_DATA_TOGGLE = '[data-toggle="buttons"]'
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}`,
FOCUS_DATA_API: `focus${EVENT_KEY}${DATA_API_KEY}`,
BLUR_DATA_API: `blur${EVENT_KEY}${DATA_API_KEY}`
}
const EVENT_CLICK_DATA_API = `click${EVENT_KEY}${DATA_API_KEY}`
const EVENT_FOCUS_DATA_API = `focus${EVENT_KEY}${DATA_API_KEY}`
const EVENT_BLUR_DATA_API = `blur${EVENT_KEY}${DATA_API_KEY}`

/**
* ------------------------------------------------------------------------
Expand Down Expand Up @@ -69,33 +63,33 @@ class Button {

const rootElement = SelectorEngine.closest(
this._element,
Selector.DATA_TOGGLE
SELECTOR_DATA_TOGGLE
)

if (rootElement) {
const input = SelectorEngine.findOne(Selector.INPUT, this._element)
const input = SelectorEngine.findOne(SELECTOR_INPUT, this._element)

if (input && input.type === 'radio') {
if (input.checked &&
this._element.classList.contains(ClassName.ACTIVE)) {
this._element.classList.contains(CLASS_NAME_ACTIVE)) {
triggerChangeEvent = false
} else {
const activeElement = SelectorEngine.findOne(Selector.ACTIVE, rootElement)
const activeElement = SelectorEngine.findOne(SELECTOR_ACTIVE, rootElement)

if (activeElement) {
activeElement.classList.remove(ClassName.ACTIVE)
activeElement.classList.remove(CLASS_NAME_ACTIVE)
}
}

if (triggerChangeEvent) {
if (input.hasAttribute('disabled') ||
rootElement.hasAttribute('disabled') ||
input.classList.contains(ClassName.DISABLED) ||
rootElement.classList.contains(ClassName.DISABLED)) {
input.classList.contains(CLASS_NAME_DISABLED) ||
rootElement.classList.contains(CLASS_NAME_DISABLED)) {
return
}

input.checked = !this._element.classList.contains(ClassName.ACTIVE)
input.checked = !this._element.classList.contains(CLASS_NAME_ACTIVE)
EventHandler.trigger(input, 'change')
}

Expand All @@ -106,11 +100,11 @@ class Button {

if (addAriaPressed) {
this._element.setAttribute('aria-pressed',
!this._element.classList.contains(ClassName.ACTIVE))
!this._element.classList.contains(CLASS_NAME_ACTIVE))
}

if (triggerChangeEvent) {
this._element.classList.toggle(ClassName.ACTIVE)
this._element.classList.toggle(CLASS_NAME_ACTIVE)
}
}

Expand Down Expand Up @@ -146,12 +140,12 @@ class Button {
* ------------------------------------------------------------------------
*/

EventHandler.on(document, Event.CLICK_DATA_API, Selector.DATA_TOGGLE_CARROT, event => {
EventHandler.on(document, EVENT_CLICK_DATA_API, SELECTOR_DATA_TOGGLE_CARROT, event => {
event.preventDefault()

let button = event.target
if (!button.classList.contains(ClassName.BUTTON)) {
button = SelectorEngine.closest(button, Selector.BUTTON)
if (!button.classList.contains(CLASS_NAME_BUTTON)) {
button = SelectorEngine.closest(button, SELECTOR_BUTTON)
}

let data = Data.getData(button, DATA_KEY)
Expand All @@ -162,19 +156,19 @@ EventHandler.on(document, Event.CLICK_DATA_API, Selector.DATA_TOGGLE_CARROT, eve
data.toggle()
})

EventHandler.on(document, Event.FOCUS_DATA_API, Selector.DATA_TOGGLE_CARROT, event => {
const button = SelectorEngine.closest(event.target, Selector.BUTTON)
EventHandler.on(document, EVENT_FOCUS_DATA_API, SELECTOR_DATA_TOGGLE_CARROT, event => {
const button = SelectorEngine.closest(event.target, SELECTOR_BUTTON)

if (button) {
button.classList.add(ClassName.FOCUS)
button.classList.add(CLASS_NAME_FOCUS)
}
})

EventHandler.on(document, Event.BLUR_DATA_API, Selector.DATA_TOGGLE_CARROT, event => {
const button = SelectorEngine.closest(event.target, Selector.BUTTON)
EventHandler.on(document, EVENT_BLUR_DATA_API, SELECTOR_DATA_TOGGLE_CARROT, event => {
const button = SelectorEngine.closest(event.target, SELECTOR_BUTTON)

if (button) {
button.classList.remove(ClassName.FOCUS)
button.classList.remove(CLASS_NAME_FOCUS)
}
})

Expand Down
Loading