source: trip-planner-front/node_modules/bootstrap/js/src/tab.js@ 6a3a178

Last change on this file since 6a3a178 was 6a3a178, checked in by Ema <ema_spirova@…>, 3 years ago

initial commit

  • Property mode set to 100644
File size: 6.1 KB
Line 
1/**
2 * --------------------------------------------------------------------------
3 * Bootstrap (v5.1.3): tab.js
4 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
5 * --------------------------------------------------------------------------
6 */
7
8import {
9 defineJQueryPlugin,
10 getElementFromSelector,
11 isDisabled,
12 reflow
13} from './util/index'
14import EventHandler from './dom/event-handler'
15import SelectorEngine from './dom/selector-engine'
16import BaseComponent from './base-component'
17
18/**
19 * ------------------------------------------------------------------------
20 * Constants
21 * ------------------------------------------------------------------------
22 */
23
24const NAME = 'tab'
25const DATA_KEY = 'bs.tab'
26const EVENT_KEY = `.${DATA_KEY}`
27const DATA_API_KEY = '.data-api'
28
29const EVENT_HIDE = `hide${EVENT_KEY}`
30const EVENT_HIDDEN = `hidden${EVENT_KEY}`
31const EVENT_SHOW = `show${EVENT_KEY}`
32const EVENT_SHOWN = `shown${EVENT_KEY}`
33const EVENT_CLICK_DATA_API = `click${EVENT_KEY}${DATA_API_KEY}`
34
35const CLASS_NAME_DROPDOWN_MENU = 'dropdown-menu'
36const CLASS_NAME_ACTIVE = 'active'
37const CLASS_NAME_FADE = 'fade'
38const CLASS_NAME_SHOW = 'show'
39
40const SELECTOR_DROPDOWN = '.dropdown'
41const SELECTOR_NAV_LIST_GROUP = '.nav, .list-group'
42const SELECTOR_ACTIVE = '.active'
43const SELECTOR_ACTIVE_UL = ':scope > li > .active'
44const SELECTOR_DATA_TOGGLE = '[data-bs-toggle="tab"], [data-bs-toggle="pill"], [data-bs-toggle="list"]'
45const SELECTOR_DROPDOWN_TOGGLE = '.dropdown-toggle'
46const SELECTOR_DROPDOWN_ACTIVE_CHILD = ':scope > .dropdown-menu .active'
47
48/**
49 * ------------------------------------------------------------------------
50 * Class Definition
51 * ------------------------------------------------------------------------
52 */
53
54class Tab extends BaseComponent {
55 // Getters
56
57 static get NAME() {
58 return NAME
59 }
60
61 // Public
62
63 show() {
64 if ((this._element.parentNode &&
65 this._element.parentNode.nodeType === Node.ELEMENT_NODE &&
66 this._element.classList.contains(CLASS_NAME_ACTIVE))) {
67 return
68 }
69
70 let previous
71 const target = getElementFromSelector(this._element)
72 const listElement = this._element.closest(SELECTOR_NAV_LIST_GROUP)
73
74 if (listElement) {
75 const itemSelector = listElement.nodeName === 'UL' || listElement.nodeName === 'OL' ? SELECTOR_ACTIVE_UL : SELECTOR_ACTIVE
76 previous = SelectorEngine.find(itemSelector, listElement)
77 previous = previous[previous.length - 1]
78 }
79
80 const hideEvent = previous ?
81 EventHandler.trigger(previous, EVENT_HIDE, {
82 relatedTarget: this._element
83 }) :
84 null
85
86 const showEvent = EventHandler.trigger(this._element, EVENT_SHOW, {
87 relatedTarget: previous
88 })
89
90 if (showEvent.defaultPrevented || (hideEvent !== null && hideEvent.defaultPrevented)) {
91 return
92 }
93
94 this._activate(this._element, listElement)
95
96 const complete = () => {
97 EventHandler.trigger(previous, EVENT_HIDDEN, {
98 relatedTarget: this._element
99 })
100 EventHandler.trigger(this._element, EVENT_SHOWN, {
101 relatedTarget: previous
102 })
103 }
104
105 if (target) {
106 this._activate(target, target.parentNode, complete)
107 } else {
108 complete()
109 }
110 }
111
112 // Private
113
114 _activate(element, container, callback) {
115 const activeElements = container && (container.nodeName === 'UL' || container.nodeName === 'OL') ?
116 SelectorEngine.find(SELECTOR_ACTIVE_UL, container) :
117 SelectorEngine.children(container, SELECTOR_ACTIVE)
118
119 const active = activeElements[0]
120 const isTransitioning = callback && (active && active.classList.contains(CLASS_NAME_FADE))
121
122 const complete = () => this._transitionComplete(element, active, callback)
123
124 if (active && isTransitioning) {
125 active.classList.remove(CLASS_NAME_SHOW)
126 this._queueCallback(complete, element, true)
127 } else {
128 complete()
129 }
130 }
131
132 _transitionComplete(element, active, callback) {
133 if (active) {
134 active.classList.remove(CLASS_NAME_ACTIVE)
135
136 const dropdownChild = SelectorEngine.findOne(SELECTOR_DROPDOWN_ACTIVE_CHILD, active.parentNode)
137
138 if (dropdownChild) {
139 dropdownChild.classList.remove(CLASS_NAME_ACTIVE)
140 }
141
142 if (active.getAttribute('role') === 'tab') {
143 active.setAttribute('aria-selected', false)
144 }
145 }
146
147 element.classList.add(CLASS_NAME_ACTIVE)
148 if (element.getAttribute('role') === 'tab') {
149 element.setAttribute('aria-selected', true)
150 }
151
152 reflow(element)
153
154 if (element.classList.contains(CLASS_NAME_FADE)) {
155 element.classList.add(CLASS_NAME_SHOW)
156 }
157
158 let parent = element.parentNode
159 if (parent && parent.nodeName === 'LI') {
160 parent = parent.parentNode
161 }
162
163 if (parent && parent.classList.contains(CLASS_NAME_DROPDOWN_MENU)) {
164 const dropdownElement = element.closest(SELECTOR_DROPDOWN)
165
166 if (dropdownElement) {
167 SelectorEngine.find(SELECTOR_DROPDOWN_TOGGLE, dropdownElement)
168 .forEach(dropdown => dropdown.classList.add(CLASS_NAME_ACTIVE))
169 }
170
171 element.setAttribute('aria-expanded', true)
172 }
173
174 if (callback) {
175 callback()
176 }
177 }
178
179 // Static
180
181 static jQueryInterface(config) {
182 return this.each(function () {
183 const data = Tab.getOrCreateInstance(this)
184
185 if (typeof config === 'string') {
186 if (typeof data[config] === 'undefined') {
187 throw new TypeError(`No method named "${config}"`)
188 }
189
190 data[config]()
191 }
192 })
193 }
194}
195
196/**
197 * ------------------------------------------------------------------------
198 * Data Api implementation
199 * ------------------------------------------------------------------------
200 */
201
202EventHandler.on(document, EVENT_CLICK_DATA_API, SELECTOR_DATA_TOGGLE, function (event) {
203 if (['A', 'AREA'].includes(this.tagName)) {
204 event.preventDefault()
205 }
206
207 if (isDisabled(this)) {
208 return
209 }
210
211 const data = Tab.getOrCreateInstance(this)
212 data.show()
213})
214
215/**
216 * ------------------------------------------------------------------------
217 * jQuery
218 * ------------------------------------------------------------------------
219 * add .Tab to jQuery only if jQuery is present
220 */
221
222defineJQueryPlugin(Tab)
223
224export default Tab
Note: See TracBrowser for help on using the repository browser.