1 | import React, { useCallback, useMemo, useState, useContext, Component, forwardRef } from 'react';
|
2 | import PropTypes from 'prop-types';
|
3 | import classNames from 'classnames';
|
4 | import { Manager, Popper, Reference } from 'react-popper';
|
5 | import ReactDOM from 'react-dom';
|
6 | import { Transition } from 'react-transition-group';
|
7 |
|
8 | function ownKeys(object, enumerableOnly) {
|
9 | var keys = Object.keys(object);
|
10 |
|
11 | if (Object.getOwnPropertySymbols) {
|
12 | var symbols = Object.getOwnPropertySymbols(object);
|
13 |
|
14 | if (enumerableOnly) {
|
15 | symbols = symbols.filter(function (sym) {
|
16 | return Object.getOwnPropertyDescriptor(object, sym).enumerable;
|
17 | });
|
18 | }
|
19 |
|
20 | keys.push.apply(keys, symbols);
|
21 | }
|
22 |
|
23 | return keys;
|
24 | }
|
25 |
|
26 | function _objectSpread2(target) {
|
27 | for (var i = 1; i < arguments.length; i++) {
|
28 | var source = arguments[i] != null ? arguments[i] : {};
|
29 |
|
30 | if (i % 2) {
|
31 | ownKeys(Object(source), true).forEach(function (key) {
|
32 | _defineProperty(target, key, source[key]);
|
33 | });
|
34 | } else if (Object.getOwnPropertyDescriptors) {
|
35 | Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
|
36 | } else {
|
37 | ownKeys(Object(source)).forEach(function (key) {
|
38 | Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
|
39 | });
|
40 | }
|
41 | }
|
42 |
|
43 | return target;
|
44 | }
|
45 |
|
46 | function _defineProperty(obj, key, value) {
|
47 | if (key in obj) {
|
48 | Object.defineProperty(obj, key, {
|
49 | value: value,
|
50 | enumerable: true,
|
51 | configurable: true,
|
52 | writable: true
|
53 | });
|
54 | } else {
|
55 | obj[key] = value;
|
56 | }
|
57 |
|
58 | return obj;
|
59 | }
|
60 |
|
61 | function _extends() {
|
62 | _extends = Object.assign || function (target) {
|
63 | for (var i = 1; i < arguments.length; i++) {
|
64 | var source = arguments[i];
|
65 |
|
66 | for (var key in source) {
|
67 | if (Object.prototype.hasOwnProperty.call(source, key)) {
|
68 | target[key] = source[key];
|
69 | }
|
70 | }
|
71 | }
|
72 |
|
73 | return target;
|
74 | };
|
75 |
|
76 | return _extends.apply(this, arguments);
|
77 | }
|
78 |
|
79 | function _objectWithoutPropertiesLoose(source, excluded) {
|
80 | if (source == null) return {};
|
81 | var target = {};
|
82 | var sourceKeys = Object.keys(source);
|
83 | var key, i;
|
84 |
|
85 | for (i = 0; i < sourceKeys.length; i++) {
|
86 | key = sourceKeys[i];
|
87 | if (excluded.indexOf(key) >= 0) continue;
|
88 | target[key] = source[key];
|
89 | }
|
90 |
|
91 | return target;
|
92 | }
|
93 |
|
94 | function _objectWithoutProperties(source, excluded) {
|
95 | if (source == null) return {};
|
96 |
|
97 | var target = _objectWithoutPropertiesLoose(source, excluded);
|
98 |
|
99 | var key, i;
|
100 |
|
101 | if (Object.getOwnPropertySymbols) {
|
102 | var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
|
103 |
|
104 | for (i = 0; i < sourceSymbolKeys.length; i++) {
|
105 | key = sourceSymbolKeys[i];
|
106 | if (excluded.indexOf(key) >= 0) continue;
|
107 | if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
|
108 | target[key] = source[key];
|
109 | }
|
110 | }
|
111 |
|
112 | return target;
|
113 | }
|
114 |
|
115 | function getScrollbarWidth() {
|
116 | let scrollDiv = document.createElement('div');
|
117 |
|
118 | scrollDiv.style.position = 'absolute';
|
119 | scrollDiv.style.top = '-9999px';
|
120 | scrollDiv.style.width = '50px';
|
121 | scrollDiv.style.height = '50px';
|
122 | scrollDiv.style.overflow = 'scroll';
|
123 | document.body.appendChild(scrollDiv);
|
124 | const scrollbarWidth = scrollDiv.offsetWidth - scrollDiv.clientWidth;
|
125 | document.body.removeChild(scrollDiv);
|
126 | return scrollbarWidth;
|
127 | }
|
128 | function setScrollbarWidth(padding) {
|
129 | document.body.style.paddingRight = padding > 0 ? `${padding}px` : null;
|
130 | }
|
131 | function isBodyOverflowing() {
|
132 | return document.body.clientWidth < window.innerWidth;
|
133 | }
|
134 | function getOriginalBodyPadding() {
|
135 | const style = window.getComputedStyle(document.body, null);
|
136 | return parseInt(style && style.getPropertyValue('padding-right') || 0, 10);
|
137 | }
|
138 | function conditionallyUpdateScrollbar() {
|
139 | const scrollbarWidth = getScrollbarWidth();
|
140 |
|
141 | const fixedContent = document.querySelectorAll('.fixed-top, .fixed-bottom, .is-fixed, .sticky-top')[0];
|
142 | const bodyPadding = fixedContent ? parseInt(fixedContent.style.paddingRight || 0, 10) : 0;
|
143 |
|
144 | if (isBodyOverflowing()) {
|
145 | setScrollbarWidth(bodyPadding + scrollbarWidth);
|
146 | }
|
147 | }
|
148 | let globalCssModule;
|
149 | function setGlobalCssModule(cssModule) {
|
150 | globalCssModule = cssModule;
|
151 | }
|
152 | function mapToCssModules(className = '', cssModule = globalCssModule) {
|
153 | if (!cssModule) return className;
|
154 | return className.split(' ').map(c => cssModule[c] || c).join(' ');
|
155 | }
|
156 |
|
157 |
|
158 |
|
159 |
|
160 | function omit(obj, omitKeys) {
|
161 | const result = {};
|
162 | Object.keys(obj).forEach(key => {
|
163 | if (omitKeys.indexOf(key) === -1) {
|
164 | result[key] = obj[key];
|
165 | }
|
166 | });
|
167 | return result;
|
168 | }
|
169 |
|
170 |
|
171 |
|
172 |
|
173 | function pick(obj, keys) {
|
174 | const pickKeys = Array.isArray(keys) ? keys : [keys];
|
175 | let length = pickKeys.length;
|
176 | let key;
|
177 | const result = {};
|
178 |
|
179 | while (length > 0) {
|
180 | length -= 1;
|
181 | key = pickKeys[length];
|
182 | result[key] = obj[key];
|
183 | }
|
184 |
|
185 | return result;
|
186 | }
|
187 | let warned = {};
|
188 | function warnOnce(message) {
|
189 | if (!warned[message]) {
|
190 |
|
191 | if (typeof console !== 'undefined') {
|
192 | console.error(message);
|
193 | }
|
194 |
|
195 | warned[message] = true;
|
196 | }
|
197 | }
|
198 | function deprecated(propType, explanation) {
|
199 | return function validate(props, propName, componentName, ...rest) {
|
200 | if (props[propName] !== null && typeof props[propName] !== 'undefined') {
|
201 | warnOnce(`"${propName}" property of "${componentName}" has been deprecated.\n${explanation}`);
|
202 | }
|
203 |
|
204 | return propType(props, propName, componentName, ...rest);
|
205 | };
|
206 | }
|
207 |
|
208 | const Element = typeof window === 'object' && window.Element || function () {};
|
209 |
|
210 | function DOMElement(props, propName, componentName) {
|
211 | if (!(props[propName] instanceof Element)) {
|
212 | return new Error('Invalid prop `' + propName + '` supplied to `' + componentName + '`. Expected prop to be an instance of Element. Validation failed.');
|
213 | }
|
214 | }
|
215 | const targetPropType = PropTypes.oneOfType([PropTypes.string, PropTypes.func, DOMElement, PropTypes.shape({
|
216 | current: PropTypes.any
|
217 | })]);
|
218 | const tagPropType = PropTypes.oneOfType([PropTypes.func, PropTypes.string, PropTypes.shape({
|
219 | $$typeof: PropTypes.symbol,
|
220 | render: PropTypes.func
|
221 | }), PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.string, PropTypes.shape({
|
222 | $$typeof: PropTypes.symbol,
|
223 | render: PropTypes.func
|
224 | })]))]);
|
225 |
|
226 |
|
227 |
|
228 |
|
229 | const TransitionTimeouts = {
|
230 | Fade: 150,
|
231 |
|
232 | Collapse: 350,
|
233 |
|
234 | Modal: 300,
|
235 |
|
236 | Carousel: 600,
|
237 |
|
238 | Offcanvas: 300
|
239 |
|
240 | };
|
241 |
|
242 |
|
243 |
|
244 | const TransitionPropTypeKeys = ['in', 'mountOnEnter', 'unmountOnExit', 'appear', 'enter', 'exit', 'timeout', 'onEnter', 'onEntering', 'onEntered', 'onExit', 'onExiting', 'onExited'];
|
245 | const TransitionStatuses = {
|
246 | ENTERING: 'entering',
|
247 | ENTERED: 'entered',
|
248 | EXITING: 'exiting',
|
249 | EXITED: 'exited'
|
250 | };
|
251 | const keyCodes = {
|
252 | esc: 27,
|
253 | space: 32,
|
254 | enter: 13,
|
255 | tab: 9,
|
256 | up: 38,
|
257 | down: 40,
|
258 | home: 36,
|
259 | end: 35,
|
260 | n: 78,
|
261 | p: 80
|
262 | };
|
263 | const PopperPlacements = ['auto-start', 'auto', 'auto-end', 'top-start', 'top', 'top-end', 'right-start', 'right', 'right-end', 'bottom-end', 'bottom', 'bottom-start', 'left-end', 'left', 'left-start'];
|
264 | const canUseDOM = !!(typeof window !== 'undefined' && window.document && window.document.createElement);
|
265 | function isReactRefObj(target) {
|
266 | if (target && typeof target === 'object') {
|
267 | return 'current' in target;
|
268 | }
|
269 |
|
270 | return false;
|
271 | }
|
272 |
|
273 | function getTag(value) {
|
274 | if (value == null) {
|
275 | return value === undefined ? '[object Undefined]' : '[object Null]';
|
276 | }
|
277 |
|
278 | return Object.prototype.toString.call(value);
|
279 | }
|
280 |
|
281 | function toNumber(value) {
|
282 | const type = typeof value;
|
283 | const NAN = 0 / 0;
|
284 |
|
285 | if (type === 'number') {
|
286 | return value;
|
287 | }
|
288 |
|
289 | if (type === 'symbol' || type === 'object' && getTag(value) === '[object Symbol]') {
|
290 | return NAN;
|
291 | }
|
292 |
|
293 | if (isObject(value)) {
|
294 | const other = typeof value.valueOf === 'function' ? value.valueOf() : value;
|
295 | value = isObject(other) ? `${other}` : other;
|
296 | }
|
297 |
|
298 | if (type !== 'string') {
|
299 | return value === 0 ? value : +value;
|
300 | }
|
301 |
|
302 | value = value.replace(/^\s+|\s+$/g, '');
|
303 | const isBinary = /^0b[01]+$/i.test(value);
|
304 | return isBinary || /^0o[0-7]+$/i.test(value) ? parseInt(value.slice(2), isBinary ? 2 : 8) : /^[-+]0x[0-9a-f]+$/i.test(value) ? NAN : +value;
|
305 | }
|
306 | function isObject(value) {
|
307 | const type = typeof value;
|
308 | return value != null && (type === 'object' || type === 'function');
|
309 | }
|
310 | function isFunction(value) {
|
311 | if (!isObject(value)) {
|
312 | return false;
|
313 | }
|
314 |
|
315 | const tag = getTag(value);
|
316 | return tag === '[object Function]' || tag === '[object AsyncFunction]' || tag === '[object GeneratorFunction]' || tag === '[object Proxy]';
|
317 | }
|
318 | function findDOMElements(target) {
|
319 | if (isReactRefObj(target)) {
|
320 | return target.current;
|
321 | }
|
322 |
|
323 | if (isFunction(target)) {
|
324 | return target();
|
325 | }
|
326 |
|
327 | if (typeof target === 'string' && canUseDOM) {
|
328 | let selection = document.querySelectorAll(target);
|
329 |
|
330 | if (!selection.length) {
|
331 | selection = document.querySelectorAll(`#${target}`);
|
332 | }
|
333 |
|
334 | if (!selection.length) {
|
335 | throw new Error(`The target '${target}' could not be identified in the dom, tip: check spelling`);
|
336 | }
|
337 |
|
338 | return selection;
|
339 | }
|
340 |
|
341 | return target;
|
342 | }
|
343 | function isArrayOrNodeList(els) {
|
344 | if (els === null) {
|
345 | return false;
|
346 | }
|
347 |
|
348 | return Array.isArray(els) || canUseDOM && typeof els.length === 'number';
|
349 | }
|
350 | function getTarget(target, allElements) {
|
351 | const els = findDOMElements(target);
|
352 |
|
353 | if (allElements) {
|
354 | if (isArrayOrNodeList(els)) {
|
355 | return els;
|
356 | }
|
357 |
|
358 | if (els === null) {
|
359 | return [];
|
360 | }
|
361 |
|
362 | return [els];
|
363 | } else {
|
364 | if (isArrayOrNodeList(els)) {
|
365 | return els[0];
|
366 | }
|
367 |
|
368 | return els;
|
369 | }
|
370 | }
|
371 | const defaultToggleEvents = ['touchstart', 'click'];
|
372 | function addMultipleEventListeners(_els, handler, _events, useCapture) {
|
373 | let els = _els;
|
374 |
|
375 | if (!isArrayOrNodeList(els)) {
|
376 | els = [els];
|
377 | }
|
378 |
|
379 | let events = _events;
|
380 |
|
381 | if (typeof events === 'string') {
|
382 | events = events.split(/\s+/);
|
383 | }
|
384 |
|
385 | if (!isArrayOrNodeList(els) || typeof handler !== 'function' || !Array.isArray(events)) {
|
386 | throw new Error(`
|
387 | The first argument of this function must be DOM node or an array on DOM nodes or NodeList.
|
388 | The second must be a function.
|
389 | The third is a string or an array of strings that represents DOM events
|
390 | `);
|
391 | }
|
392 |
|
393 | Array.prototype.forEach.call(events, event => {
|
394 | Array.prototype.forEach.call(els, el => {
|
395 | el.addEventListener(event, handler, useCapture);
|
396 | });
|
397 | });
|
398 | return function removeEvents() {
|
399 | Array.prototype.forEach.call(events, event => {
|
400 | Array.prototype.forEach.call(els, el => {
|
401 | el.removeEventListener(event, handler, useCapture);
|
402 | });
|
403 | });
|
404 | };
|
405 | }
|
406 | const focusableElements = ['a[href]', 'area[href]', 'input:not([disabled]):not([type=hidden])', 'select:not([disabled])', 'textarea:not([disabled])', 'button:not([disabled])', 'object', 'embed', '[tabindex]:not(.modal)', 'audio[controls]', 'video[controls]', '[contenteditable]:not([contenteditable="false"])'];
|
407 |
|
408 | var utils = {
|
409 | __proto__: null,
|
410 | getScrollbarWidth: getScrollbarWidth,
|
411 | setScrollbarWidth: setScrollbarWidth,
|
412 | isBodyOverflowing: isBodyOverflowing,
|
413 | getOriginalBodyPadding: getOriginalBodyPadding,
|
414 | conditionallyUpdateScrollbar: conditionallyUpdateScrollbar,
|
415 | setGlobalCssModule: setGlobalCssModule,
|
416 | mapToCssModules: mapToCssModules,
|
417 | omit: omit,
|
418 | pick: pick,
|
419 | warnOnce: warnOnce,
|
420 | deprecated: deprecated,
|
421 | DOMElement: DOMElement,
|
422 | targetPropType: targetPropType,
|
423 | tagPropType: tagPropType,
|
424 | TransitionTimeouts: TransitionTimeouts,
|
425 | TransitionPropTypeKeys: TransitionPropTypeKeys,
|
426 | TransitionStatuses: TransitionStatuses,
|
427 | keyCodes: keyCodes,
|
428 | PopperPlacements: PopperPlacements,
|
429 | canUseDOM: canUseDOM,
|
430 | isReactRefObj: isReactRefObj,
|
431 | toNumber: toNumber,
|
432 | isObject: isObject,
|
433 | isFunction: isFunction,
|
434 | findDOMElements: findDOMElements,
|
435 | isArrayOrNodeList: isArrayOrNodeList,
|
436 | getTarget: getTarget,
|
437 | defaultToggleEvents: defaultToggleEvents,
|
438 | addMultipleEventListeners: addMultipleEventListeners,
|
439 | focusableElements: focusableElements
|
440 | };
|
441 |
|
442 | const _excluded$1f = ["className", "cssModule", "fluid", "tag"];
|
443 | const propTypes$1l = {
|
444 | tag: tagPropType,
|
445 | fluid: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]),
|
446 | className: PropTypes.string,
|
447 | cssModule: PropTypes.object
|
448 | };
|
449 | const defaultProps$1j = {
|
450 | tag: 'div'
|
451 | };
|
452 |
|
453 | const Container = props => {
|
454 | const {
|
455 | className,
|
456 | cssModule,
|
457 | fluid,
|
458 | tag: Tag
|
459 | } = props,
|
460 | attributes = _objectWithoutProperties(props, _excluded$1f);
|
461 |
|
462 | let containerClass = 'container';
|
463 |
|
464 | if (fluid === true) {
|
465 | containerClass = 'container-fluid';
|
466 | } else if (fluid) {
|
467 | containerClass = `container-${fluid}`;
|
468 | }
|
469 |
|
470 | const classes = mapToCssModules(classNames(className, containerClass), cssModule);
|
471 | return React.createElement(Tag, _extends({}, attributes, {
|
472 | className: classes
|
473 | }));
|
474 | };
|
475 |
|
476 | Container.propTypes = propTypes$1l;
|
477 | Container.defaultProps = defaultProps$1j;
|
478 | var Container$1 = Container;
|
479 |
|
480 | const _excluded$1e = ["className", "cssModule", "noGutters", "tag", "widths"];
|
481 | const rowColWidths = ['xs', 'sm', 'md', 'lg', 'xl', 'xxl'];
|
482 | const rowColsPropType = PropTypes.oneOfType([PropTypes.number, PropTypes.string]);
|
483 | const propTypes$1k = {
|
484 | tag: tagPropType,
|
485 | noGutters: deprecated(PropTypes.bool, "Please use Bootstrap 5 gutter utility classes. https://getbootstrap.com/docs/5.0/layout/gutters/"),
|
486 | className: PropTypes.string,
|
487 | cssModule: PropTypes.object,
|
488 | xs: rowColsPropType,
|
489 | sm: rowColsPropType,
|
490 | md: rowColsPropType,
|
491 | lg: rowColsPropType,
|
492 | xl: rowColsPropType,
|
493 | xxl: rowColsPropType
|
494 | };
|
495 | const defaultProps$1i = {
|
496 | tag: 'div',
|
497 | widths: rowColWidths
|
498 | };
|
499 |
|
500 | const Row = props => {
|
501 | const {
|
502 | className,
|
503 | cssModule,
|
504 | noGutters,
|
505 | tag: Tag,
|
506 | widths
|
507 | } = props,
|
508 | attributes = _objectWithoutProperties(props, _excluded$1e);
|
509 |
|
510 | const colClasses = [];
|
511 | widths.forEach((colWidth, i) => {
|
512 | let colSize = props[colWidth];
|
513 | delete attributes[colWidth];
|
514 |
|
515 | if (!colSize) {
|
516 | return;
|
517 | }
|
518 |
|
519 | const isXs = !i;
|
520 | colClasses.push(isXs ? `row-cols-${colSize}` : `row-cols-${colWidth}-${colSize}`);
|
521 | });
|
522 | const classes = mapToCssModules(classNames(className, noGutters ? 'gx-0' : null, 'row', colClasses), cssModule);
|
523 | return React.createElement(Tag, _extends({}, attributes, {
|
524 | className: classes
|
525 | }));
|
526 | };
|
527 |
|
528 | Row.propTypes = propTypes$1k;
|
529 | Row.defaultProps = defaultProps$1i;
|
530 | var Row$1 = Row;
|
531 |
|
532 | const _excluded$1d = ["className", "cssModule", "widths", "tag"];
|
533 | const colWidths$1 = ['xs', 'sm', 'md', 'lg', 'xl', 'xxl'];
|
534 | const stringOrNumberProp$1 = PropTypes.oneOfType([PropTypes.number, PropTypes.string]);
|
535 | const columnProps$1 = PropTypes.oneOfType([PropTypes.bool, PropTypes.number, PropTypes.string, PropTypes.shape({
|
536 | size: PropTypes.oneOfType([PropTypes.bool, PropTypes.number, PropTypes.string]),
|
537 | order: stringOrNumberProp$1,
|
538 | offset: stringOrNumberProp$1
|
539 | })]);
|
540 | const propTypes$1j = {
|
541 | tag: tagPropType,
|
542 | xs: columnProps$1,
|
543 | sm: columnProps$1,
|
544 | md: columnProps$1,
|
545 | lg: columnProps$1,
|
546 | xl: columnProps$1,
|
547 | xxl: columnProps$1,
|
548 | className: PropTypes.string,
|
549 | cssModule: PropTypes.object,
|
550 | widths: PropTypes.array
|
551 | };
|
552 | const defaultProps$1h = {
|
553 | tag: 'div',
|
554 | widths: colWidths$1
|
555 | };
|
556 |
|
557 | const getColumnSizeClass$1 = (isXs, colWidth, colSize) => {
|
558 | if (colSize === true || colSize === '') {
|
559 | return isXs ? 'col' : `col-${colWidth}`;
|
560 | } else if (colSize === 'auto') {
|
561 | return isXs ? 'col-auto' : `col-${colWidth}-auto`;
|
562 | }
|
563 |
|
564 | return isXs ? `col-${colSize}` : `col-${colWidth}-${colSize}`;
|
565 | };
|
566 |
|
567 | const getColumnClasses = (attributes, cssModule, widths = colWidths$1) => {
|
568 | const colClasses = [];
|
569 | widths.forEach((colWidth, i) => {
|
570 | let columnProp = attributes[colWidth];
|
571 | delete attributes[colWidth];
|
572 |
|
573 | if (!columnProp && columnProp !== '') {
|
574 | return;
|
575 | }
|
576 |
|
577 | const isXs = !i;
|
578 |
|
579 | if (isObject(columnProp)) {
|
580 | const colSizeInterfix = isXs ? '-' : `-${colWidth}-`;
|
581 | const colClass = getColumnSizeClass$1(isXs, colWidth, columnProp.size);
|
582 | colClasses.push(mapToCssModules(classNames({
|
583 | [colClass]: columnProp.size || columnProp.size === '',
|
584 | [`order${colSizeInterfix}${columnProp.order}`]: columnProp.order || columnProp.order === 0,
|
585 | [`offset${colSizeInterfix}${columnProp.offset}`]: columnProp.offset || columnProp.offset === 0
|
586 | }), cssModule));
|
587 | } else {
|
588 | const colClass = getColumnSizeClass$1(isXs, colWidth, columnProp);
|
589 | colClasses.push(colClass);
|
590 | }
|
591 | });
|
592 | return {
|
593 | colClasses,
|
594 | attributes
|
595 | };
|
596 | };
|
597 |
|
598 | const Col = props => {
|
599 | const {
|
600 | className,
|
601 | cssModule,
|
602 | widths,
|
603 | tag: Tag
|
604 | } = props,
|
605 | attributes = _objectWithoutProperties(props, _excluded$1d);
|
606 |
|
607 | let {
|
608 | attributes: modifiedAttributes,
|
609 | colClasses
|
610 | } = getColumnClasses(attributes, cssModule, widths);
|
611 |
|
612 | if (!colClasses.length) {
|
613 | colClasses.push('col');
|
614 | }
|
615 |
|
616 | const classes = mapToCssModules(classNames(className, colClasses), cssModule);
|
617 | return React.createElement(Tag, _extends({}, modifiedAttributes, {
|
618 | className: classes
|
619 | }));
|
620 | };
|
621 |
|
622 | Col.propTypes = propTypes$1j;
|
623 | Col.defaultProps = defaultProps$1h;
|
624 | var Col$1 = Col;
|
625 |
|
626 | const _excluded$1c = ["expand", "className", "cssModule", "light", "dark", "fixed", "sticky", "color", "container", "tag", "children"];
|
627 | const propTypes$1i = {
|
628 | light: PropTypes.bool,
|
629 | dark: PropTypes.bool,
|
630 | full: PropTypes.bool,
|
631 | fixed: PropTypes.string,
|
632 | sticky: PropTypes.string,
|
633 | color: PropTypes.string,
|
634 | role: PropTypes.string,
|
635 | tag: tagPropType,
|
636 | container: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]),
|
637 | className: PropTypes.string,
|
638 | cssModule: PropTypes.object,
|
639 | expand: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]),
|
640 | children: PropTypes.node
|
641 | };
|
642 | const defaultProps$1g = {
|
643 | tag: 'nav',
|
644 | expand: false,
|
645 | container: 'fluid'
|
646 | };
|
647 |
|
648 | const getExpandClass = expand => {
|
649 | if (expand === false) {
|
650 | return false;
|
651 | } else if (expand === true || expand === 'xs') {
|
652 | return 'navbar-expand';
|
653 | }
|
654 |
|
655 | return `navbar-expand-${expand}`;
|
656 | };
|
657 |
|
658 | const Navbar = props => {
|
659 | const {
|
660 | expand,
|
661 | className,
|
662 | cssModule,
|
663 | light,
|
664 | dark,
|
665 | fixed,
|
666 | sticky,
|
667 | color,
|
668 | container,
|
669 | tag: Tag,
|
670 | children
|
671 | } = props,
|
672 | attributes = _objectWithoutProperties(props, _excluded$1c);
|
673 |
|
674 | const classes = mapToCssModules(classNames(className, 'navbar', getExpandClass(expand), {
|
675 | 'navbar-light': light,
|
676 | 'navbar-dark': dark,
|
677 | [`bg-${color}`]: color,
|
678 | [`fixed-${fixed}`]: fixed,
|
679 | [`sticky-${sticky}`]: sticky
|
680 | }), cssModule);
|
681 | const containerClass = container && container === true ? 'container' : `container-${container}`;
|
682 | return React.createElement(Tag, _extends({}, attributes, {
|
683 | className: classes
|
684 | }), container ? React.createElement("div", {
|
685 | className: containerClass
|
686 | }, children) : children);
|
687 | };
|
688 |
|
689 | Navbar.propTypes = propTypes$1i;
|
690 | Navbar.defaultProps = defaultProps$1g;
|
691 | var Navbar$1 = Navbar;
|
692 |
|
693 | const _excluded$1b = ["className", "cssModule", "tag"];
|
694 | const propTypes$1h = {
|
695 | tag: tagPropType,
|
696 | className: PropTypes.string,
|
697 | cssModule: PropTypes.object
|
698 | };
|
699 | const defaultProps$1f = {
|
700 | tag: 'a'
|
701 | };
|
702 |
|
703 | const NavbarBrand = props => {
|
704 | const {
|
705 | className,
|
706 | cssModule,
|
707 | tag: Tag
|
708 | } = props,
|
709 | attributes = _objectWithoutProperties(props, _excluded$1b);
|
710 |
|
711 | const classes = mapToCssModules(classNames(className, 'navbar-brand'), cssModule);
|
712 | return React.createElement(Tag, _extends({}, attributes, {
|
713 | className: classes
|
714 | }));
|
715 | };
|
716 |
|
717 | NavbarBrand.propTypes = propTypes$1h;
|
718 | NavbarBrand.defaultProps = defaultProps$1f;
|
719 | var NavbarBrand$1 = NavbarBrand;
|
720 |
|
721 | const _excluded$1a = ["className", "cssModule", "active", "tag"];
|
722 | const propTypes$1g = {
|
723 | tag: tagPropType,
|
724 | className: PropTypes.string,
|
725 | cssModule: PropTypes.object
|
726 | };
|
727 | const defaultProps$1e = {
|
728 | tag: 'span'
|
729 | };
|
730 |
|
731 | const NavbarText = props => {
|
732 | const {
|
733 | className,
|
734 | cssModule,
|
735 | active,
|
736 | tag: Tag
|
737 | } = props,
|
738 | attributes = _objectWithoutProperties(props, _excluded$1a);
|
739 |
|
740 | const classes = mapToCssModules(classNames(className, 'navbar-text'), cssModule);
|
741 | return React.createElement(Tag, _extends({}, attributes, {
|
742 | className: classes
|
743 | }));
|
744 | };
|
745 |
|
746 | NavbarText.propTypes = propTypes$1g;
|
747 | NavbarText.defaultProps = defaultProps$1e;
|
748 | var NavbarText$1 = NavbarText;
|
749 |
|
750 | const _excluded$19 = ["className", "cssModule", "children", "tag"];
|
751 | const propTypes$1f = {
|
752 | tag: tagPropType,
|
753 | type: PropTypes.string,
|
754 | className: PropTypes.string,
|
755 | cssModule: PropTypes.object,
|
756 | children: PropTypes.node
|
757 | };
|
758 | const defaultProps$1d = {
|
759 | tag: 'button',
|
760 | type: 'button'
|
761 | };
|
762 |
|
763 | const NavbarToggler = props => {
|
764 | const {
|
765 | className,
|
766 | cssModule,
|
767 | children,
|
768 | tag: Tag
|
769 | } = props,
|
770 | attributes = _objectWithoutProperties(props, _excluded$19);
|
771 |
|
772 | const classes = mapToCssModules(classNames(className, 'navbar-toggler'), cssModule);
|
773 | return React.createElement(Tag, _extends({
|
774 | "aria-label": "Toggle navigation"
|
775 | }, attributes, {
|
776 | className: classes
|
777 | }), children || React.createElement("span", {
|
778 | className: mapToCssModules('navbar-toggler-icon', cssModule)
|
779 | }));
|
780 | };
|
781 |
|
782 | NavbarToggler.propTypes = propTypes$1f;
|
783 | NavbarToggler.defaultProps = defaultProps$1d;
|
784 | var NavbarToggler$1 = NavbarToggler;
|
785 |
|
786 | const _excluded$18 = ["className", "cssModule", "tabs", "pills", "vertical", "horizontal", "justified", "fill", "navbar", "card", "tag"];
|
787 | const propTypes$1e = {
|
788 | tabs: PropTypes.bool,
|
789 | pills: PropTypes.bool,
|
790 | vertical: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]),
|
791 | horizontal: PropTypes.string,
|
792 | justified: PropTypes.bool,
|
793 | fill: PropTypes.bool,
|
794 | navbar: PropTypes.bool,
|
795 | card: PropTypes.bool,
|
796 | tag: tagPropType,
|
797 | className: PropTypes.string,
|
798 | cssModule: PropTypes.object
|
799 | };
|
800 | const defaultProps$1c = {
|
801 | tag: 'ul',
|
802 | vertical: false
|
803 | };
|
804 |
|
805 | const getVerticalClass = vertical => {
|
806 | if (vertical === false) {
|
807 | return false;
|
808 | } else if (vertical === true || vertical === 'xs') {
|
809 | return 'flex-column';
|
810 | }
|
811 |
|
812 | return `flex-${vertical}-column`;
|
813 | };
|
814 |
|
815 | const Nav = props => {
|
816 | const {
|
817 | className,
|
818 | cssModule,
|
819 | tabs,
|
820 | pills,
|
821 | vertical,
|
822 | horizontal,
|
823 | justified,
|
824 | fill,
|
825 | navbar,
|
826 | card,
|
827 | tag: Tag
|
828 | } = props,
|
829 | attributes = _objectWithoutProperties(props, _excluded$18);
|
830 |
|
831 | const classes = mapToCssModules(classNames(className, navbar ? 'navbar-nav' : 'nav', horizontal ? `justify-content-${horizontal}` : false, getVerticalClass(vertical), {
|
832 | 'nav-tabs': tabs,
|
833 | 'card-header-tabs': card && tabs,
|
834 | 'nav-pills': pills,
|
835 | 'card-header-pills': card && pills,
|
836 | 'nav-justified': justified,
|
837 | 'nav-fill': fill
|
838 | }), cssModule);
|
839 | return React.createElement(Tag, _extends({}, attributes, {
|
840 | className: classes
|
841 | }));
|
842 | };
|
843 |
|
844 | Nav.propTypes = propTypes$1e;
|
845 | Nav.defaultProps = defaultProps$1c;
|
846 | var Nav$1 = Nav;
|
847 |
|
848 | const _excluded$17 = ["className", "cssModule", "active", "tag"];
|
849 | const propTypes$1d = {
|
850 | tag: tagPropType,
|
851 | active: PropTypes.bool,
|
852 | className: PropTypes.string,
|
853 | cssModule: PropTypes.object
|
854 | };
|
855 | const defaultProps$1b = {
|
856 | tag: 'li'
|
857 | };
|
858 |
|
859 | const NavItem = props => {
|
860 | const {
|
861 | className,
|
862 | cssModule,
|
863 | active,
|
864 | tag: Tag
|
865 | } = props,
|
866 | attributes = _objectWithoutProperties(props, _excluded$17);
|
867 |
|
868 | const classes = mapToCssModules(classNames(className, 'nav-item', active ? 'active' : false), cssModule);
|
869 | return React.createElement(Tag, _extends({}, attributes, {
|
870 | className: classes
|
871 | }));
|
872 | };
|
873 |
|
874 | NavItem.propTypes = propTypes$1d;
|
875 | NavItem.defaultProps = defaultProps$1b;
|
876 | var NavItem$1 = NavItem;
|
877 |
|
878 | const _excluded$16 = ["className", "cssModule", "active", "tag", "innerRef"];
|
879 | const propTypes$1c = {
|
880 | tag: tagPropType,
|
881 | innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),
|
882 | disabled: PropTypes.bool,
|
883 | active: PropTypes.bool,
|
884 | className: PropTypes.string,
|
885 | cssModule: PropTypes.object,
|
886 | onClick: PropTypes.func,
|
887 | href: PropTypes.any
|
888 | };
|
889 | const defaultProps$1a = {
|
890 | tag: 'a'
|
891 | };
|
892 |
|
893 | class NavLink extends React.Component {
|
894 | constructor(props) {
|
895 | super(props);
|
896 | this.onClick = this.onClick.bind(this);
|
897 | }
|
898 |
|
899 | onClick(e) {
|
900 | if (this.props.disabled) {
|
901 | e.preventDefault();
|
902 | return;
|
903 | }
|
904 |
|
905 | if (this.props.href === '#') {
|
906 | e.preventDefault();
|
907 | }
|
908 |
|
909 | if (this.props.onClick) {
|
910 | this.props.onClick(e);
|
911 | }
|
912 | }
|
913 |
|
914 | render() {
|
915 | let _this$props = this.props,
|
916 | {
|
917 | className,
|
918 | cssModule,
|
919 | active,
|
920 | tag: Tag,
|
921 | innerRef
|
922 | } = _this$props,
|
923 | attributes = _objectWithoutProperties(_this$props, _excluded$16);
|
924 |
|
925 | const classes = mapToCssModules(classNames(className, 'nav-link', {
|
926 | disabled: attributes.disabled,
|
927 | active: active
|
928 | }), cssModule);
|
929 | return React.createElement(Tag, _extends({}, attributes, {
|
930 | ref: innerRef,
|
931 | onClick: this.onClick,
|
932 | className: classes
|
933 | }));
|
934 | }
|
935 |
|
936 | }
|
937 |
|
938 | NavLink.propTypes = propTypes$1c;
|
939 | NavLink.defaultProps = defaultProps$1a;
|
940 | var NavLink$1 = NavLink;
|
941 |
|
942 | const _excluded$15 = ["className", "listClassName", "cssModule", "children", "tag", "listTag", "aria-label"];
|
943 | const propTypes$1b = {
|
944 | tag: tagPropType,
|
945 | listTag: tagPropType,
|
946 | className: PropTypes.string,
|
947 | listClassName: PropTypes.string,
|
948 | cssModule: PropTypes.object,
|
949 | children: PropTypes.node,
|
950 | 'aria-label': PropTypes.string
|
951 | };
|
952 | const defaultProps$19 = {
|
953 | tag: 'nav',
|
954 | listTag: 'ol',
|
955 | 'aria-label': 'breadcrumb'
|
956 | };
|
957 |
|
958 | const Breadcrumb = props => {
|
959 | const {
|
960 | className,
|
961 | listClassName,
|
962 | cssModule,
|
963 | children,
|
964 | tag: Tag,
|
965 | listTag: ListTag,
|
966 | 'aria-label': label
|
967 | } = props,
|
968 | attributes = _objectWithoutProperties(props, _excluded$15);
|
969 |
|
970 | const classes = mapToCssModules(classNames(className), cssModule);
|
971 | const listClasses = mapToCssModules(classNames('breadcrumb', listClassName), cssModule);
|
972 | return React.createElement(Tag, _extends({}, attributes, {
|
973 | className: classes,
|
974 | "aria-label": label
|
975 | }), React.createElement(ListTag, {
|
976 | className: listClasses
|
977 | }, children));
|
978 | };
|
979 |
|
980 | Breadcrumb.propTypes = propTypes$1b;
|
981 | Breadcrumb.defaultProps = defaultProps$19;
|
982 | var Breadcrumb$1 = Breadcrumb;
|
983 |
|
984 | const _excluded$14 = ["className", "cssModule", "active", "tag"];
|
985 | const propTypes$1a = {
|
986 | tag: tagPropType,
|
987 | active: PropTypes.bool,
|
988 | className: PropTypes.string,
|
989 | cssModule: PropTypes.object
|
990 | };
|
991 | const defaultProps$18 = {
|
992 | tag: 'li'
|
993 | };
|
994 |
|
995 | const BreadcrumbItem = props => {
|
996 | const {
|
997 | className,
|
998 | cssModule,
|
999 | active,
|
1000 | tag: Tag
|
1001 | } = props,
|
1002 | attributes = _objectWithoutProperties(props, _excluded$14);
|
1003 |
|
1004 | const classes = mapToCssModules(classNames(className, active ? 'active' : false, 'breadcrumb-item'), cssModule);
|
1005 | return React.createElement(Tag, _extends({}, attributes, {
|
1006 | className: classes,
|
1007 | "aria-current": active ? 'page' : undefined
|
1008 | }));
|
1009 | };
|
1010 |
|
1011 | BreadcrumbItem.propTypes = propTypes$1a;
|
1012 | BreadcrumbItem.defaultProps = defaultProps$18;
|
1013 | var BreadcrumbItem$1 = BreadcrumbItem;
|
1014 |
|
1015 | const _excluded$13 = ["className", "cssModule", "variant", "innerRef"];
|
1016 | const propTypes$19 = {
|
1017 | active: PropTypes.bool,
|
1018 | 'aria-label': PropTypes.string,
|
1019 | onClick: PropTypes.func,
|
1020 | variant: PropTypes.oneOf(['white'])
|
1021 | };
|
1022 | const defaultProps$17 = {
|
1023 | 'aria-label': 'close'
|
1024 | };
|
1025 |
|
1026 | const CloseButton = props => {
|
1027 | const {
|
1028 | className,
|
1029 | cssModule,
|
1030 | variant,
|
1031 | innerRef
|
1032 | } = props,
|
1033 | attributes = _objectWithoutProperties(props, _excluded$13);
|
1034 |
|
1035 | const classes = mapToCssModules(classNames(className, 'btn-close', variant && `btn-close-${variant}`));
|
1036 | return React.createElement("button", _extends({
|
1037 | ref: innerRef,
|
1038 | type: "button",
|
1039 | className: classes
|
1040 | }, attributes));
|
1041 | };
|
1042 |
|
1043 | CloseButton.propTypes = propTypes$19;
|
1044 | CloseButton.defaultProps = defaultProps$17;
|
1045 | var CloseButton$1 = CloseButton;
|
1046 |
|
1047 | const _excluded$12 = ["active", "aria-label", "block", "className", "close", "cssModule", "color", "outline", "size", "tag", "innerRef"];
|
1048 | const propTypes$18 = {
|
1049 | active: PropTypes.bool,
|
1050 | 'aria-label': PropTypes.string,
|
1051 | block: PropTypes.bool,
|
1052 | color: PropTypes.string,
|
1053 | disabled: PropTypes.bool,
|
1054 | outline: PropTypes.bool,
|
1055 | tag: tagPropType,
|
1056 | innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),
|
1057 | onClick: PropTypes.func,
|
1058 | size: PropTypes.string,
|
1059 | children: PropTypes.node,
|
1060 | className: PropTypes.string,
|
1061 | cssModule: PropTypes.object,
|
1062 | close: PropTypes.bool
|
1063 | };
|
1064 | const defaultProps$16 = {
|
1065 | color: 'secondary',
|
1066 | tag: 'button'
|
1067 | };
|
1068 |
|
1069 | function Button(props) {
|
1070 | const onClick = useCallback(e => {
|
1071 | if (props.disabled) {
|
1072 | e.preventDefault();
|
1073 | return;
|
1074 | }
|
1075 |
|
1076 | if (props.onClick) {
|
1077 | return props.onClick(e);
|
1078 | }
|
1079 | }, [props.onClick, props.disabled]);
|
1080 |
|
1081 | let {
|
1082 | active,
|
1083 | 'aria-label': ariaLabel,
|
1084 | block,
|
1085 | className,
|
1086 | close,
|
1087 | cssModule,
|
1088 | color,
|
1089 | outline,
|
1090 | size,
|
1091 | tag: Tag,
|
1092 | innerRef
|
1093 | } = props,
|
1094 | attributes = _objectWithoutProperties(props, _excluded$12);
|
1095 |
|
1096 | if (close) {
|
1097 | return React.createElement(CloseButton$1, attributes);
|
1098 | }
|
1099 |
|
1100 | const btnOutlineColor = `btn${outline ? '-outline' : ''}-${color}`;
|
1101 | const classes = mapToCssModules(classNames(className, 'btn', btnOutlineColor, size ? `btn-${size}` : false, block ? 'd-block w-100' : false, {
|
1102 | active,
|
1103 | disabled: props.disabled
|
1104 | }), cssModule);
|
1105 |
|
1106 | if (attributes.href && Tag === 'button') {
|
1107 | Tag = 'a';
|
1108 | }
|
1109 |
|
1110 | return React.createElement(Tag, _extends({
|
1111 | type: Tag === 'button' && attributes.onClick ? 'button' : undefined
|
1112 | }, attributes, {
|
1113 | className: classes,
|
1114 | ref: innerRef,
|
1115 | onClick: onClick,
|
1116 | "aria-label": ariaLabel
|
1117 | }));
|
1118 | }
|
1119 |
|
1120 | Button.propTypes = propTypes$18;
|
1121 | Button.defaultProps = defaultProps$16;
|
1122 |
|
1123 | const _excluded$11 = ["className"];
|
1124 | const propTypes$17 = {
|
1125 | onClick: PropTypes.func,
|
1126 | onBlur: PropTypes.func,
|
1127 | onFocus: PropTypes.func,
|
1128 | defaultValue: PropTypes.bool
|
1129 | };
|
1130 | const defaultProps$15 = {
|
1131 | defaultValue: false
|
1132 | };
|
1133 |
|
1134 | class ButtonToggle extends React.Component {
|
1135 | constructor(props) {
|
1136 | super(props);
|
1137 | this.state = {
|
1138 | toggled: props.defaultValue,
|
1139 | focus: false
|
1140 | };
|
1141 | this.onBlur = this.onBlur.bind(this);
|
1142 | this.onFocus = this.onFocus.bind(this);
|
1143 | this.onClick = this.onClick.bind(this);
|
1144 | }
|
1145 |
|
1146 | onBlur(e) {
|
1147 | if (this.props.onBlur) {
|
1148 | this.props.onBlur(e);
|
1149 | }
|
1150 |
|
1151 | this.setState({
|
1152 | focus: false
|
1153 | });
|
1154 | }
|
1155 |
|
1156 | onFocus(e) {
|
1157 | if (this.props.onFocus) {
|
1158 | this.props.onFocus(e);
|
1159 | }
|
1160 |
|
1161 | this.setState({
|
1162 | focus: true
|
1163 | });
|
1164 | }
|
1165 |
|
1166 | onClick(e) {
|
1167 | if (this.props.onClick) {
|
1168 | this.props.onClick(e);
|
1169 | }
|
1170 |
|
1171 | this.setState(({
|
1172 | toggled
|
1173 | }) => ({
|
1174 | toggled: !toggled
|
1175 | }));
|
1176 | }
|
1177 |
|
1178 | render() {
|
1179 | const _this$props = this.props,
|
1180 | {
|
1181 | className
|
1182 | } = _this$props,
|
1183 | attributes = _objectWithoutProperties(_this$props, _excluded$11);
|
1184 |
|
1185 | const classes = mapToCssModules(classNames(className, {
|
1186 | focus: this.state.focus
|
1187 | }), this.props.cssModule);
|
1188 | return React.createElement(Button, _extends({
|
1189 | active: this.state.toggled,
|
1190 | onBlur: this.onBlur,
|
1191 | onFocus: this.onFocus,
|
1192 | onClick: this.onClick,
|
1193 | className: classes
|
1194 | }, attributes));
|
1195 | }
|
1196 |
|
1197 | }
|
1198 |
|
1199 | ButtonToggle.propTypes = propTypes$17;
|
1200 | ButtonToggle.defaultProps = defaultProps$15;
|
1201 | var ButtonToggle$1 = ButtonToggle;
|
1202 |
|
1203 |
|
1204 |
|
1205 |
|
1206 |
|
1207 |
|
1208 |
|
1209 |
|
1210 |
|
1211 |
|
1212 |
|
1213 |
|
1214 | const DropdownContext = React.createContext({});
|
1215 |
|
1216 | const _excluded$10 = ["className", "cssModule", "direction", "isOpen", "group", "size", "nav", "setActiveFromChild", "active", "tag", "menuRole"];
|
1217 | const propTypes$16 = {
|
1218 | a11y: PropTypes.bool,
|
1219 | disabled: PropTypes.bool,
|
1220 | direction: PropTypes.oneOf(['up', 'down', 'start', 'end', 'left', 'right']),
|
1221 | group: PropTypes.bool,
|
1222 | isOpen: PropTypes.bool,
|
1223 | nav: PropTypes.bool,
|
1224 | active: PropTypes.bool,
|
1225 | size: PropTypes.string,
|
1226 | tag: tagPropType,
|
1227 | toggle: PropTypes.func,
|
1228 | children: PropTypes.node,
|
1229 | className: PropTypes.string,
|
1230 | cssModule: PropTypes.object,
|
1231 | inNavbar: PropTypes.bool,
|
1232 | setActiveFromChild: PropTypes.bool,
|
1233 | menuRole: PropTypes.oneOf(['listbox', 'menu'])
|
1234 | };
|
1235 | const defaultProps$14 = {
|
1236 | a11y: true,
|
1237 | isOpen: false,
|
1238 | direction: 'down',
|
1239 | nav: false,
|
1240 | active: false,
|
1241 | inNavbar: false,
|
1242 | setActiveFromChild: false
|
1243 | };
|
1244 | const preventDefaultKeys = [keyCodes.space, keyCodes.enter, keyCodes.up, keyCodes.down, keyCodes.end, keyCodes.home];
|
1245 |
|
1246 | class Dropdown extends React.Component {
|
1247 | constructor(props) {
|
1248 | super(props);
|
1249 | this.addEvents = this.addEvents.bind(this);
|
1250 | this.handleDocumentClick = this.handleDocumentClick.bind(this);
|
1251 | this.handleKeyDown = this.handleKeyDown.bind(this);
|
1252 | this.removeEvents = this.removeEvents.bind(this);
|
1253 | this.toggle = this.toggle.bind(this);
|
1254 | this.handleMenuRef = this.handleMenuRef.bind(this);
|
1255 | this.containerRef = React.createRef();
|
1256 | this.menuRef = React.createRef();
|
1257 | }
|
1258 |
|
1259 | handleMenuRef(menuRef) {
|
1260 | this.menuRef.current = menuRef;
|
1261 | }
|
1262 |
|
1263 | getContextValue() {
|
1264 | return {
|
1265 | toggle: this.toggle,
|
1266 | isOpen: this.props.isOpen,
|
1267 | direction: this.props.direction === 'down' && this.props.dropup ? 'up' : this.props.direction,
|
1268 | inNavbar: this.props.inNavbar,
|
1269 | disabled: this.props.disabled,
|
1270 |
|
1271 |
|
1272 | onMenuRef: this.handleMenuRef,
|
1273 | menuRole: this.props.menuRole
|
1274 | };
|
1275 | }
|
1276 |
|
1277 | componentDidMount() {
|
1278 | this.handleProps();
|
1279 | }
|
1280 |
|
1281 | componentDidUpdate(prevProps) {
|
1282 | if (this.props.isOpen !== prevProps.isOpen) {
|
1283 | this.handleProps();
|
1284 | }
|
1285 | }
|
1286 |
|
1287 | componentWillUnmount() {
|
1288 | this.removeEvents();
|
1289 | }
|
1290 |
|
1291 | getContainer() {
|
1292 | return this.containerRef.current;
|
1293 | }
|
1294 |
|
1295 | getMenu() {
|
1296 | return this.menuRef.current;
|
1297 | }
|
1298 |
|
1299 | getMenuCtrl() {
|
1300 | if (this._$menuCtrl) return this._$menuCtrl;
|
1301 | this._$menuCtrl = this.getContainer().querySelector('[aria-expanded]');
|
1302 | return this._$menuCtrl;
|
1303 | }
|
1304 |
|
1305 | getItemType() {
|
1306 | if (this.context.menuRole === 'listbox') {
|
1307 | return 'option';
|
1308 | }
|
1309 |
|
1310 | return 'menuitem';
|
1311 | }
|
1312 |
|
1313 | getMenuItems() {
|
1314 |
|
1315 |
|
1316 |
|
1317 | const menuContainer = this.getMenu() || this.getContainer();
|
1318 | return [].slice.call(menuContainer.querySelectorAll(`[role="${this.getItemType()}"]`));
|
1319 | }
|
1320 |
|
1321 | addEvents() {
|
1322 | ['click', 'touchstart', 'keyup'].forEach(event => document.addEventListener(event, this.handleDocumentClick, true));
|
1323 | }
|
1324 |
|
1325 | removeEvents() {
|
1326 | ['click', 'touchstart', 'keyup'].forEach(event => document.removeEventListener(event, this.handleDocumentClick, true));
|
1327 | }
|
1328 |
|
1329 | handleDocumentClick(e) {
|
1330 | if (e && (e.which === 3 || e.type === 'keyup' && e.which !== keyCodes.tab)) return;
|
1331 | const container = this.getContainer();
|
1332 | const menu = this.getMenu();
|
1333 | const clickIsInContainer = container.contains(e.target) && container !== e.target;
|
1334 | const clickIsInInput = container.classList.contains('input-group') && container.classList.contains('dropdown') && e.target.tagName === 'INPUT';
|
1335 | const clickIsInMenu = menu && menu.contains(e.target) && menu !== e.target;
|
1336 |
|
1337 | if ((clickIsInContainer && !clickIsInInput || clickIsInMenu) && (e.type !== 'keyup' || e.which === keyCodes.tab)) {
|
1338 | return;
|
1339 | }
|
1340 |
|
1341 | this.toggle(e);
|
1342 | }
|
1343 |
|
1344 | handleKeyDown(e) {
|
1345 | const isTargetMenuItem = e.target.getAttribute('role') === 'menuitem' || e.target.getAttribute('role') === 'option';
|
1346 | const isTargetMenuCtrl = this.getMenuCtrl() === e.target;
|
1347 | const isTab = keyCodes.tab === e.which;
|
1348 |
|
1349 | if (/input|textarea/i.test(e.target.tagName) || isTab && !this.props.a11y || isTab && !(isTargetMenuItem || isTargetMenuCtrl)) {
|
1350 | return;
|
1351 | }
|
1352 |
|
1353 | if (preventDefaultKeys.indexOf(e.which) !== -1 || e.which >= 48 && e.which <= 90) {
|
1354 | e.preventDefault();
|
1355 | }
|
1356 |
|
1357 | if (this.props.disabled) return;
|
1358 |
|
1359 | if (isTargetMenuCtrl) {
|
1360 | if ([keyCodes.space, keyCodes.enter, keyCodes.up, keyCodes.down].indexOf(e.which) > -1) {
|
1361 |
|
1362 | if (!this.props.isOpen) {
|
1363 | this.toggle(e);
|
1364 | }
|
1365 |
|
1366 | setTimeout(() => this.getMenuItems()[0].focus());
|
1367 | } else if (this.props.isOpen && isTab) {
|
1368 |
|
1369 |
|
1370 |
|
1371 | e.preventDefault();
|
1372 | this.getMenuItems()[0].focus();
|
1373 | } else if (this.props.isOpen && e.which === keyCodes.esc) {
|
1374 | this.toggle(e);
|
1375 | }
|
1376 | }
|
1377 |
|
1378 | if (this.props.isOpen && isTargetMenuItem) {
|
1379 | if ([keyCodes.tab, keyCodes.esc].indexOf(e.which) > -1) {
|
1380 | this.toggle(e);
|
1381 | this.getMenuCtrl().focus();
|
1382 | } else if ([keyCodes.space, keyCodes.enter].indexOf(e.which) > -1) {
|
1383 | e.target.click();
|
1384 | this.getMenuCtrl().focus();
|
1385 | } else if ([keyCodes.down, keyCodes.up].indexOf(e.which) > -1 || [keyCodes.n, keyCodes.p].indexOf(e.which) > -1 && e.ctrlKey) {
|
1386 | const $menuitems = this.getMenuItems();
|
1387 | let index = $menuitems.indexOf(e.target);
|
1388 |
|
1389 | if (keyCodes.up === e.which || keyCodes.p === e.which && e.ctrlKey) {
|
1390 | index = index !== 0 ? index - 1 : $menuitems.length - 1;
|
1391 | } else if (keyCodes.down === e.which || keyCodes.n === e.which && e.ctrlKey) {
|
1392 | index = index === $menuitems.length - 1 ? 0 : index + 1;
|
1393 | }
|
1394 |
|
1395 | $menuitems[index].focus();
|
1396 | } else if (keyCodes.end === e.which) {
|
1397 | const $menuitems = this.getMenuItems();
|
1398 | $menuitems[$menuitems.length - 1].focus();
|
1399 | } else if (keyCodes.home === e.which) {
|
1400 | const $menuitems = this.getMenuItems();
|
1401 | $menuitems[0].focus();
|
1402 | } else if (e.which >= 48 && e.which <= 90) {
|
1403 | const $menuitems = this.getMenuItems();
|
1404 | const charPressed = String.fromCharCode(e.which).toLowerCase();
|
1405 |
|
1406 | for (let i = 0; i < $menuitems.length; i += 1) {
|
1407 | const firstLetter = $menuitems[i].textContent && $menuitems[i].textContent[0].toLowerCase();
|
1408 |
|
1409 | if (firstLetter === charPressed) {
|
1410 | $menuitems[i].focus();
|
1411 | break;
|
1412 | }
|
1413 | }
|
1414 | }
|
1415 | }
|
1416 | }
|
1417 |
|
1418 | handleProps() {
|
1419 | if (this.props.isOpen) {
|
1420 | this.addEvents();
|
1421 | } else {
|
1422 | this.removeEvents();
|
1423 | }
|
1424 | }
|
1425 |
|
1426 | toggle(e) {
|
1427 | if (this.props.disabled) {
|
1428 | return e && e.preventDefault();
|
1429 | }
|
1430 |
|
1431 | return this.props.toggle(e);
|
1432 | }
|
1433 |
|
1434 | render() {
|
1435 | const _omit = omit(this.props, ['toggle', 'disabled', 'inNavbar', 'a11y']),
|
1436 | {
|
1437 | className,
|
1438 | cssModule,
|
1439 | direction,
|
1440 | isOpen,
|
1441 | group,
|
1442 | size,
|
1443 | nav,
|
1444 | setActiveFromChild,
|
1445 | active,
|
1446 | tag,
|
1447 | menuRole
|
1448 | } = _omit,
|
1449 | attrs = _objectWithoutProperties(_omit, _excluded$10);
|
1450 |
|
1451 | const Tag = tag || (nav ? 'li' : 'div');
|
1452 | let subItemIsActive = false;
|
1453 |
|
1454 | if (setActiveFromChild) {
|
1455 | React.Children.map(this.props.children[1].props.children, dropdownItem => {
|
1456 | if (dropdownItem && dropdownItem.props.active) subItemIsActive = true;
|
1457 | });
|
1458 | }
|
1459 |
|
1460 | const classes = mapToCssModules(classNames(className, nav && active ? 'active' : false, setActiveFromChild && subItemIsActive ? 'active' : false, {
|
1461 | 'btn-group': group,
|
1462 | [`btn-group-${size}`]: !!size,
|
1463 | dropdown: !group,
|
1464 | dropup: direction === 'up',
|
1465 | dropstart: direction === 'start' || direction === 'left',
|
1466 | dropend: direction === 'end' || direction === 'right',
|
1467 | show: isOpen,
|
1468 | 'nav-item': nav
|
1469 | }), cssModule);
|
1470 | return React.createElement(DropdownContext.Provider, {
|
1471 | value: this.getContextValue()
|
1472 | }, React.createElement(Manager, null, React.createElement(Tag, _extends({}, attrs, {
|
1473 | [typeof Tag === 'string' ? 'ref' : 'innerRef']: this.containerRef,
|
1474 | onKeyDown: this.handleKeyDown,
|
1475 | className: classes
|
1476 | }))));
|
1477 | }
|
1478 |
|
1479 | }
|
1480 |
|
1481 | Dropdown.propTypes = propTypes$16;
|
1482 | Dropdown.defaultProps = defaultProps$14;
|
1483 | var Dropdown$1 = Dropdown;
|
1484 |
|
1485 | const propTypes$15 = {
|
1486 | children: PropTypes.node
|
1487 | };
|
1488 |
|
1489 | const ButtonDropdown = props => {
|
1490 | return React.createElement(Dropdown$1, _extends({
|
1491 | group: true
|
1492 | }, props));
|
1493 | };
|
1494 |
|
1495 | ButtonDropdown.propTypes = propTypes$15;
|
1496 | var ButtonDropdown$1 = ButtonDropdown;
|
1497 |
|
1498 | const _excluded$$ = ["className", "cssModule", "size", "vertical", "tag"];
|
1499 | const propTypes$14 = {
|
1500 | tag: tagPropType,
|
1501 | 'aria-label': PropTypes.string,
|
1502 | className: PropTypes.string,
|
1503 | cssModule: PropTypes.object,
|
1504 | role: PropTypes.string,
|
1505 | size: PropTypes.string,
|
1506 | vertical: PropTypes.bool
|
1507 | };
|
1508 | const defaultProps$13 = {
|
1509 | tag: 'div',
|
1510 | role: 'group'
|
1511 | };
|
1512 |
|
1513 | const ButtonGroup = props => {
|
1514 | const {
|
1515 | className,
|
1516 | cssModule,
|
1517 | size,
|
1518 | vertical,
|
1519 | tag: Tag
|
1520 | } = props,
|
1521 | attributes = _objectWithoutProperties(props, _excluded$$);
|
1522 |
|
1523 | const classes = mapToCssModules(classNames(className, size ? 'btn-group-' + size : false, vertical ? 'btn-group-vertical' : 'btn-group'), cssModule);
|
1524 | return React.createElement(Tag, _extends({}, attributes, {
|
1525 | className: classes
|
1526 | }));
|
1527 | };
|
1528 |
|
1529 | ButtonGroup.propTypes = propTypes$14;
|
1530 | ButtonGroup.defaultProps = defaultProps$13;
|
1531 | var ButtonGroup$1 = ButtonGroup;
|
1532 |
|
1533 | const _excluded$_ = ["className", "cssModule", "tag"];
|
1534 | const propTypes$13 = {
|
1535 | tag: tagPropType,
|
1536 | 'aria-label': PropTypes.string,
|
1537 | className: PropTypes.string,
|
1538 | cssModule: PropTypes.object,
|
1539 | role: PropTypes.string
|
1540 | };
|
1541 | const defaultProps$12 = {
|
1542 | tag: 'div',
|
1543 | role: 'toolbar'
|
1544 | };
|
1545 |
|
1546 | const ButtonToolbar = props => {
|
1547 | const {
|
1548 | className,
|
1549 | cssModule,
|
1550 | tag: Tag
|
1551 | } = props,
|
1552 | attributes = _objectWithoutProperties(props, _excluded$_);
|
1553 |
|
1554 | const classes = mapToCssModules(classNames(className, 'btn-toolbar'), cssModule);
|
1555 | return React.createElement(Tag, _extends({}, attributes, {
|
1556 | className: classes
|
1557 | }));
|
1558 | };
|
1559 |
|
1560 | ButtonToolbar.propTypes = propTypes$13;
|
1561 | ButtonToolbar.defaultProps = defaultProps$12;
|
1562 | var ButtonToolbar$1 = ButtonToolbar;
|
1563 |
|
1564 | const _excluded$Z = ["className", "cssModule", "divider", "tag", "header", "active", "text"];
|
1565 | const propTypes$12 = {
|
1566 | children: PropTypes.node,
|
1567 | active: PropTypes.bool,
|
1568 | disabled: PropTypes.bool,
|
1569 | divider: PropTypes.bool,
|
1570 | tag: tagPropType,
|
1571 | header: PropTypes.bool,
|
1572 | onClick: PropTypes.func,
|
1573 | className: PropTypes.string,
|
1574 | cssModule: PropTypes.object,
|
1575 | toggle: PropTypes.bool,
|
1576 | text: PropTypes.bool
|
1577 | };
|
1578 | const defaultProps$11 = {
|
1579 | tag: 'button',
|
1580 | toggle: true
|
1581 | };
|
1582 |
|
1583 | class DropdownItem extends React.Component {
|
1584 | constructor(props) {
|
1585 | super(props);
|
1586 | this.onClick = this.onClick.bind(this);
|
1587 | this.getTabIndex = this.getTabIndex.bind(this);
|
1588 | }
|
1589 |
|
1590 | getRole() {
|
1591 | if (this.context.menuRole === 'listbox') {
|
1592 | return 'option';
|
1593 | }
|
1594 |
|
1595 | return 'menuitem';
|
1596 | }
|
1597 |
|
1598 | onClick(e) {
|
1599 | const {
|
1600 | disabled,
|
1601 | header,
|
1602 | divider,
|
1603 | text
|
1604 | } = this.props;
|
1605 |
|
1606 | if (disabled || header || divider || text) {
|
1607 | e.preventDefault();
|
1608 | return;
|
1609 | }
|
1610 |
|
1611 | if (this.props.onClick) {
|
1612 | this.props.onClick(e);
|
1613 | }
|
1614 |
|
1615 | if (this.props.toggle) {
|
1616 | this.context.toggle(e);
|
1617 | }
|
1618 | }
|
1619 |
|
1620 | getTabIndex() {
|
1621 | const {
|
1622 | disabled,
|
1623 | header,
|
1624 | divider,
|
1625 | text
|
1626 | } = this.props;
|
1627 |
|
1628 | if (disabled || header || divider || text) {
|
1629 | return '-1';
|
1630 | }
|
1631 |
|
1632 | return '0';
|
1633 | }
|
1634 |
|
1635 | render() {
|
1636 | const tabIndex = this.getTabIndex();
|
1637 | const role = tabIndex > -1 ? this.getRole() : undefined;
|
1638 |
|
1639 | let _omit = omit(this.props, ['toggle']),
|
1640 | {
|
1641 | className,
|
1642 | cssModule,
|
1643 | divider,
|
1644 | tag: Tag,
|
1645 | header,
|
1646 | active,
|
1647 | text
|
1648 | } = _omit,
|
1649 | props = _objectWithoutProperties(_omit, _excluded$Z);
|
1650 |
|
1651 | const classes = mapToCssModules(classNames(className, {
|
1652 | disabled: props.disabled,
|
1653 | 'dropdown-item': !divider && !header && !text,
|
1654 | active: active,
|
1655 | 'dropdown-header': header,
|
1656 | 'dropdown-divider': divider,
|
1657 | 'dropdown-item-text': text
|
1658 | }), cssModule);
|
1659 |
|
1660 | if (Tag === 'button') {
|
1661 | if (header) {
|
1662 | Tag = 'h6';
|
1663 | } else if (divider) {
|
1664 | Tag = 'div';
|
1665 | } else if (props.href) {
|
1666 | Tag = 'a';
|
1667 | } else if (text) {
|
1668 | Tag = 'span';
|
1669 | }
|
1670 | }
|
1671 |
|
1672 | return React.createElement(Tag, _extends({
|
1673 | type: Tag === 'button' && (props.onClick || this.props.toggle) ? 'button' : undefined
|
1674 | }, props, {
|
1675 | tabIndex: tabIndex,
|
1676 | role: role,
|
1677 | className: classes,
|
1678 | onClick: this.onClick
|
1679 | }));
|
1680 | }
|
1681 |
|
1682 | }
|
1683 |
|
1684 | DropdownItem.propTypes = propTypes$12;
|
1685 | DropdownItem.defaultProps = defaultProps$11;
|
1686 | DropdownItem.contextType = DropdownContext;
|
1687 | var DropdownItem$1 = DropdownItem;
|
1688 |
|
1689 | const _excluded$Y = ["className", "cssModule", "dark", "end", "right", "tag", "flip", "modifiers", "persist", "strategy", "container", "updateOnSelect"];
|
1690 | const propTypes$11 = {
|
1691 | tag: tagPropType,
|
1692 | children: PropTypes.node.isRequired,
|
1693 | dark: PropTypes.bool,
|
1694 | end: PropTypes.bool,
|
1695 | flip: PropTypes.bool,
|
1696 | modifiers: PropTypes.array,
|
1697 | className: PropTypes.string,
|
1698 | cssModule: PropTypes.object,
|
1699 | persist: PropTypes.bool,
|
1700 | strategy: PropTypes.string,
|
1701 | container: targetPropType,
|
1702 |
|
1703 |
|
1704 | updateOnSelect: PropTypes.bool,
|
1705 | right: deprecated(PropTypes.bool, 'Please use "end" instead.')
|
1706 | };
|
1707 | const defaultProps$10 = {
|
1708 | tag: 'div',
|
1709 | flip: true,
|
1710 | modifiers: []
|
1711 | };
|
1712 | const directionPositionMap = {
|
1713 | up: 'top',
|
1714 | left: 'left',
|
1715 | right: 'right',
|
1716 | start: 'left',
|
1717 | end: 'right',
|
1718 | down: 'bottom'
|
1719 | };
|
1720 |
|
1721 | class DropdownMenu extends React.Component {
|
1722 | getRole() {
|
1723 | if (this.context.menuRole === 'listbox') {
|
1724 | return 'listbox';
|
1725 | }
|
1726 |
|
1727 | return 'menu';
|
1728 | }
|
1729 |
|
1730 | render() {
|
1731 | const _this$props = this.props,
|
1732 | {
|
1733 | className,
|
1734 | cssModule,
|
1735 | dark,
|
1736 | end,
|
1737 | right,
|
1738 | tag,
|
1739 | flip,
|
1740 | modifiers,
|
1741 | persist,
|
1742 | strategy,
|
1743 | container,
|
1744 | updateOnSelect
|
1745 | } = _this$props,
|
1746 | attrs = _objectWithoutProperties(_this$props, _excluded$Y);
|
1747 |
|
1748 | const classes = mapToCssModules(classNames(className, 'dropdown-menu', {
|
1749 | 'dropdown-menu-dark': dark,
|
1750 | 'dropdown-menu-end': end || right,
|
1751 | show: this.context.isOpen
|
1752 | }), cssModule);
|
1753 | const Tag = tag;
|
1754 |
|
1755 | if (persist || this.context.isOpen && !this.context.inNavbar) {
|
1756 | const position1 = directionPositionMap[this.context.direction] || 'bottom';
|
1757 | const position2 = end || right ? 'end' : 'start';
|
1758 | const poperPlacement = `${position1}-${position2}`;
|
1759 | const poperModifiers = [...modifiers, {
|
1760 | name: 'flip',
|
1761 | enabled: !!flip
|
1762 | }];
|
1763 | const popper = React.createElement(Popper, {
|
1764 | placement: poperPlacement,
|
1765 | modifiers: poperModifiers,
|
1766 | strategy: strategy
|
1767 | }, ({
|
1768 | ref,
|
1769 | style,
|
1770 | placement,
|
1771 | update
|
1772 | }) => {
|
1773 | let combinedStyle = _objectSpread2(_objectSpread2({}, this.props.style), style);
|
1774 |
|
1775 | const handleRef = tagRef => {
|
1776 |
|
1777 | ref(tagRef);
|
1778 |
|
1779 |
|
1780 | const {
|
1781 | onMenuRef
|
1782 | } = this.context;
|
1783 | if (onMenuRef) onMenuRef(tagRef);
|
1784 | };
|
1785 |
|
1786 | return React.createElement(Tag, _extends({
|
1787 | tabIndex: "-1",
|
1788 | role: this.getRole(),
|
1789 | ref: handleRef
|
1790 | }, attrs, {
|
1791 | style: combinedStyle,
|
1792 | "aria-hidden": !this.context.isOpen,
|
1793 | className: classes,
|
1794 | "data-popper-placement": placement,
|
1795 | onClick: () => updateOnSelect && update()
|
1796 | }));
|
1797 | });
|
1798 |
|
1799 | if (container) {
|
1800 | return ReactDOM.createPortal(popper, getTarget(container));
|
1801 | } else {
|
1802 | return popper;
|
1803 | }
|
1804 | }
|
1805 |
|
1806 | return React.createElement(Tag, _extends({
|
1807 | tabIndex: "-1",
|
1808 | role: this.getRole()
|
1809 | }, attrs, {
|
1810 | "aria-hidden": !this.context.isOpen,
|
1811 | className: classes,
|
1812 | "data-popper-placement": attrs.placement
|
1813 | }));
|
1814 | }
|
1815 |
|
1816 | }
|
1817 | DropdownMenu.propTypes = propTypes$11;
|
1818 | DropdownMenu.defaultProps = defaultProps$10;
|
1819 | DropdownMenu.contextType = DropdownContext;
|
1820 | var DropdownMenu$1 = DropdownMenu;
|
1821 |
|
1822 | const _excluded$X = ["className", "color", "cssModule", "caret", "split", "nav", "tag", "innerRef"];
|
1823 | const propTypes$10 = {
|
1824 | caret: PropTypes.bool,
|
1825 | color: PropTypes.string,
|
1826 | children: PropTypes.node,
|
1827 | className: PropTypes.string,
|
1828 | cssModule: PropTypes.object,
|
1829 | disabled: PropTypes.bool,
|
1830 | onClick: PropTypes.func,
|
1831 | 'aria-haspopup': PropTypes.bool,
|
1832 | split: PropTypes.bool,
|
1833 | tag: tagPropType,
|
1834 | nav: PropTypes.bool
|
1835 | };
|
1836 | const defaultProps$$ = {
|
1837 | color: 'secondary',
|
1838 | 'aria-haspopup': true
|
1839 | };
|
1840 |
|
1841 | class DropdownToggle extends React.Component {
|
1842 | constructor(props) {
|
1843 | super(props);
|
1844 | this.onClick = this.onClick.bind(this);
|
1845 | }
|
1846 |
|
1847 | onClick(e) {
|
1848 | if (this.props.disabled || this.context.disabled) {
|
1849 | e.preventDefault();
|
1850 | return;
|
1851 | }
|
1852 |
|
1853 | if (this.props.nav && !this.props.tag) {
|
1854 | e.preventDefault();
|
1855 | }
|
1856 |
|
1857 | if (this.props.onClick) {
|
1858 | this.props.onClick(e);
|
1859 | }
|
1860 |
|
1861 | this.context.toggle(e);
|
1862 | }
|
1863 |
|
1864 | getRole() {
|
1865 | return this.context.menuRole || this.props['aria-haspopup'];
|
1866 | }
|
1867 |
|
1868 | render() {
|
1869 | const _this$props = this.props,
|
1870 | {
|
1871 | className,
|
1872 | color,
|
1873 | cssModule,
|
1874 | caret,
|
1875 | split,
|
1876 | nav,
|
1877 | tag,
|
1878 | innerRef
|
1879 | } = _this$props,
|
1880 | props = _objectWithoutProperties(_this$props, _excluded$X);
|
1881 |
|
1882 | const ariaLabel = props['aria-label'] || 'Toggle Dropdown';
|
1883 | const classes = mapToCssModules(classNames(className, {
|
1884 | 'dropdown-toggle': caret || split,
|
1885 | 'dropdown-toggle-split': split,
|
1886 | 'nav-link': nav
|
1887 | }), cssModule);
|
1888 | const children = typeof props.children !== 'undefined' ? props.children : React.createElement("span", {
|
1889 | className: "visually-hidden"
|
1890 | }, ariaLabel);
|
1891 | let Tag;
|
1892 |
|
1893 | if (nav && !tag) {
|
1894 | Tag = 'a';
|
1895 | props.href = '#';
|
1896 | } else if (!tag) {
|
1897 | Tag = Button;
|
1898 | props.color = color;
|
1899 | props.cssModule = cssModule;
|
1900 | } else {
|
1901 | Tag = tag;
|
1902 | }
|
1903 |
|
1904 | if (this.context.inNavbar) {
|
1905 | return React.createElement(Tag, _extends({}, props, {
|
1906 | className: classes,
|
1907 | onClick: this.onClick,
|
1908 | "aria-expanded": this.context.isOpen,
|
1909 | "aria-haspopup": this.getRole(),
|
1910 | children: children
|
1911 | }));
|
1912 | }
|
1913 |
|
1914 | return React.createElement(Reference, {
|
1915 | innerRef: innerRef
|
1916 | }, ({
|
1917 | ref
|
1918 | }) => React.createElement(Tag, _extends({}, props, {
|
1919 | [typeof Tag === 'string' ? 'ref' : 'innerRef']: ref,
|
1920 | className: classes,
|
1921 | onClick: this.onClick,
|
1922 | "aria-expanded": this.context.isOpen,
|
1923 | "aria-haspopup": this.getRole(),
|
1924 | children: children
|
1925 | })));
|
1926 | }
|
1927 |
|
1928 | }
|
1929 |
|
1930 | DropdownToggle.propTypes = propTypes$10;
|
1931 | DropdownToggle.defaultProps = defaultProps$$;
|
1932 | DropdownToggle.contextType = DropdownContext;
|
1933 | var DropdownToggle$1 = DropdownToggle;
|
1934 |
|
1935 | const _excluded$W = ["tag", "baseClass", "baseClassActive", "className", "cssModule", "children", "innerRef"];
|
1936 |
|
1937 | const propTypes$$ = _objectSpread2(_objectSpread2({}, Transition.propTypes), {}, {
|
1938 | children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]),
|
1939 | tag: tagPropType,
|
1940 | baseClass: PropTypes.string,
|
1941 | baseClassActive: PropTypes.string,
|
1942 | className: PropTypes.string,
|
1943 | cssModule: PropTypes.object,
|
1944 | innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.string, PropTypes.func])
|
1945 | });
|
1946 |
|
1947 | const defaultProps$_ = _objectSpread2(_objectSpread2({}, Transition.defaultProps), {}, {
|
1948 | tag: 'div',
|
1949 | baseClass: 'fade',
|
1950 | baseClassActive: 'show',
|
1951 | timeout: TransitionTimeouts.Fade,
|
1952 | appear: true,
|
1953 | enter: true,
|
1954 | exit: true,
|
1955 | in: true
|
1956 | });
|
1957 |
|
1958 | function Fade(props) {
|
1959 | const {
|
1960 | tag: Tag,
|
1961 | baseClass,
|
1962 | baseClassActive,
|
1963 | className,
|
1964 | cssModule,
|
1965 | children,
|
1966 | innerRef
|
1967 | } = props,
|
1968 | otherProps = _objectWithoutProperties(props, _excluded$W);
|
1969 |
|
1970 | const transitionProps = pick(otherProps, TransitionPropTypeKeys);
|
1971 | const childProps = omit(otherProps, TransitionPropTypeKeys);
|
1972 | return React.createElement(Transition, transitionProps, status => {
|
1973 | const isActive = status === 'entered';
|
1974 | const classes = mapToCssModules(classNames(className, baseClass, isActive && baseClassActive), cssModule);
|
1975 | return React.createElement(Tag, _extends({
|
1976 | className: classes
|
1977 | }, childProps, {
|
1978 | ref: innerRef
|
1979 | }), children);
|
1980 | });
|
1981 | }
|
1982 |
|
1983 | Fade.propTypes = propTypes$$;
|
1984 | Fade.defaultProps = defaultProps$_;
|
1985 |
|
1986 |
|
1987 |
|
1988 |
|
1989 |
|
1990 |
|
1991 |
|
1992 |
|
1993 |
|
1994 | const AccordionContext = React.createContext({});
|
1995 |
|
1996 | const _excluded$V = ["flush", "open", "toggle", "className", "cssModule", "tag", "innerRef"];
|
1997 | const propTypes$_ = {
|
1998 | tag: tagPropType,
|
1999 | className: PropTypes.string,
|
2000 | cssModule: PropTypes.object,
|
2001 | innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.string, PropTypes.func]),
|
2002 | children: PropTypes.node,
|
2003 | flush: PropTypes.bool,
|
2004 | open: PropTypes.oneOfType([PropTypes.array, PropTypes.string]).isRequired,
|
2005 | toggle: PropTypes.func.isRequired
|
2006 | };
|
2007 | const defaultProps$Z = {
|
2008 | tag: 'div'
|
2009 | };
|
2010 |
|
2011 | const Accordion = props => {
|
2012 | const {
|
2013 | flush,
|
2014 | open,
|
2015 | toggle,
|
2016 | className,
|
2017 | cssModule,
|
2018 | tag: Tag,
|
2019 | innerRef
|
2020 | } = props,
|
2021 | attributes = _objectWithoutProperties(props, _excluded$V);
|
2022 |
|
2023 | const classes = mapToCssModules(classNames(className, 'accordion', {
|
2024 | 'accordion-flush': flush
|
2025 | }), cssModule);
|
2026 | const accordionContext = useMemo(() => ({
|
2027 | open,
|
2028 | toggle
|
2029 | }));
|
2030 | return React.createElement(AccordionContext.Provider, {
|
2031 | value: accordionContext
|
2032 | }, React.createElement(Tag, _extends({}, attributes, {
|
2033 | className: classes,
|
2034 | ref: innerRef
|
2035 | })));
|
2036 | };
|
2037 |
|
2038 | Accordion.propTypes = propTypes$_;
|
2039 | Accordion.defaultProps = defaultProps$Z;
|
2040 | var Accordion$1 = Accordion;
|
2041 |
|
2042 | const _excluded$U = ["defaultOpen", "stayOpen"];
|
2043 | const propTypes$Z = {
|
2044 | tag: tagPropType,
|
2045 | className: PropTypes.string,
|
2046 | cssModule: PropTypes.object,
|
2047 | innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.string, PropTypes.func]),
|
2048 | children: PropTypes.node,
|
2049 | defaultOpen: PropTypes.oneOfType([PropTypes.array, PropTypes.string]),
|
2050 | stayOpen: PropTypes.bool
|
2051 | };
|
2052 | const defaultProps$Y = {
|
2053 | tag: 'div'
|
2054 | };
|
2055 |
|
2056 | const UncontrolledAccordion = _ref => {
|
2057 | let {
|
2058 | defaultOpen,
|
2059 | stayOpen
|
2060 | } = _ref,
|
2061 | props = _objectWithoutProperties(_ref, _excluded$U);
|
2062 |
|
2063 | const [open, setOpen] = useState(defaultOpen || (stayOpen ? [] : undefined));
|
2064 |
|
2065 | const toggle = id => {
|
2066 | if (stayOpen) {
|
2067 | open.includes(id) ? setOpen(open.filter(accordionId => accordionId !== id)) : setOpen([...open, id]);
|
2068 | } else {
|
2069 | open === id ? setOpen(undefined) : setOpen(id);
|
2070 | }
|
2071 | };
|
2072 |
|
2073 | return React.createElement(Accordion$1, _extends({}, props, {
|
2074 | open: open,
|
2075 | toggle: toggle
|
2076 | }));
|
2077 | };
|
2078 |
|
2079 | UncontrolledAccordion.propTypes = propTypes$Z;
|
2080 | UncontrolledAccordion.defaultProps = defaultProps$Y;
|
2081 | var UncontrolledAccordion$1 = UncontrolledAccordion;
|
2082 |
|
2083 | const _excluded$T = ["className", "cssModule", "tag", "innerRef", "children", "targetId"];
|
2084 | const propTypes$Y = {
|
2085 | tag: tagPropType,
|
2086 | className: PropTypes.string,
|
2087 | cssModule: PropTypes.object,
|
2088 | innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.string, PropTypes.func]),
|
2089 | children: PropTypes.node,
|
2090 | targetId: PropTypes.string.isRequired
|
2091 | };
|
2092 | const defaultProps$X = {
|
2093 | tag: 'h2'
|
2094 | };
|
2095 |
|
2096 | const AccordionHeader = props => {
|
2097 | const {
|
2098 | className,
|
2099 | cssModule,
|
2100 | tag: Tag,
|
2101 | innerRef,
|
2102 | children,
|
2103 | targetId
|
2104 | } = props,
|
2105 | attributes = _objectWithoutProperties(props, _excluded$T);
|
2106 |
|
2107 | const {
|
2108 | open,
|
2109 | toggle
|
2110 | } = useContext(AccordionContext);
|
2111 | const classes = mapToCssModules(classNames(className, 'accordion-header'), cssModule);
|
2112 | const buttonClasses = mapToCssModules(classNames('accordion-button', {
|
2113 | collapsed: !(Array.isArray(open) ? open.includes(targetId) : open === targetId)
|
2114 | }), cssModule);
|
2115 | return React.createElement(Tag, _extends({}, attributes, {
|
2116 | className: classes,
|
2117 | ref: innerRef
|
2118 | }), React.createElement("button", {
|
2119 | type: "button",
|
2120 | className: buttonClasses,
|
2121 | onClick: () => toggle(targetId)
|
2122 | }, children));
|
2123 | };
|
2124 |
|
2125 | AccordionHeader.propTypes = propTypes$Y;
|
2126 | AccordionHeader.defaultProps = defaultProps$X;
|
2127 | var AccordionHeader$1 = AccordionHeader;
|
2128 |
|
2129 | const _excluded$S = ["className", "cssModule", "tag", "innerRef"];
|
2130 | const propTypes$X = {
|
2131 | tag: tagPropType,
|
2132 | className: PropTypes.string,
|
2133 | cssModule: PropTypes.object,
|
2134 | innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.string, PropTypes.func]),
|
2135 | children: PropTypes.node
|
2136 | };
|
2137 | const defaultProps$W = {
|
2138 | tag: 'div'
|
2139 | };
|
2140 |
|
2141 | const AccordionItem = props => {
|
2142 | const {
|
2143 | className,
|
2144 | cssModule,
|
2145 | tag: Tag,
|
2146 | innerRef
|
2147 | } = props,
|
2148 | attributes = _objectWithoutProperties(props, _excluded$S);
|
2149 |
|
2150 | const classes = mapToCssModules(classNames(className, 'accordion-item'), cssModule);
|
2151 | return React.createElement(Tag, _extends({}, attributes, {
|
2152 | className: classes,
|
2153 | ref: innerRef
|
2154 | }));
|
2155 | };
|
2156 |
|
2157 | AccordionItem.propTypes = propTypes$X;
|
2158 | AccordionItem.defaultProps = defaultProps$W;
|
2159 | var AccordionItem$1 = AccordionItem;
|
2160 |
|
2161 | const _excluded$R = ["tag", "horizontal", "isOpen", "className", "navbar", "cssModule", "children", "innerRef"];
|
2162 |
|
2163 | const propTypes$W = _objectSpread2(_objectSpread2({}, Transition.propTypes), {}, {
|
2164 | horizontal: PropTypes.bool,
|
2165 | isOpen: PropTypes.bool,
|
2166 | children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]),
|
2167 | tag: tagPropType,
|
2168 | className: PropTypes.node,
|
2169 | navbar: PropTypes.bool,
|
2170 | cssModule: PropTypes.object,
|
2171 | innerRef: PropTypes.oneOfType([PropTypes.func, PropTypes.string, PropTypes.object])
|
2172 | });
|
2173 |
|
2174 | const defaultProps$V = _objectSpread2(_objectSpread2({}, Transition.defaultProps), {}, {
|
2175 | horizontal: false,
|
2176 | isOpen: false,
|
2177 | appear: false,
|
2178 | enter: true,
|
2179 | exit: true,
|
2180 | tag: 'div',
|
2181 | timeout: TransitionTimeouts.Collapse
|
2182 | });
|
2183 |
|
2184 | const transitionStatusToClassHash = {
|
2185 | [TransitionStatuses.ENTERING]: 'collapsing',
|
2186 | [TransitionStatuses.ENTERED]: 'collapse show',
|
2187 | [TransitionStatuses.EXITING]: 'collapsing',
|
2188 | [TransitionStatuses.EXITED]: 'collapse'
|
2189 | };
|
2190 |
|
2191 | function getTransitionClass(status) {
|
2192 | return transitionStatusToClassHash[status] || 'collapse';
|
2193 | }
|
2194 |
|
2195 | class Collapse extends Component {
|
2196 | constructor(props) {
|
2197 | super(props);
|
2198 | this.state = {
|
2199 | dimension: null
|
2200 | };
|
2201 | ['onEntering', 'onEntered', 'onExit', 'onExiting', 'onExited'].forEach(name => {
|
2202 | this[name] = this[name].bind(this);
|
2203 | });
|
2204 | }
|
2205 |
|
2206 | getDimension(node) {
|
2207 | return this.props.horizontal ? node.scrollWidth : node.scrollHeight;
|
2208 | }
|
2209 |
|
2210 | onEntering(node, isAppearing) {
|
2211 | this.setState({
|
2212 | dimension: this.getDimension(node)
|
2213 | });
|
2214 | this.props.onEntering(node, isAppearing);
|
2215 | }
|
2216 |
|
2217 | onEntered(node, isAppearing) {
|
2218 | this.setState({
|
2219 | dimension: null
|
2220 | });
|
2221 | this.props.onEntered(node, isAppearing);
|
2222 | }
|
2223 |
|
2224 | onExit(node) {
|
2225 | this.setState({
|
2226 | dimension: this.getDimension(node)
|
2227 | });
|
2228 | this.props.onExit(node);
|
2229 | }
|
2230 |
|
2231 | onExiting(node) {
|
2232 |
|
2233 | this.getDimension(node);
|
2234 |
|
2235 |
|
2236 | this.setState({
|
2237 | dimension: 0
|
2238 | });
|
2239 | this.props.onExiting(node);
|
2240 | }
|
2241 |
|
2242 | onExited(node) {
|
2243 | this.setState({
|
2244 | dimension: null
|
2245 | });
|
2246 | this.props.onExited(node);
|
2247 | }
|
2248 |
|
2249 | render() {
|
2250 | const _this$props = this.props,
|
2251 | {
|
2252 | tag: Tag,
|
2253 | horizontal,
|
2254 | isOpen,
|
2255 | className,
|
2256 | navbar,
|
2257 | cssModule,
|
2258 | children,
|
2259 | innerRef
|
2260 | } = _this$props,
|
2261 | otherProps = _objectWithoutProperties(_this$props, _excluded$R);
|
2262 |
|
2263 | const {
|
2264 | dimension
|
2265 | } = this.state;
|
2266 | const transitionProps = pick(otherProps, TransitionPropTypeKeys);
|
2267 | const childProps = omit(otherProps, TransitionPropTypeKeys);
|
2268 | return React.createElement(Transition, _extends({}, transitionProps, {
|
2269 | in: isOpen,
|
2270 | onEntering: this.onEntering,
|
2271 | onEntered: this.onEntered,
|
2272 | onExit: this.onExit,
|
2273 | onExiting: this.onExiting,
|
2274 | onExited: this.onExited
|
2275 | }), status => {
|
2276 | let collapseClass = getTransitionClass(status);
|
2277 | const classes = mapToCssModules(classNames(className, horizontal && 'collapse-horizontal', collapseClass, navbar && 'navbar-collapse'), cssModule);
|
2278 | const style = dimension === null ? null : {
|
2279 | [horizontal ? 'width' : 'height']: dimension
|
2280 | };
|
2281 | return React.createElement(Tag, _extends({}, childProps, {
|
2282 | style: _objectSpread2(_objectSpread2({}, childProps.style), style),
|
2283 | className: classes,
|
2284 | ref: this.props.innerRef
|
2285 | }), children);
|
2286 | });
|
2287 | }
|
2288 |
|
2289 | }
|
2290 |
|
2291 | Collapse.propTypes = propTypes$W;
|
2292 | Collapse.defaultProps = defaultProps$V;
|
2293 | var Collapse$1 = Collapse;
|
2294 |
|
2295 | const _excluded$Q = ["className", "cssModule", "tag", "innerRef", "children", "accordionId"];
|
2296 | const propTypes$V = {
|
2297 | tag: tagPropType,
|
2298 | className: PropTypes.string,
|
2299 | cssModule: PropTypes.object,
|
2300 | innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.string, PropTypes.func]),
|
2301 | children: PropTypes.node,
|
2302 | accordionId: PropTypes.string.isRequired
|
2303 | };
|
2304 | const defaultProps$U = {
|
2305 | tag: 'div'
|
2306 | };
|
2307 |
|
2308 | const AccordionBody = props => {
|
2309 | const {
|
2310 | className,
|
2311 | cssModule,
|
2312 | tag: Tag,
|
2313 | innerRef,
|
2314 | children,
|
2315 | accordionId
|
2316 | } = props,
|
2317 | attributes = _objectWithoutProperties(props, _excluded$Q);
|
2318 |
|
2319 | const {
|
2320 | open
|
2321 | } = useContext(AccordionContext);
|
2322 | const classes = mapToCssModules(classNames(className, 'accordion-collapse'), cssModule);
|
2323 | return React.createElement(Collapse$1, _extends({}, attributes, {
|
2324 | className: classes,
|
2325 | ref: innerRef,
|
2326 | isOpen: Array.isArray(open) ? open.includes(accordionId) : open === accordionId
|
2327 | }), React.createElement(Tag, {
|
2328 | className: "accordion-body"
|
2329 | }, children));
|
2330 | };
|
2331 |
|
2332 | AccordionBody.propTypes = propTypes$V;
|
2333 | AccordionBody.defaultProps = defaultProps$U;
|
2334 | var AccordionBody$1 = AccordionBody;
|
2335 |
|
2336 | const _excluded$P = ["className", "cssModule", "color", "innerRef", "pill", "tag"];
|
2337 | const propTypes$U = {
|
2338 | color: PropTypes.string,
|
2339 | pill: PropTypes.bool,
|
2340 | tag: tagPropType,
|
2341 | innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),
|
2342 | children: PropTypes.node,
|
2343 | className: PropTypes.string,
|
2344 | cssModule: PropTypes.object
|
2345 | };
|
2346 | const defaultProps$T = {
|
2347 | color: 'secondary',
|
2348 | pill: false,
|
2349 | tag: 'span'
|
2350 | };
|
2351 |
|
2352 | const Badge = props => {
|
2353 | let {
|
2354 | className,
|
2355 | cssModule,
|
2356 | color,
|
2357 | innerRef,
|
2358 | pill,
|
2359 | tag: Tag
|
2360 | } = props,
|
2361 | attributes = _objectWithoutProperties(props, _excluded$P);
|
2362 |
|
2363 | const classes = mapToCssModules(classNames(className, 'badge', 'bg-' + color, pill ? 'rounded-pill' : false), cssModule);
|
2364 |
|
2365 | if (attributes.href && Tag === 'span') {
|
2366 | Tag = 'a';
|
2367 | }
|
2368 |
|
2369 | return React.createElement(Tag, _extends({}, attributes, {
|
2370 | className: classes,
|
2371 | ref: innerRef
|
2372 | }));
|
2373 | };
|
2374 |
|
2375 | Badge.propTypes = propTypes$U;
|
2376 | Badge.defaultProps = defaultProps$T;
|
2377 | var Badge$1 = Badge;
|
2378 |
|
2379 | const _excluded$O = ["className", "cssModule", "color", "body", "inverse", "outline", "tag", "innerRef"];
|
2380 | const propTypes$T = {
|
2381 | tag: tagPropType,
|
2382 | inverse: PropTypes.bool,
|
2383 | color: PropTypes.string,
|
2384 | body: PropTypes.bool,
|
2385 | outline: PropTypes.bool,
|
2386 | className: PropTypes.string,
|
2387 | cssModule: PropTypes.object,
|
2388 | innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.string, PropTypes.func])
|
2389 | };
|
2390 | const defaultProps$S = {
|
2391 | tag: 'div'
|
2392 | };
|
2393 |
|
2394 | const Card = props => {
|
2395 | const {
|
2396 | className,
|
2397 | cssModule,
|
2398 | color,
|
2399 | body,
|
2400 | inverse,
|
2401 | outline,
|
2402 | tag: Tag,
|
2403 | innerRef
|
2404 | } = props,
|
2405 | attributes = _objectWithoutProperties(props, _excluded$O);
|
2406 |
|
2407 | const classes = mapToCssModules(classNames(className, 'card', inverse ? 'text-white' : false, body ? 'card-body' : false, color ? `${outline ? 'border' : 'bg'}-${color}` : false), cssModule);
|
2408 | return React.createElement(Tag, _extends({}, attributes, {
|
2409 | className: classes,
|
2410 | ref: innerRef
|
2411 | }));
|
2412 | };
|
2413 |
|
2414 | Card.propTypes = propTypes$T;
|
2415 | Card.defaultProps = defaultProps$S;
|
2416 | var Card$1 = Card;
|
2417 |
|
2418 | const _excluded$N = ["className", "cssModule", "tag"];
|
2419 | const propTypes$S = {
|
2420 | tag: tagPropType,
|
2421 | className: PropTypes.string,
|
2422 | cssModule: PropTypes.object
|
2423 | };
|
2424 | const defaultProps$R = {
|
2425 | tag: 'div'
|
2426 | };
|
2427 |
|
2428 | const CardGroup = props => {
|
2429 | const {
|
2430 | className,
|
2431 | cssModule,
|
2432 | tag: Tag
|
2433 | } = props,
|
2434 | attributes = _objectWithoutProperties(props, _excluded$N);
|
2435 |
|
2436 | const classes = mapToCssModules(classNames(className, 'card-group'), cssModule);
|
2437 | return React.createElement(Tag, _extends({}, attributes, {
|
2438 | className: classes
|
2439 | }));
|
2440 | };
|
2441 |
|
2442 | CardGroup.propTypes = propTypes$S;
|
2443 | CardGroup.defaultProps = defaultProps$R;
|
2444 | var CardGroup$1 = CardGroup;
|
2445 |
|
2446 | const _excluded$M = ["className", "cssModule", "tag"];
|
2447 | const propTypes$R = {
|
2448 | tag: tagPropType,
|
2449 | className: PropTypes.string,
|
2450 | cssModule: PropTypes.object
|
2451 | };
|
2452 | const defaultProps$Q = {
|
2453 | tag: 'div'
|
2454 | };
|
2455 |
|
2456 | const CardDeck = props => {
|
2457 | const {
|
2458 | className,
|
2459 | cssModule,
|
2460 | tag: Tag
|
2461 | } = props,
|
2462 | attributes = _objectWithoutProperties(props, _excluded$M);
|
2463 |
|
2464 | const classes = mapToCssModules(classNames(className, 'card-deck'), cssModule);
|
2465 | return React.createElement(Tag, _extends({}, attributes, {
|
2466 | className: classes
|
2467 | }));
|
2468 | };
|
2469 |
|
2470 | CardDeck.propTypes = propTypes$R;
|
2471 | CardDeck.defaultProps = defaultProps$Q;
|
2472 | var CardDeck$1 = CardDeck;
|
2473 |
|
2474 | const _excluded$L = ["className", "cssModule", "tag"];
|
2475 | const propTypes$Q = {
|
2476 | tag: tagPropType,
|
2477 | className: PropTypes.string,
|
2478 | cssModule: PropTypes.object
|
2479 | };
|
2480 | const defaultProps$P = {
|
2481 | tag: 'div'
|
2482 | };
|
2483 |
|
2484 | const CardColumns = props => {
|
2485 | const {
|
2486 | className,
|
2487 | cssModule,
|
2488 | tag: Tag
|
2489 | } = props,
|
2490 | attributes = _objectWithoutProperties(props, _excluded$L);
|
2491 |
|
2492 | const classes = mapToCssModules(classNames(className, 'card-columns'), cssModule);
|
2493 | return React.createElement(Tag, _extends({}, attributes, {
|
2494 | className: classes
|
2495 | }));
|
2496 | };
|
2497 |
|
2498 | CardColumns.propTypes = propTypes$Q;
|
2499 | CardColumns.defaultProps = defaultProps$P;
|
2500 | var CardColumns$1 = CardColumns;
|
2501 |
|
2502 | const _excluded$K = ["className", "cssModule", "innerRef", "tag"];
|
2503 | const propTypes$P = {
|
2504 | tag: tagPropType,
|
2505 | className: PropTypes.string,
|
2506 | cssModule: PropTypes.object,
|
2507 | innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.string, PropTypes.func])
|
2508 | };
|
2509 | const defaultProps$O = {
|
2510 | tag: 'div'
|
2511 | };
|
2512 |
|
2513 | const CardBody = props => {
|
2514 | const {
|
2515 | className,
|
2516 | cssModule,
|
2517 | innerRef,
|
2518 | tag: Tag
|
2519 | } = props,
|
2520 | attributes = _objectWithoutProperties(props, _excluded$K);
|
2521 |
|
2522 | const classes = mapToCssModules(classNames(className, 'card-body'), cssModule);
|
2523 | return React.createElement(Tag, _extends({}, attributes, {
|
2524 | className: classes,
|
2525 | ref: innerRef
|
2526 | }));
|
2527 | };
|
2528 |
|
2529 | CardBody.propTypes = propTypes$P;
|
2530 | CardBody.defaultProps = defaultProps$O;
|
2531 | var CardBody$1 = CardBody;
|
2532 |
|
2533 | const _excluded$J = ["className", "cssModule", "tag", "innerRef"];
|
2534 | const propTypes$O = {
|
2535 | tag: tagPropType,
|
2536 | innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),
|
2537 | className: PropTypes.string,
|
2538 | cssModule: PropTypes.object
|
2539 | };
|
2540 | const defaultProps$N = {
|
2541 | tag: 'a'
|
2542 | };
|
2543 |
|
2544 | const CardLink = props => {
|
2545 | const {
|
2546 | className,
|
2547 | cssModule,
|
2548 | tag: Tag,
|
2549 | innerRef
|
2550 | } = props,
|
2551 | attributes = _objectWithoutProperties(props, _excluded$J);
|
2552 |
|
2553 | const classes = mapToCssModules(classNames(className, 'card-link'), cssModule);
|
2554 | return React.createElement(Tag, _extends({}, attributes, {
|
2555 | ref: innerRef,
|
2556 | className: classes
|
2557 | }));
|
2558 | };
|
2559 |
|
2560 | CardLink.propTypes = propTypes$O;
|
2561 | CardLink.defaultProps = defaultProps$N;
|
2562 | var CardLink$1 = CardLink;
|
2563 |
|
2564 | const _excluded$I = ["className", "cssModule", "tag"];
|
2565 | const propTypes$N = {
|
2566 | tag: tagPropType,
|
2567 | className: PropTypes.string,
|
2568 | cssModule: PropTypes.object
|
2569 | };
|
2570 | const defaultProps$M = {
|
2571 | tag: 'div'
|
2572 | };
|
2573 |
|
2574 | const CardFooter = props => {
|
2575 | const {
|
2576 | className,
|
2577 | cssModule,
|
2578 | tag: Tag
|
2579 | } = props,
|
2580 | attributes = _objectWithoutProperties(props, _excluded$I);
|
2581 |
|
2582 | const classes = mapToCssModules(classNames(className, 'card-footer'), cssModule);
|
2583 | return React.createElement(Tag, _extends({}, attributes, {
|
2584 | className: classes
|
2585 | }));
|
2586 | };
|
2587 |
|
2588 | CardFooter.propTypes = propTypes$N;
|
2589 | CardFooter.defaultProps = defaultProps$M;
|
2590 | var CardFooter$1 = CardFooter;
|
2591 |
|
2592 | const _excluded$H = ["className", "cssModule", "tag"];
|
2593 | const propTypes$M = {
|
2594 | tag: tagPropType,
|
2595 | className: PropTypes.string,
|
2596 | cssModule: PropTypes.object
|
2597 | };
|
2598 | const defaultProps$L = {
|
2599 | tag: 'div'
|
2600 | };
|
2601 |
|
2602 | const CardHeader = props => {
|
2603 | const {
|
2604 | className,
|
2605 | cssModule,
|
2606 | tag: Tag
|
2607 | } = props,
|
2608 | attributes = _objectWithoutProperties(props, _excluded$H);
|
2609 |
|
2610 | const classes = mapToCssModules(classNames(className, 'card-header'), cssModule);
|
2611 | return React.createElement(Tag, _extends({}, attributes, {
|
2612 | className: classes
|
2613 | }));
|
2614 | };
|
2615 |
|
2616 | CardHeader.propTypes = propTypes$M;
|
2617 | CardHeader.defaultProps = defaultProps$L;
|
2618 | var CardHeader$1 = CardHeader;
|
2619 |
|
2620 | const _excluded$G = ["className", "cssModule", "top", "bottom", "tag"];
|
2621 | const propTypes$L = {
|
2622 | tag: tagPropType,
|
2623 | top: PropTypes.bool,
|
2624 | bottom: PropTypes.bool,
|
2625 | className: PropTypes.string,
|
2626 | cssModule: PropTypes.object
|
2627 | };
|
2628 | const defaultProps$K = {
|
2629 | tag: 'img'
|
2630 | };
|
2631 |
|
2632 | const CardImg = props => {
|
2633 | const {
|
2634 | className,
|
2635 | cssModule,
|
2636 | top,
|
2637 | bottom,
|
2638 | tag: Tag
|
2639 | } = props,
|
2640 | attributes = _objectWithoutProperties(props, _excluded$G);
|
2641 |
|
2642 | let cardImgClassName = 'card-img';
|
2643 |
|
2644 | if (top) {
|
2645 | cardImgClassName = 'card-img-top';
|
2646 | }
|
2647 |
|
2648 | if (bottom) {
|
2649 | cardImgClassName = 'card-img-bottom';
|
2650 | }
|
2651 |
|
2652 | const classes = mapToCssModules(classNames(className, cardImgClassName), cssModule);
|
2653 | return React.createElement(Tag, _extends({}, attributes, {
|
2654 | className: classes
|
2655 | }));
|
2656 | };
|
2657 |
|
2658 | CardImg.propTypes = propTypes$L;
|
2659 | CardImg.defaultProps = defaultProps$K;
|
2660 | var CardImg$1 = CardImg;
|
2661 |
|
2662 | const _excluded$F = ["className", "cssModule", "tag"];
|
2663 | const propTypes$K = {
|
2664 | tag: tagPropType,
|
2665 | className: PropTypes.string,
|
2666 | cssModule: PropTypes.object
|
2667 | };
|
2668 | const defaultProps$J = {
|
2669 | tag: 'div'
|
2670 | };
|
2671 |
|
2672 | const CardImgOverlay = props => {
|
2673 | const {
|
2674 | className,
|
2675 | cssModule,
|
2676 | tag: Tag
|
2677 | } = props,
|
2678 | attributes = _objectWithoutProperties(props, _excluded$F);
|
2679 |
|
2680 | const classes = mapToCssModules(classNames(className, 'card-img-overlay'), cssModule);
|
2681 | return React.createElement(Tag, _extends({}, attributes, {
|
2682 | className: classes
|
2683 | }));
|
2684 | };
|
2685 |
|
2686 | CardImgOverlay.propTypes = propTypes$K;
|
2687 | CardImgOverlay.defaultProps = defaultProps$J;
|
2688 | var CardImgOverlay$1 = CardImgOverlay;
|
2689 |
|
2690 | const _excluded$E = ["in", "children", "cssModule", "slide", "tag", "className"];
|
2691 |
|
2692 | class CarouselItem extends React.Component {
|
2693 | constructor(props) {
|
2694 | super(props);
|
2695 | this.state = {
|
2696 | startAnimation: false
|
2697 | };
|
2698 | this.onEnter = this.onEnter.bind(this);
|
2699 | this.onEntering = this.onEntering.bind(this);
|
2700 | this.onExit = this.onExit.bind(this);
|
2701 | this.onExiting = this.onExiting.bind(this);
|
2702 | this.onExited = this.onExited.bind(this);
|
2703 | }
|
2704 |
|
2705 | onEnter(node, isAppearing) {
|
2706 | this.setState({
|
2707 | startAnimation: false
|
2708 | });
|
2709 | this.props.onEnter(node, isAppearing);
|
2710 | }
|
2711 |
|
2712 | onEntering(node, isAppearing) {
|
2713 |
|
2714 | const offsetHeight = node.offsetHeight;
|
2715 | this.setState({
|
2716 | startAnimation: true
|
2717 | });
|
2718 | this.props.onEntering(node, isAppearing);
|
2719 | return offsetHeight;
|
2720 | }
|
2721 |
|
2722 | onExit(node) {
|
2723 | this.setState({
|
2724 | startAnimation: false
|
2725 | });
|
2726 | this.props.onExit(node);
|
2727 | }
|
2728 |
|
2729 | onExiting(node) {
|
2730 | this.setState({
|
2731 | startAnimation: true
|
2732 | });
|
2733 | node.dispatchEvent(new CustomEvent('slide.bs.carousel'));
|
2734 | this.props.onExiting(node);
|
2735 | }
|
2736 |
|
2737 | onExited(node) {
|
2738 | node.dispatchEvent(new CustomEvent('slid.bs.carousel'));
|
2739 | this.props.onExited(node);
|
2740 | }
|
2741 |
|
2742 | render() {
|
2743 | const _this$props = this.props,
|
2744 | {
|
2745 | in: isIn,
|
2746 | children,
|
2747 | cssModule,
|
2748 | slide,
|
2749 | tag: Tag,
|
2750 | className
|
2751 | } = _this$props,
|
2752 | transitionProps = _objectWithoutProperties(_this$props, _excluded$E);
|
2753 |
|
2754 | return React.createElement(Transition, _extends({}, transitionProps, {
|
2755 | enter: slide,
|
2756 | exit: slide,
|
2757 | in: isIn,
|
2758 | onEnter: this.onEnter,
|
2759 | onEntering: this.onEntering,
|
2760 | onExit: this.onExit,
|
2761 | onExiting: this.onExiting,
|
2762 | onExited: this.onExited
|
2763 | }), status => {
|
2764 | const {
|
2765 | direction
|
2766 | } = this.context;
|
2767 | const isActive = status === TransitionStatuses.ENTERED || status === TransitionStatuses.EXITING;
|
2768 | const directionClassName = (status === TransitionStatuses.ENTERING || status === TransitionStatuses.EXITING) && this.state.startAnimation && (direction === 'end' ? 'carousel-item-start' : 'carousel-item-end');
|
2769 | const orderClassName = status === TransitionStatuses.ENTERING && (direction === 'end' ? 'carousel-item-next' : 'carousel-item-prev');
|
2770 | const itemClasses = mapToCssModules(classNames(className, 'carousel-item', isActive && 'active', directionClassName, orderClassName), cssModule);
|
2771 | return React.createElement(Tag, {
|
2772 | className: itemClasses
|
2773 | }, children);
|
2774 | });
|
2775 | }
|
2776 |
|
2777 | }
|
2778 |
|
2779 | CarouselItem.propTypes = _objectSpread2(_objectSpread2({}, Transition.propTypes), {}, {
|
2780 | tag: tagPropType,
|
2781 | in: PropTypes.bool,
|
2782 | cssModule: PropTypes.object,
|
2783 | children: PropTypes.node,
|
2784 | slide: PropTypes.bool,
|
2785 | className: PropTypes.string
|
2786 | });
|
2787 | CarouselItem.defaultProps = _objectSpread2(_objectSpread2({}, Transition.defaultProps), {}, {
|
2788 | tag: 'div',
|
2789 | timeout: TransitionTimeouts.Carousel,
|
2790 | slide: true
|
2791 | });
|
2792 | CarouselItem.contextTypes = {
|
2793 | direction: PropTypes.string
|
2794 | };
|
2795 | var CarouselItem$1 = CarouselItem;
|
2796 |
|
2797 |
|
2798 |
|
2799 |
|
2800 |
|
2801 |
|
2802 |
|
2803 |
|
2804 | const CarouselContext = React.createContext({});
|
2805 |
|
2806 | const SWIPE_THRESHOLD = 40;
|
2807 |
|
2808 | class Carousel extends React.Component {
|
2809 | constructor(props) {
|
2810 | super(props);
|
2811 | this.handleKeyPress = this.handleKeyPress.bind(this);
|
2812 | this.renderItems = this.renderItems.bind(this);
|
2813 | this.hoverStart = this.hoverStart.bind(this);
|
2814 | this.hoverEnd = this.hoverEnd.bind(this);
|
2815 | this.handleTouchStart = this.handleTouchStart.bind(this);
|
2816 | this.handleTouchEnd = this.handleTouchEnd.bind(this);
|
2817 | this.touchStartX = 0;
|
2818 | this.touchStartY = 0;
|
2819 | this.state = {
|
2820 | activeIndex: this.props.activeIndex,
|
2821 | direction: 'end',
|
2822 | indicatorClicked: false
|
2823 | };
|
2824 | }
|
2825 |
|
2826 | getContextValue() {
|
2827 | return {
|
2828 | direction: this.state.direction
|
2829 | };
|
2830 | }
|
2831 |
|
2832 | componentDidMount() {
|
2833 |
|
2834 | if (this.props.ride === 'carousel') {
|
2835 | this.setInterval();
|
2836 | }
|
2837 |
|
2838 |
|
2839 | document.addEventListener('keyup', this.handleKeyPress);
|
2840 | }
|
2841 |
|
2842 | static getDerivedStateFromProps(nextProps, prevState) {
|
2843 | let newState = null;
|
2844 | let {
|
2845 | activeIndex,
|
2846 | direction,
|
2847 | indicatorClicked
|
2848 | } = prevState;
|
2849 |
|
2850 | if (nextProps.activeIndex !== activeIndex) {
|
2851 |
|
2852 | if (nextProps.activeIndex === activeIndex + 1) {
|
2853 | direction = 'end';
|
2854 | } else if (nextProps.activeIndex === activeIndex - 1) {
|
2855 | direction = 'start';
|
2856 | } else if (nextProps.activeIndex < activeIndex) {
|
2857 | direction = indicatorClicked ? 'start' : 'end';
|
2858 | } else if (nextProps.activeIndex !== activeIndex) {
|
2859 | direction = indicatorClicked ? 'end' : 'start';
|
2860 | }
|
2861 |
|
2862 | newState = {
|
2863 | activeIndex: nextProps.activeIndex,
|
2864 | direction,
|
2865 | indicatorClicked: false
|
2866 | };
|
2867 | }
|
2868 |
|
2869 | return newState;
|
2870 | }
|
2871 |
|
2872 | componentDidUpdate(prevProps, prevState) {
|
2873 | if (prevState.activeIndex === this.state.activeIndex) return;
|
2874 | this.setInterval(this.props);
|
2875 | }
|
2876 |
|
2877 | componentWillUnmount() {
|
2878 | this.clearInterval();
|
2879 | document.removeEventListener('keyup', this.handleKeyPress);
|
2880 | }
|
2881 |
|
2882 | setInterval(props = this.props) {
|
2883 |
|
2884 | this.clearInterval();
|
2885 |
|
2886 | if (props.interval) {
|
2887 | this.cycleInterval = setInterval(() => {
|
2888 | props.next();
|
2889 | }, parseInt(props.interval, 10));
|
2890 | }
|
2891 | }
|
2892 |
|
2893 | clearInterval() {
|
2894 | clearInterval(this.cycleInterval);
|
2895 | }
|
2896 |
|
2897 | hoverStart(...args) {
|
2898 | if (this.props.pause === 'hover') {
|
2899 | this.clearInterval();
|
2900 | }
|
2901 |
|
2902 | if (this.props.mouseEnter) {
|
2903 | this.props.mouseEnter(...args);
|
2904 | }
|
2905 | }
|
2906 |
|
2907 | hoverEnd(...args) {
|
2908 | if (this.props.pause === 'hover') {
|
2909 | this.setInterval();
|
2910 | }
|
2911 |
|
2912 | if (this.props.mouseLeave) {
|
2913 | this.props.mouseLeave(...args);
|
2914 | }
|
2915 | }
|
2916 |
|
2917 | handleKeyPress(evt) {
|
2918 | if (this.props.keyboard) {
|
2919 | if (evt.keyCode === 37) {
|
2920 | this.props.previous();
|
2921 | } else if (evt.keyCode === 39) {
|
2922 | this.props.next();
|
2923 | }
|
2924 | }
|
2925 | }
|
2926 |
|
2927 | handleTouchStart(e) {
|
2928 | if (!this.props.enableTouch) {
|
2929 | return;
|
2930 | }
|
2931 |
|
2932 | this.touchStartX = e.changedTouches[0].screenX;
|
2933 | this.touchStartY = e.changedTouches[0].screenY;
|
2934 | }
|
2935 |
|
2936 | handleTouchEnd(e) {
|
2937 | if (!this.props.enableTouch) {
|
2938 | return;
|
2939 | }
|
2940 |
|
2941 | const currentX = e.changedTouches[0].screenX;
|
2942 | const currentY = e.changedTouches[0].screenY;
|
2943 | const diffX = Math.abs(this.touchStartX - currentX);
|
2944 | const diffY = Math.abs(this.touchStartY - currentY);
|
2945 |
|
2946 | if (diffX < diffY) {
|
2947 | return;
|
2948 | }
|
2949 |
|
2950 | if (diffX < SWIPE_THRESHOLD) {
|
2951 | return;
|
2952 | }
|
2953 |
|
2954 | if (currentX < this.touchStartX) {
|
2955 | this.props.next();
|
2956 | } else {
|
2957 | this.props.previous();
|
2958 | }
|
2959 | }
|
2960 |
|
2961 | renderItems(carouselItems, className) {
|
2962 | const {
|
2963 | slide
|
2964 | } = this.props;
|
2965 | return React.createElement("div", {
|
2966 | className: className
|
2967 | }, carouselItems.map((item, index) => {
|
2968 | const isIn = index === this.state.activeIndex;
|
2969 | return React.cloneElement(item, {
|
2970 | in: isIn,
|
2971 | slide: slide
|
2972 | });
|
2973 | }));
|
2974 | }
|
2975 |
|
2976 | render() {
|
2977 | const {
|
2978 | cssModule,
|
2979 | slide,
|
2980 | className,
|
2981 | dark,
|
2982 | fade
|
2983 | } = this.props;
|
2984 | const outerClasses = mapToCssModules(classNames(className, 'carousel', fade, slide && 'slide', dark && 'carousel-dark'), cssModule);
|
2985 | const innerClasses = mapToCssModules(classNames('carousel-inner'), cssModule);
|
2986 |
|
2987 | const children = this.props.children.filter(child => child !== null && child !== undefined && typeof child !== 'boolean');
|
2988 | const slidesOnly = children.every(child => child.type === CarouselItem$1);
|
2989 |
|
2990 | if (slidesOnly) {
|
2991 | return React.createElement("div", {
|
2992 | className: outerClasses,
|
2993 | onMouseEnter: this.hoverStart,
|
2994 | onMouseLeave: this.hoverEnd
|
2995 | }, React.createElement(CarouselContext.Provider, {
|
2996 | value: this.getContextValue()
|
2997 | }, this.renderItems(children, innerClasses)));
|
2998 | }
|
2999 |
|
3000 |
|
3001 | if (children[0] instanceof Array) {
|
3002 | const _carouselItems = children[0];
|
3003 | const _controlLeft = children[1];
|
3004 | const _controlRight = children[2];
|
3005 | return React.createElement("div", {
|
3006 | className: outerClasses,
|
3007 | onMouseEnter: this.hoverStart,
|
3008 | onMouseLeave: this.hoverEnd
|
3009 | }, React.createElement(CarouselContext.Provider, {
|
3010 | value: this.getContextValue()
|
3011 | }, this.renderItems(_carouselItems, innerClasses), _controlLeft, _controlRight));
|
3012 | }
|
3013 |
|
3014 |
|
3015 | const indicators = children[0];
|
3016 |
|
3017 | const wrappedOnClick = e => {
|
3018 | if (typeof indicators.props.onClickHandler === 'function') {
|
3019 | this.setState({
|
3020 | indicatorClicked: true
|
3021 | }, () => indicators.props.onClickHandler(e));
|
3022 | }
|
3023 | };
|
3024 |
|
3025 | const wrappedIndicators = React.cloneElement(indicators, {
|
3026 | onClickHandler: wrappedOnClick
|
3027 | });
|
3028 | const carouselItems = children[1];
|
3029 | const controlLeft = children[2];
|
3030 | const controlRight = children[3];
|
3031 | return React.createElement("div", {
|
3032 | className: outerClasses,
|
3033 | onMouseEnter: this.hoverStart,
|
3034 | onMouseLeave: this.hoverEnd,
|
3035 | onTouchStart: this.handleTouchStart,
|
3036 | onTouchEnd: this.handleTouchEnd
|
3037 | }, React.createElement(CarouselContext.Provider, {
|
3038 | value: this.getContextValue()
|
3039 | }, wrappedIndicators, this.renderItems(carouselItems, innerClasses), controlLeft, controlRight));
|
3040 | }
|
3041 |
|
3042 | }
|
3043 |
|
3044 | Carousel.propTypes = {
|
3045 |
|
3046 | activeIndex: PropTypes.number,
|
3047 |
|
3048 | next: PropTypes.func.isRequired,
|
3049 |
|
3050 | previous: PropTypes.func.isRequired,
|
3051 |
|
3052 | keyboard: PropTypes.bool,
|
3053 |
|
3054 | |
3055 |
|
3056 |
|
3057 | pause: PropTypes.oneOf(['hover', false]),
|
3058 |
|
3059 |
|
3060 | ride: PropTypes.oneOf(['carousel']),
|
3061 |
|
3062 |
|
3063 | interval: PropTypes.oneOfType([PropTypes.number, PropTypes.string, PropTypes.bool]),
|
3064 | children: PropTypes.array,
|
3065 |
|
3066 | mouseEnter: PropTypes.func,
|
3067 |
|
3068 | mouseLeave: PropTypes.func,
|
3069 |
|
3070 | slide: PropTypes.bool,
|
3071 |
|
3072 | dark: PropTypes.bool,
|
3073 | cssModule: PropTypes.object,
|
3074 | className: PropTypes.string,
|
3075 | enableTouch: PropTypes.bool
|
3076 | };
|
3077 | Carousel.defaultProps = {
|
3078 | interval: 5000,
|
3079 | pause: 'hover',
|
3080 | keyboard: true,
|
3081 | slide: true,
|
3082 | enableTouch: true,
|
3083 | fade: false
|
3084 | };
|
3085 | Carousel.childContextTypes = {
|
3086 | direction: PropTypes.string
|
3087 | };
|
3088 | var Carousel$1 = Carousel;
|
3089 |
|
3090 | const CarouselControl = props => {
|
3091 | const {
|
3092 | direction,
|
3093 | onClickHandler,
|
3094 | cssModule,
|
3095 | directionText,
|
3096 | className
|
3097 | } = props;
|
3098 | const anchorClasses = mapToCssModules(classNames(className, `carousel-control-${direction}`), cssModule);
|
3099 | const iconClasses = mapToCssModules(classNames(`carousel-control-${direction}-icon`), cssModule);
|
3100 | const screenReaderClasses = mapToCssModules(classNames('visually-hidden'), cssModule);
|
3101 | return (
|
3102 |
|
3103 |
|
3104 |
|
3105 |
|
3106 |
|
3107 | React.createElement("a", {
|
3108 | className: anchorClasses,
|
3109 | style: {
|
3110 | cursor: "pointer"
|
3111 | },
|
3112 | role: "button",
|
3113 | tabIndex: "0",
|
3114 | onClick: e => {
|
3115 | e.preventDefault();
|
3116 | onClickHandler();
|
3117 | }
|
3118 | }, React.createElement("span", {
|
3119 | className: iconClasses,
|
3120 | "aria-hidden": "true"
|
3121 | }), React.createElement("span", {
|
3122 | className: screenReaderClasses
|
3123 | }, directionText || direction))
|
3124 | );
|
3125 | };
|
3126 |
|
3127 | CarouselControl.propTypes = {
|
3128 | direction: PropTypes.oneOf(['prev', 'next']).isRequired,
|
3129 | onClickHandler: PropTypes.func.isRequired,
|
3130 | cssModule: PropTypes.object,
|
3131 | directionText: PropTypes.string,
|
3132 | className: PropTypes.string
|
3133 | };
|
3134 | var CarouselControl$1 = CarouselControl;
|
3135 |
|
3136 | const CarouselIndicators = props => {
|
3137 | const {
|
3138 | items,
|
3139 | activeIndex,
|
3140 | cssModule,
|
3141 | onClickHandler,
|
3142 | className
|
3143 | } = props;
|
3144 | const listClasses = mapToCssModules(classNames(className, 'carousel-indicators'), cssModule);
|
3145 | const indicators = items.map((item, idx) => {
|
3146 | const indicatorClasses = mapToCssModules(classNames({
|
3147 | active: activeIndex === idx
|
3148 | }), cssModule);
|
3149 | return React.createElement("button", {
|
3150 | "aria-label": item.caption,
|
3151 | "data-bs-target": true,
|
3152 | key: `${item.key || Object.values(item).join('')}`,
|
3153 | onClick: e => {
|
3154 | e.preventDefault();
|
3155 | onClickHandler(idx);
|
3156 | },
|
3157 | className: indicatorClasses
|
3158 | });
|
3159 | });
|
3160 | return React.createElement("div", {
|
3161 | className: listClasses
|
3162 | }, indicators);
|
3163 | };
|
3164 |
|
3165 | CarouselIndicators.propTypes = {
|
3166 | items: PropTypes.array.isRequired,
|
3167 | activeIndex: PropTypes.number.isRequired,
|
3168 | cssModule: PropTypes.object,
|
3169 | onClickHandler: PropTypes.func.isRequired,
|
3170 | className: PropTypes.string
|
3171 | };
|
3172 | var CarouselIndicators$1 = CarouselIndicators;
|
3173 |
|
3174 | const CarouselCaption = props => {
|
3175 | const {
|
3176 | captionHeader,
|
3177 | captionText,
|
3178 | cssModule,
|
3179 | className
|
3180 | } = props;
|
3181 | const classes = mapToCssModules(classNames(className, 'carousel-caption', 'd-none', 'd-md-block'), cssModule);
|
3182 | return React.createElement("div", {
|
3183 | className: classes
|
3184 | }, React.createElement("h3", null, captionHeader), React.createElement("p", null, captionText));
|
3185 | };
|
3186 |
|
3187 | CarouselCaption.propTypes = {
|
3188 | captionHeader: PropTypes.node,
|
3189 | captionText: PropTypes.node.isRequired,
|
3190 | cssModule: PropTypes.object,
|
3191 | className: PropTypes.string
|
3192 | };
|
3193 | var CarouselCaption$1 = CarouselCaption;
|
3194 |
|
3195 | const _excluded$D = ["defaultActiveIndex", "autoPlay", "indicators", "controls", "items", "goToIndex"];
|
3196 | const propTypes$J = {
|
3197 | items: PropTypes.array.isRequired,
|
3198 | indicators: PropTypes.bool,
|
3199 | controls: PropTypes.bool,
|
3200 | autoPlay: PropTypes.bool,
|
3201 | defaultActiveIndex: PropTypes.number,
|
3202 | activeIndex: PropTypes.number,
|
3203 | next: PropTypes.func,
|
3204 | previous: PropTypes.func,
|
3205 | goToIndex: PropTypes.func
|
3206 | };
|
3207 |
|
3208 | class UncontrolledCarousel extends Component {
|
3209 | constructor(props) {
|
3210 | super(props);
|
3211 | this.animating = false;
|
3212 | this.state = {
|
3213 | activeIndex: props.defaultActiveIndex || 0
|
3214 | };
|
3215 | this.next = this.next.bind(this);
|
3216 | this.previous = this.previous.bind(this);
|
3217 | this.goToIndex = this.goToIndex.bind(this);
|
3218 | this.onExiting = this.onExiting.bind(this);
|
3219 | this.onExited = this.onExited.bind(this);
|
3220 | }
|
3221 |
|
3222 | onExiting() {
|
3223 | this.animating = true;
|
3224 | }
|
3225 |
|
3226 | onExited() {
|
3227 | this.animating = false;
|
3228 | }
|
3229 |
|
3230 | next() {
|
3231 | if (this.animating) return;
|
3232 | const nextIndex = this.state.activeIndex === this.props.items.length - 1 ? 0 : this.state.activeIndex + 1;
|
3233 | this.setState({
|
3234 | activeIndex: nextIndex
|
3235 | });
|
3236 | }
|
3237 |
|
3238 | previous() {
|
3239 | if (this.animating) return;
|
3240 | const nextIndex = this.state.activeIndex === 0 ? this.props.items.length - 1 : this.state.activeIndex - 1;
|
3241 | this.setState({
|
3242 | activeIndex: nextIndex
|
3243 | });
|
3244 | }
|
3245 |
|
3246 | goToIndex(newIndex) {
|
3247 | if (this.animating) return;
|
3248 | this.setState({
|
3249 | activeIndex: newIndex
|
3250 | });
|
3251 | }
|
3252 |
|
3253 | render() {
|
3254 | const _this$props = this.props,
|
3255 | {
|
3256 | defaultActiveIndex,
|
3257 | autoPlay,
|
3258 | indicators,
|
3259 | controls,
|
3260 | items,
|
3261 | goToIndex
|
3262 | } = _this$props,
|
3263 | props = _objectWithoutProperties(_this$props, _excluded$D);
|
3264 |
|
3265 | const {
|
3266 | activeIndex
|
3267 | } = this.state;
|
3268 | const slides = items.map(item => {
|
3269 | const key = item.key || item.src;
|
3270 | return React.createElement(CarouselItem$1, {
|
3271 | onExiting: this.onExiting,
|
3272 | onExited: this.onExited,
|
3273 | key: key
|
3274 | }, React.createElement("img", {
|
3275 | className: "d-block w-100",
|
3276 | src: item.src,
|
3277 | alt: item.altText
|
3278 | }), React.createElement(CarouselCaption$1, {
|
3279 | captionText: item.caption,
|
3280 | captionHeader: item.header || item.caption
|
3281 | }));
|
3282 | });
|
3283 | return React.createElement(Carousel$1, _extends({
|
3284 | activeIndex: activeIndex,
|
3285 | next: this.next,
|
3286 | previous: this.previous,
|
3287 | ride: autoPlay ? 'carousel' : undefined
|
3288 | }, props), indicators && React.createElement(CarouselIndicators$1, {
|
3289 | items: items,
|
3290 | activeIndex: props.activeIndex || activeIndex,
|
3291 | onClickHandler: goToIndex || this.goToIndex
|
3292 | }), slides, controls && React.createElement(CarouselControl$1, {
|
3293 | direction: "prev",
|
3294 | directionText: "Previous",
|
3295 | onClickHandler: props.previous || this.previous
|
3296 | }), controls && React.createElement(CarouselControl$1, {
|
3297 | direction: "next",
|
3298 | directionText: "Next",
|
3299 | onClickHandler: props.next || this.next
|
3300 | }));
|
3301 | }
|
3302 |
|
3303 | }
|
3304 |
|
3305 | UncontrolledCarousel.propTypes = propTypes$J;
|
3306 | UncontrolledCarousel.defaultProps = {
|
3307 | controls: true,
|
3308 | indicators: true,
|
3309 | autoPlay: true
|
3310 | };
|
3311 | var UncontrolledCarousel$1 = UncontrolledCarousel;
|
3312 |
|
3313 | const _excluded$C = ["className", "cssModule", "tag"];
|
3314 | const propTypes$I = {
|
3315 | tag: tagPropType,
|
3316 | className: PropTypes.string,
|
3317 | cssModule: PropTypes.object
|
3318 | };
|
3319 | const defaultProps$I = {
|
3320 | tag: 'div'
|
3321 | };
|
3322 |
|
3323 | const CardSubtitle = props => {
|
3324 | const {
|
3325 | className,
|
3326 | cssModule,
|
3327 | tag: Tag
|
3328 | } = props,
|
3329 | attributes = _objectWithoutProperties(props, _excluded$C);
|
3330 |
|
3331 | const classes = mapToCssModules(classNames(className, 'card-subtitle'), cssModule);
|
3332 | return React.createElement(Tag, _extends({}, attributes, {
|
3333 | className: classes
|
3334 | }));
|
3335 | };
|
3336 |
|
3337 | CardSubtitle.propTypes = propTypes$I;
|
3338 | CardSubtitle.defaultProps = defaultProps$I;
|
3339 | var CardSubtitle$1 = CardSubtitle;
|
3340 |
|
3341 | const _excluded$B = ["className", "cssModule", "tag"];
|
3342 | const propTypes$H = {
|
3343 | tag: tagPropType,
|
3344 | className: PropTypes.string,
|
3345 | cssModule: PropTypes.object
|
3346 | };
|
3347 | const defaultProps$H = {
|
3348 | tag: 'p'
|
3349 | };
|
3350 |
|
3351 | const CardText = props => {
|
3352 | const {
|
3353 | className,
|
3354 | cssModule,
|
3355 | tag: Tag
|
3356 | } = props,
|
3357 | attributes = _objectWithoutProperties(props, _excluded$B);
|
3358 |
|
3359 | const classes = mapToCssModules(classNames(className, 'card-text'), cssModule);
|
3360 | return React.createElement(Tag, _extends({}, attributes, {
|
3361 | className: classes
|
3362 | }));
|
3363 | };
|
3364 |
|
3365 | CardText.propTypes = propTypes$H;
|
3366 | CardText.defaultProps = defaultProps$H;
|
3367 | var CardText$1 = CardText;
|
3368 |
|
3369 | const _excluded$A = ["className", "cssModule", "tag"];
|
3370 | const propTypes$G = {
|
3371 | tag: tagPropType,
|
3372 | className: PropTypes.string,
|
3373 | cssModule: PropTypes.object
|
3374 | };
|
3375 | const defaultProps$G = {
|
3376 | tag: 'div'
|
3377 | };
|
3378 |
|
3379 | const CardTitle = props => {
|
3380 | const {
|
3381 | className,
|
3382 | cssModule,
|
3383 | tag: Tag
|
3384 | } = props,
|
3385 | attributes = _objectWithoutProperties(props, _excluded$A);
|
3386 |
|
3387 | const classes = mapToCssModules(classNames(className, 'card-title'), cssModule);
|
3388 | return React.createElement(Tag, _extends({}, attributes, {
|
3389 | className: classes
|
3390 | }));
|
3391 | };
|
3392 |
|
3393 | CardTitle.propTypes = propTypes$G;
|
3394 | CardTitle.defaultProps = defaultProps$G;
|
3395 | var CardTitle$1 = CardTitle;
|
3396 |
|
3397 | const _excluded$z = ["cssModule", "children", "isOpen", "flip", "target", "offset", "fallbackPlacements", "placementPrefix", "arrowClassName", "hideArrow", "popperClassName", "tag", "container", "modifiers", "strategy", "boundariesElement", "onClosed", "fade", "transition", "placement"];
|
3398 |
|
3399 | function noop$2() {}
|
3400 |
|
3401 | const propTypes$F = {
|
3402 | children: PropTypes.oneOfType([PropTypes.node, PropTypes.func]).isRequired,
|
3403 | popperClassName: PropTypes.string,
|
3404 | placement: PropTypes.string,
|
3405 | placementPrefix: PropTypes.string,
|
3406 | arrowClassName: PropTypes.string,
|
3407 | hideArrow: PropTypes.bool,
|
3408 | tag: tagPropType,
|
3409 | isOpen: PropTypes.bool.isRequired,
|
3410 | cssModule: PropTypes.object,
|
3411 | offset: PropTypes.arrayOf(PropTypes.number),
|
3412 | fallbackPlacements: PropTypes.array,
|
3413 | flip: PropTypes.bool,
|
3414 | container: targetPropType,
|
3415 | target: targetPropType.isRequired,
|
3416 | modifiers: PropTypes.array,
|
3417 | strategy: PropTypes.string,
|
3418 | boundariesElement: PropTypes.oneOfType([PropTypes.string, DOMElement]),
|
3419 | onClosed: PropTypes.func,
|
3420 | fade: PropTypes.bool,
|
3421 | transition: PropTypes.shape(Fade.propTypes)
|
3422 | };
|
3423 | const defaultProps$F = {
|
3424 | boundariesElement: 'scrollParent',
|
3425 | placement: 'auto',
|
3426 | hideArrow: false,
|
3427 | isOpen: false,
|
3428 | offset: [0, 0],
|
3429 | flip: true,
|
3430 | container: 'body',
|
3431 | modifiers: [],
|
3432 | onClosed: noop$2,
|
3433 | fade: true,
|
3434 | transition: _objectSpread2({}, Fade.defaultProps)
|
3435 | };
|
3436 |
|
3437 | class PopperContent extends React.Component {
|
3438 | constructor(props) {
|
3439 | super(props);
|
3440 | this.setTargetNode = this.setTargetNode.bind(this);
|
3441 | this.getTargetNode = this.getTargetNode.bind(this);
|
3442 | this.getRef = this.getRef.bind(this);
|
3443 | this.onClosed = this.onClosed.bind(this);
|
3444 | this.state = {
|
3445 | isOpen: props.isOpen
|
3446 | };
|
3447 | }
|
3448 |
|
3449 | static getDerivedStateFromProps(props, state) {
|
3450 | if (props.isOpen && !state.isOpen) {
|
3451 | return {
|
3452 | isOpen: props.isOpen
|
3453 | };
|
3454 | } else return null;
|
3455 | }
|
3456 |
|
3457 | componentDidUpdate() {
|
3458 | if (this._element && this._element.childNodes && this._element.childNodes[0] && this._element.childNodes[0].focus) {
|
3459 | this._element.childNodes[0].focus();
|
3460 | }
|
3461 | }
|
3462 |
|
3463 | setTargetNode(node) {
|
3464 | this.targetNode = typeof node === 'string' ? getTarget(node) : node;
|
3465 | }
|
3466 |
|
3467 | getTargetNode() {
|
3468 | return this.targetNode;
|
3469 | }
|
3470 |
|
3471 | getContainerNode() {
|
3472 | return getTarget(this.props.container);
|
3473 | }
|
3474 |
|
3475 | getRef(ref) {
|
3476 | this._element = ref;
|
3477 | }
|
3478 |
|
3479 | onClosed() {
|
3480 | this.props.onClosed();
|
3481 | this.setState({
|
3482 | isOpen: false
|
3483 | });
|
3484 | }
|
3485 |
|
3486 | renderChildren() {
|
3487 | const _this$props = this.props,
|
3488 | {
|
3489 | cssModule,
|
3490 | children,
|
3491 | isOpen,
|
3492 | flip,
|
3493 | target,
|
3494 | offset,
|
3495 | fallbackPlacements,
|
3496 | placementPrefix,
|
3497 | arrowClassName: _arrowClassName,
|
3498 | hideArrow,
|
3499 | popperClassName: _popperClassName,
|
3500 | tag,
|
3501 | container,
|
3502 | modifiers,
|
3503 | strategy,
|
3504 | boundariesElement,
|
3505 | onClosed,
|
3506 | fade,
|
3507 | transition,
|
3508 | placement
|
3509 | } = _this$props,
|
3510 | attrs = _objectWithoutProperties(_this$props, _excluded$z);
|
3511 |
|
3512 | const arrowClassName = mapToCssModules(classNames('arrow', _arrowClassName), cssModule);
|
3513 | const popperClassName = mapToCssModules(classNames(_popperClassName, placementPrefix ? `${placementPrefix}-auto` : ''), this.props.cssModule);
|
3514 | const modifierNames = modifiers.map(m => m.name);
|
3515 | const baseModifiers = [{
|
3516 | name: 'offset',
|
3517 | options: {
|
3518 | offset
|
3519 | }
|
3520 | }, {
|
3521 | name: 'flip',
|
3522 | enabled: flip,
|
3523 | options: {
|
3524 | fallbackPlacements
|
3525 | }
|
3526 | }, {
|
3527 | name: 'preventOverflow',
|
3528 | options: {
|
3529 | boundary: boundariesElement
|
3530 | }
|
3531 | }].filter(m => !modifierNames.includes(m.name));
|
3532 | const extendedModifiers = [...baseModifiers, ...modifiers];
|
3533 |
|
3534 | const popperTransition = _objectSpread2(_objectSpread2(_objectSpread2({}, Fade.defaultProps), transition), {}, {
|
3535 | baseClass: fade ? transition.baseClass : '',
|
3536 | timeout: fade ? transition.timeout : 0
|
3537 | });
|
3538 |
|
3539 | return React.createElement(Fade, _extends({}, popperTransition, attrs, {
|
3540 | in: isOpen,
|
3541 | onExited: this.onClosed,
|
3542 | tag: tag
|
3543 | }), React.createElement(Popper, {
|
3544 | referenceElement: this.targetNode,
|
3545 | modifiers: extendedModifiers,
|
3546 | placement: placement,
|
3547 | strategy: strategy
|
3548 | }, ({
|
3549 | ref,
|
3550 | style,
|
3551 | placement: popperPlacement,
|
3552 | isReferenceHidden,
|
3553 | arrowProps,
|
3554 | update
|
3555 | }) => React.createElement("div", {
|
3556 | ref: ref,
|
3557 | style: style,
|
3558 | className: popperClassName,
|
3559 | "data-popper-placement": popperPlacement,
|
3560 | "data-popper-reference-hidden": isReferenceHidden ? 'true' : undefined
|
3561 | }, typeof children === 'function' ? children({
|
3562 | update
|
3563 | }) : children, !hideArrow && React.createElement("span", {
|
3564 | ref: arrowProps.ref,
|
3565 | className: arrowClassName,
|
3566 | style: arrowProps.style
|
3567 | }))));
|
3568 | }
|
3569 |
|
3570 | render() {
|
3571 | this.setTargetNode(this.props.target);
|
3572 |
|
3573 | if (this.state.isOpen) {
|
3574 | return this.props.container === 'inline' ? this.renderChildren() : ReactDOM.createPortal( React.createElement("div", {
|
3575 | ref: this.getRef
|
3576 | }, this.renderChildren()), this.getContainerNode());
|
3577 | }
|
3578 |
|
3579 | return null;
|
3580 | }
|
3581 |
|
3582 | }
|
3583 |
|
3584 | PopperContent.propTypes = propTypes$F;
|
3585 | PopperContent.defaultProps = defaultProps$F;
|
3586 | var PopperContent$1 = PopperContent;
|
3587 |
|
3588 | const PopperTargetHelper = (props, context) => {
|
3589 | context.popperManager.setTargetNode(getTarget(props.target));
|
3590 | return null;
|
3591 | };
|
3592 |
|
3593 | PopperTargetHelper.contextTypes = {
|
3594 | popperManager: PropTypes.object.isRequired
|
3595 | };
|
3596 | PopperTargetHelper.propTypes = {
|
3597 | target: targetPropType.isRequired
|
3598 | };
|
3599 | var PopperTargetHelper$1 = PopperTargetHelper;
|
3600 |
|
3601 | const propTypes$E = {
|
3602 | children: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),
|
3603 | placement: PropTypes.oneOf(PopperPlacements),
|
3604 | target: targetPropType.isRequired,
|
3605 | container: targetPropType,
|
3606 | isOpen: PropTypes.bool,
|
3607 | disabled: PropTypes.bool,
|
3608 | hideArrow: PropTypes.bool,
|
3609 | boundariesElement: PropTypes.oneOfType([PropTypes.string, DOMElement]),
|
3610 | className: PropTypes.string,
|
3611 | innerClassName: PropTypes.string,
|
3612 | arrowClassName: PropTypes.string,
|
3613 | popperClassName: PropTypes.string,
|
3614 | cssModule: PropTypes.object,
|
3615 | toggle: PropTypes.func,
|
3616 | autohide: PropTypes.bool,
|
3617 | placementPrefix: PropTypes.string,
|
3618 | delay: PropTypes.oneOfType([PropTypes.shape({
|
3619 | show: PropTypes.number,
|
3620 | hide: PropTypes.number
|
3621 | }), PropTypes.number]),
|
3622 | modifiers: PropTypes.array,
|
3623 | strategy: PropTypes.string,
|
3624 | offset: PropTypes.arrayOf(PropTypes.number),
|
3625 | innerRef: PropTypes.oneOfType([PropTypes.func, PropTypes.string, PropTypes.object]),
|
3626 | trigger: PropTypes.string,
|
3627 | fade: PropTypes.bool,
|
3628 | flip: PropTypes.bool
|
3629 | };
|
3630 | const DEFAULT_DELAYS = {
|
3631 | show: 0,
|
3632 | hide: 50
|
3633 | };
|
3634 | const defaultProps$E = {
|
3635 | isOpen: false,
|
3636 | hideArrow: false,
|
3637 | autohide: false,
|
3638 | delay: DEFAULT_DELAYS,
|
3639 | toggle: function () {},
|
3640 | trigger: 'click',
|
3641 | fade: true
|
3642 | };
|
3643 |
|
3644 | function isInDOMSubtree(element, subtreeRoot) {
|
3645 | return subtreeRoot && (element === subtreeRoot || subtreeRoot.contains(element));
|
3646 | }
|
3647 |
|
3648 | function isInDOMSubtrees(element, subtreeRoots = []) {
|
3649 | return subtreeRoots && subtreeRoots.length && subtreeRoots.filter(subTreeRoot => isInDOMSubtree(element, subTreeRoot))[0];
|
3650 | }
|
3651 |
|
3652 | class TooltipPopoverWrapper extends React.Component {
|
3653 | constructor(props) {
|
3654 | super(props);
|
3655 | this._targets = [];
|
3656 | this.currentTargetElement = null;
|
3657 | this.addTargetEvents = this.addTargetEvents.bind(this);
|
3658 | this.handleDocumentClick = this.handleDocumentClick.bind(this);
|
3659 | this.removeTargetEvents = this.removeTargetEvents.bind(this);
|
3660 | this.toggle = this.toggle.bind(this);
|
3661 | this.showWithDelay = this.showWithDelay.bind(this);
|
3662 | this.hideWithDelay = this.hideWithDelay.bind(this);
|
3663 | this.onMouseOverTooltipContent = this.onMouseOverTooltipContent.bind(this);
|
3664 | this.onMouseLeaveTooltipContent = this.onMouseLeaveTooltipContent.bind(this);
|
3665 | this.show = this.show.bind(this);
|
3666 | this.hide = this.hide.bind(this);
|
3667 | this.onEscKeyDown = this.onEscKeyDown.bind(this);
|
3668 | this.getRef = this.getRef.bind(this);
|
3669 | this.state = {
|
3670 | isOpen: props.isOpen
|
3671 | };
|
3672 | this._isMounted = false;
|
3673 | }
|
3674 |
|
3675 | componentDidMount() {
|
3676 | this._isMounted = true;
|
3677 | this.updateTarget();
|
3678 | }
|
3679 |
|
3680 | componentWillUnmount() {
|
3681 | this._isMounted = false;
|
3682 | this.removeTargetEvents();
|
3683 | this._targets = null;
|
3684 | this.clearShowTimeout();
|
3685 | this.clearHideTimeout();
|
3686 | }
|
3687 |
|
3688 | static getDerivedStateFromProps(props, state) {
|
3689 | if (props.isOpen && !state.isOpen) {
|
3690 | return {
|
3691 | isOpen: props.isOpen
|
3692 | };
|
3693 | } else return null;
|
3694 | }
|
3695 |
|
3696 | onMouseOverTooltipContent() {
|
3697 | if (this.props.trigger.indexOf('hover') > -1 && !this.props.autohide) {
|
3698 | if (this._hideTimeout) {
|
3699 | this.clearHideTimeout();
|
3700 | }
|
3701 |
|
3702 | if (this.state.isOpen && !this.props.isOpen) {
|
3703 | this.toggle();
|
3704 | }
|
3705 | }
|
3706 | }
|
3707 |
|
3708 | onMouseLeaveTooltipContent(e) {
|
3709 | if (this.props.trigger.indexOf('hover') > -1 && !this.props.autohide) {
|
3710 | if (this._showTimeout) {
|
3711 | this.clearShowTimeout();
|
3712 | }
|
3713 |
|
3714 | e.persist();
|
3715 | this._hideTimeout = setTimeout(this.hide.bind(this, e), this.getDelay('hide'));
|
3716 | }
|
3717 | }
|
3718 |
|
3719 | onEscKeyDown(e) {
|
3720 | if (e.key === 'Escape') {
|
3721 | this.hide(e);
|
3722 | }
|
3723 | }
|
3724 |
|
3725 | getRef(ref) {
|
3726 | const {
|
3727 | innerRef
|
3728 | } = this.props;
|
3729 |
|
3730 | if (innerRef) {
|
3731 | if (typeof innerRef === 'function') {
|
3732 | innerRef(ref);
|
3733 | } else if (typeof innerRef === 'object') {
|
3734 | innerRef.current = ref;
|
3735 | }
|
3736 | }
|
3737 |
|
3738 | this._popover = ref;
|
3739 | }
|
3740 |
|
3741 | getDelay(key) {
|
3742 | const {
|
3743 | delay
|
3744 | } = this.props;
|
3745 |
|
3746 | if (typeof delay === 'object') {
|
3747 | return isNaN(delay[key]) ? DEFAULT_DELAYS[key] : delay[key];
|
3748 | }
|
3749 |
|
3750 | return delay;
|
3751 | }
|
3752 |
|
3753 | getCurrentTarget(target) {
|
3754 | if (!target) return null;
|
3755 |
|
3756 | const index = this._targets.indexOf(target);
|
3757 |
|
3758 | if (index >= 0) return this._targets[index];
|
3759 | return this.getCurrentTarget(target.parentElement);
|
3760 | }
|
3761 |
|
3762 | show(e) {
|
3763 | if (!this.props.isOpen) {
|
3764 | this.clearShowTimeout();
|
3765 | this.currentTargetElement = e ? e.currentTarget || this.getCurrentTarget(e.target) : null;
|
3766 |
|
3767 | if (e && e.composedPath && typeof e.composedPath === 'function') {
|
3768 | const path = e.composedPath();
|
3769 | this.currentTargetElement = path && path[0] || this.currentTargetElement;
|
3770 | }
|
3771 |
|
3772 | this.toggle(e);
|
3773 | }
|
3774 | }
|
3775 |
|
3776 | showWithDelay(e) {
|
3777 | if (this._hideTimeout) {
|
3778 | this.clearHideTimeout();
|
3779 | }
|
3780 |
|
3781 | this._showTimeout = setTimeout(this.show.bind(this, e), this.getDelay('show'));
|
3782 | }
|
3783 |
|
3784 | hide(e) {
|
3785 | if (this.props.isOpen) {
|
3786 | this.clearHideTimeout();
|
3787 | this.currentTargetElement = null;
|
3788 | this.toggle(e);
|
3789 | }
|
3790 | }
|
3791 |
|
3792 | hideWithDelay(e) {
|
3793 | if (this._showTimeout) {
|
3794 | this.clearShowTimeout();
|
3795 | }
|
3796 |
|
3797 | this._hideTimeout = setTimeout(this.hide.bind(this, e), this.getDelay('hide'));
|
3798 | }
|
3799 |
|
3800 | clearShowTimeout() {
|
3801 | clearTimeout(this._showTimeout);
|
3802 | this._showTimeout = undefined;
|
3803 | }
|
3804 |
|
3805 | clearHideTimeout() {
|
3806 | clearTimeout(this._hideTimeout);
|
3807 | this._hideTimeout = undefined;
|
3808 | }
|
3809 |
|
3810 | handleDocumentClick(e) {
|
3811 | const triggers = this.props.trigger.split(' ');
|
3812 |
|
3813 | if (triggers.indexOf('legacy') > -1 && (this.props.isOpen || isInDOMSubtrees(e.target, this._targets))) {
|
3814 | if (this._hideTimeout) {
|
3815 | this.clearHideTimeout();
|
3816 | }
|
3817 |
|
3818 | if (this.props.isOpen && !isInDOMSubtree(e.target, this._popover)) {
|
3819 | this.hideWithDelay(e);
|
3820 | } else if (!this.props.isOpen) {
|
3821 | this.showWithDelay(e);
|
3822 | }
|
3823 | } else if (triggers.indexOf('click') > -1 && isInDOMSubtrees(e.target, this._targets)) {
|
3824 | if (this._hideTimeout) {
|
3825 | this.clearHideTimeout();
|
3826 | }
|
3827 |
|
3828 | if (!this.props.isOpen) {
|
3829 | this.showWithDelay(e);
|
3830 | } else {
|
3831 | this.hideWithDelay(e);
|
3832 | }
|
3833 | }
|
3834 | }
|
3835 |
|
3836 | addEventOnTargets(type, handler, isBubble) {
|
3837 | this._targets.forEach(target => {
|
3838 | target.addEventListener(type, handler, isBubble);
|
3839 | });
|
3840 | }
|
3841 |
|
3842 | removeEventOnTargets(type, handler, isBubble) {
|
3843 | this._targets.forEach(target => {
|
3844 | target.removeEventListener(type, handler, isBubble);
|
3845 | });
|
3846 | }
|
3847 |
|
3848 | addTargetEvents() {
|
3849 | if (this.props.trigger) {
|
3850 | let triggers = this.props.trigger.split(' ');
|
3851 |
|
3852 | if (triggers.indexOf('manual') === -1) {
|
3853 | if (triggers.indexOf('click') > -1 || triggers.indexOf('legacy') > -1) {
|
3854 | document.addEventListener('click', this.handleDocumentClick, true);
|
3855 | }
|
3856 |
|
3857 | if (this._targets && this._targets.length) {
|
3858 | if (triggers.indexOf('hover') > -1) {
|
3859 | this.addEventOnTargets('mouseover', this.showWithDelay, true);
|
3860 | this.addEventOnTargets('mouseout', this.hideWithDelay, true);
|
3861 | }
|
3862 |
|
3863 | if (triggers.indexOf('focus') > -1) {
|
3864 | this.addEventOnTargets('focusin', this.show, true);
|
3865 | this.addEventOnTargets('focusout', this.hide, true);
|
3866 | }
|
3867 |
|
3868 | this.addEventOnTargets('keydown', this.onEscKeyDown, true);
|
3869 | }
|
3870 | }
|
3871 | }
|
3872 | }
|
3873 |
|
3874 | removeTargetEvents() {
|
3875 | if (this._targets) {
|
3876 | this.removeEventOnTargets('mouseover', this.showWithDelay, true);
|
3877 | this.removeEventOnTargets('mouseout', this.hideWithDelay, true);
|
3878 | this.removeEventOnTargets('keydown', this.onEscKeyDown, true);
|
3879 | this.removeEventOnTargets('focusin', this.show, true);
|
3880 | this.removeEventOnTargets('focusout', this.hide, true);
|
3881 | }
|
3882 |
|
3883 | document.removeEventListener('click', this.handleDocumentClick, true);
|
3884 | }
|
3885 |
|
3886 | updateTarget() {
|
3887 | const newTarget = getTarget(this.props.target, true);
|
3888 |
|
3889 | if (newTarget !== this._targets) {
|
3890 | this.removeTargetEvents();
|
3891 | this._targets = newTarget ? Array.from(newTarget) : [];
|
3892 | this.currentTargetElement = this.currentTargetElement || this._targets[0];
|
3893 | this.addTargetEvents();
|
3894 | }
|
3895 | }
|
3896 |
|
3897 | toggle(e) {
|
3898 | if (this.props.disabled || !this._isMounted) {
|
3899 | return e && e.preventDefault();
|
3900 | }
|
3901 |
|
3902 | return this.props.toggle(e);
|
3903 | }
|
3904 |
|
3905 | render() {
|
3906 | if (this.props.isOpen) {
|
3907 | this.updateTarget();
|
3908 | }
|
3909 |
|
3910 | const target = this.currentTargetElement || this._targets[0];
|
3911 |
|
3912 | if (!target) {
|
3913 | return null;
|
3914 | }
|
3915 |
|
3916 | const {
|
3917 | className,
|
3918 | cssModule,
|
3919 | innerClassName,
|
3920 | isOpen,
|
3921 | hideArrow,
|
3922 | boundariesElement,
|
3923 | placement,
|
3924 | placementPrefix,
|
3925 | arrowClassName,
|
3926 | popperClassName,
|
3927 | container,
|
3928 | modifiers,
|
3929 | strategy,
|
3930 | offset,
|
3931 | fade,
|
3932 | flip,
|
3933 | children
|
3934 | } = this.props;
|
3935 | const attributes = omit(this.props, Object.keys(propTypes$E));
|
3936 | const popperClasses = mapToCssModules(popperClassName, cssModule);
|
3937 | const classes = mapToCssModules(innerClassName, cssModule);
|
3938 | return React.createElement(PopperContent$1, {
|
3939 | className: className,
|
3940 | target: target,
|
3941 | isOpen: isOpen,
|
3942 | hideArrow: hideArrow,
|
3943 | boundariesElement: boundariesElement,
|
3944 | placement: placement,
|
3945 | placementPrefix: placementPrefix,
|
3946 | arrowClassName: arrowClassName,
|
3947 | popperClassName: popperClasses,
|
3948 | container: container,
|
3949 | modifiers: modifiers,
|
3950 | strategy: strategy,
|
3951 | offset: offset,
|
3952 | cssModule: cssModule,
|
3953 | fade: fade,
|
3954 | flip: flip
|
3955 | }, ({
|
3956 | update
|
3957 | }) => React.createElement("div", _extends({}, attributes, {
|
3958 | ref: this.getRef,
|
3959 | className: classes,
|
3960 | role: "tooltip",
|
3961 | onMouseOver: this.onMouseOverTooltipContent,
|
3962 | onMouseLeave: this.onMouseLeaveTooltipContent,
|
3963 | onKeyDown: this.onEscKeyDown
|
3964 | }), typeof children === 'function' ? children({
|
3965 | update
|
3966 | }) : children));
|
3967 | }
|
3968 |
|
3969 | }
|
3970 |
|
3971 | TooltipPopoverWrapper.propTypes = propTypes$E;
|
3972 | TooltipPopoverWrapper.defaultProps = defaultProps$E;
|
3973 | var TooltipPopoverWrapper$1 = TooltipPopoverWrapper;
|
3974 |
|
3975 | const defaultProps$D = {
|
3976 | placement: 'right',
|
3977 | placementPrefix: 'bs-popover',
|
3978 | trigger: 'click',
|
3979 | offset: [0, 8]
|
3980 | };
|
3981 |
|
3982 | const Popover = props => {
|
3983 | const popperClasses = classNames('popover', 'show', props.popperClassName);
|
3984 | const classes = classNames('popover-inner', props.innerClassName);
|
3985 | return React.createElement(TooltipPopoverWrapper$1, _extends({}, props, {
|
3986 | arrowClassName: "popover-arrow",
|
3987 | popperClassName: popperClasses,
|
3988 | innerClassName: classes
|
3989 | }));
|
3990 | };
|
3991 |
|
3992 | Popover.propTypes = propTypes$E;
|
3993 | Popover.defaultProps = defaultProps$D;
|
3994 | var Popover$1 = Popover;
|
3995 |
|
3996 | const omitKeys$4 = ['defaultOpen'];
|
3997 | class UncontrolledPopover extends Component {
|
3998 | constructor(props) {
|
3999 | super(props);
|
4000 | this.state = {
|
4001 | isOpen: props.defaultOpen || false
|
4002 | };
|
4003 | this.toggle = this.toggle.bind(this);
|
4004 | }
|
4005 |
|
4006 | toggle() {
|
4007 | this.setState({
|
4008 | isOpen: !this.state.isOpen
|
4009 | });
|
4010 | }
|
4011 |
|
4012 | render() {
|
4013 | return React.createElement(Popover$1, _extends({
|
4014 | isOpen: this.state.isOpen,
|
4015 | toggle: this.toggle
|
4016 | }, omit(this.props, omitKeys$4)));
|
4017 | }
|
4018 |
|
4019 | }
|
4020 | UncontrolledPopover.propTypes = _objectSpread2({
|
4021 | defaultOpen: PropTypes.bool
|
4022 | }, Popover$1.propTypes);
|
4023 |
|
4024 | const _excluded$y = ["className", "cssModule", "tag"];
|
4025 | const propTypes$D = {
|
4026 | tag: tagPropType,
|
4027 | className: PropTypes.string,
|
4028 | cssModule: PropTypes.object
|
4029 | };
|
4030 | const defaultProps$C = {
|
4031 | tag: 'h3'
|
4032 | };
|
4033 |
|
4034 | const PopoverHeader = props => {
|
4035 | const {
|
4036 | className,
|
4037 | cssModule,
|
4038 | tag: Tag
|
4039 | } = props,
|
4040 | attributes = _objectWithoutProperties(props, _excluded$y);
|
4041 |
|
4042 | const classes = mapToCssModules(classNames(className, 'popover-header'), cssModule);
|
4043 | return React.createElement(Tag, _extends({}, attributes, {
|
4044 | className: classes
|
4045 | }));
|
4046 | };
|
4047 |
|
4048 | PopoverHeader.propTypes = propTypes$D;
|
4049 | PopoverHeader.defaultProps = defaultProps$C;
|
4050 | var PopoverHeader$1 = PopoverHeader;
|
4051 |
|
4052 | const _excluded$x = ["className", "cssModule", "tag"];
|
4053 | const propTypes$C = {
|
4054 | tag: tagPropType,
|
4055 | className: PropTypes.string,
|
4056 | cssModule: PropTypes.object
|
4057 | };
|
4058 | const defaultProps$B = {
|
4059 | tag: 'div'
|
4060 | };
|
4061 |
|
4062 | const PopoverBody = props => {
|
4063 | const {
|
4064 | className,
|
4065 | cssModule,
|
4066 | tag: Tag
|
4067 | } = props,
|
4068 | attributes = _objectWithoutProperties(props, _excluded$x);
|
4069 |
|
4070 | const classes = mapToCssModules(classNames(className, 'popover-body'), cssModule);
|
4071 | return React.createElement(Tag, _extends({}, attributes, {
|
4072 | className: classes
|
4073 | }));
|
4074 | };
|
4075 |
|
4076 | PopoverBody.propTypes = propTypes$C;
|
4077 | PopoverBody.defaultProps = defaultProps$B;
|
4078 | var PopoverBody$1 = PopoverBody;
|
4079 |
|
4080 | const _excluded$w = ["children", "className", "barClassName", "cssModule", "value", "min", "max", "animated", "striped", "color", "bar", "multi", "tag", "style", "barStyle", "barAriaValueText", "barAriaLabelledBy"];
|
4081 | const propTypes$B = {
|
4082 | children: PropTypes.node,
|
4083 | bar: PropTypes.bool,
|
4084 | multi: PropTypes.bool,
|
4085 | tag: tagPropType,
|
4086 | value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
|
4087 | min: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
|
4088 | max: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
|
4089 | animated: PropTypes.bool,
|
4090 | striped: PropTypes.bool,
|
4091 | color: PropTypes.string,
|
4092 | className: PropTypes.string,
|
4093 | barClassName: PropTypes.string,
|
4094 | cssModule: PropTypes.object,
|
4095 | style: PropTypes.object,
|
4096 | barStyle: PropTypes.object,
|
4097 | barAriaValueText: PropTypes.string,
|
4098 | barAriaLabelledBy: PropTypes.string
|
4099 | };
|
4100 | const defaultProps$A = {
|
4101 | tag: 'div',
|
4102 | value: 0,
|
4103 | min: 0,
|
4104 | max: 100,
|
4105 | style: {},
|
4106 | barStyle: {}
|
4107 | };
|
4108 |
|
4109 | const Progress = props => {
|
4110 | const {
|
4111 | children,
|
4112 | className,
|
4113 | barClassName,
|
4114 | cssModule,
|
4115 | value,
|
4116 | min,
|
4117 | max,
|
4118 | animated,
|
4119 | striped,
|
4120 | color,
|
4121 | bar,
|
4122 | multi,
|
4123 | tag: Tag,
|
4124 | style,
|
4125 | barStyle,
|
4126 | barAriaValueText,
|
4127 | barAriaLabelledBy
|
4128 | } = props,
|
4129 | attributes = _objectWithoutProperties(props, _excluded$w);
|
4130 |
|
4131 | const percent = toNumber(value) / toNumber(max) * 100;
|
4132 | const progressClasses = mapToCssModules(classNames(className, 'progress'), cssModule);
|
4133 | const progressBarClasses = mapToCssModules(classNames('progress-bar', bar ? className || barClassName : barClassName, animated ? 'progress-bar-animated' : null, color ? `bg-${color}` : null, striped || animated ? 'progress-bar-striped' : null), cssModule);
|
4134 | const progressBarProps = {
|
4135 | className: progressBarClasses,
|
4136 | style: _objectSpread2(_objectSpread2(_objectSpread2({}, bar ? style : {}), barStyle), {}, {
|
4137 | width: `${percent}%`
|
4138 | }),
|
4139 | role: 'progressbar',
|
4140 | 'aria-valuenow': value,
|
4141 | 'aria-valuemin': min,
|
4142 | 'aria-valuemax': max,
|
4143 | 'aria-valuetext': barAriaValueText,
|
4144 | 'aria-labelledby': barAriaLabelledBy,
|
4145 | children: children
|
4146 | };
|
4147 |
|
4148 | if (bar) {
|
4149 | return React.createElement(Tag, _extends({}, attributes, progressBarProps));
|
4150 | }
|
4151 |
|
4152 | return React.createElement(Tag, _extends({}, attributes, {
|
4153 | style: style,
|
4154 | className: progressClasses
|
4155 | }), multi ? children : React.createElement("div", progressBarProps));
|
4156 | };
|
4157 |
|
4158 | Progress.propTypes = propTypes$B;
|
4159 | Progress.defaultProps = defaultProps$A;
|
4160 | var Progress$1 = Progress;
|
4161 |
|
4162 | const propTypes$A = {
|
4163 | children: PropTypes.node.isRequired,
|
4164 | node: PropTypes.any
|
4165 | };
|
4166 |
|
4167 | class Portal extends React.Component {
|
4168 | componentWillUnmount() {
|
4169 | if (this.defaultNode) {
|
4170 | document.body.removeChild(this.defaultNode);
|
4171 | }
|
4172 |
|
4173 | this.defaultNode = null;
|
4174 | }
|
4175 |
|
4176 | render() {
|
4177 | if (!canUseDOM) {
|
4178 | return null;
|
4179 | }
|
4180 |
|
4181 | if (!this.props.node && !this.defaultNode) {
|
4182 | this.defaultNode = document.createElement('div');
|
4183 | document.body.appendChild(this.defaultNode);
|
4184 | }
|
4185 |
|
4186 | return ReactDOM.createPortal(this.props.children, this.props.node || this.defaultNode);
|
4187 | }
|
4188 |
|
4189 | }
|
4190 |
|
4191 | Portal.propTypes = propTypes$A;
|
4192 | var Portal$1 = Portal;
|
4193 |
|
4194 | function noop$1() {}
|
4195 |
|
4196 | const FadePropTypes$1 = PropTypes.shape(Fade.propTypes);
|
4197 | const propTypes$z = {
|
4198 | isOpen: PropTypes.bool,
|
4199 | autoFocus: PropTypes.bool,
|
4200 | centered: PropTypes.bool,
|
4201 | fullscreen: PropTypes.oneOfType([PropTypes.bool, PropTypes.oneOf(['sm', 'md', 'lg', 'xl'])]),
|
4202 | scrollable: PropTypes.bool,
|
4203 | size: PropTypes.string,
|
4204 | toggle: PropTypes.func,
|
4205 | keyboard: PropTypes.bool,
|
4206 | role: PropTypes.string,
|
4207 | labelledBy: PropTypes.string,
|
4208 | backdrop: PropTypes.oneOfType([PropTypes.bool, PropTypes.oneOf(['static'])]),
|
4209 | onEnter: PropTypes.func,
|
4210 | onExit: PropTypes.func,
|
4211 | onOpened: PropTypes.func,
|
4212 | onClosed: PropTypes.func,
|
4213 | children: PropTypes.node,
|
4214 | className: PropTypes.string,
|
4215 | wrapClassName: PropTypes.string,
|
4216 | modalClassName: PropTypes.string,
|
4217 | backdropClassName: PropTypes.string,
|
4218 | contentClassName: PropTypes.string,
|
4219 | external: PropTypes.node,
|
4220 | fade: PropTypes.bool,
|
4221 | cssModule: PropTypes.object,
|
4222 | zIndex: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
|
4223 | backdropTransition: FadePropTypes$1,
|
4224 | modalTransition: FadePropTypes$1,
|
4225 | innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.string, PropTypes.func]),
|
4226 | unmountOnClose: PropTypes.bool,
|
4227 | returnFocusAfterClose: PropTypes.bool,
|
4228 | container: targetPropType,
|
4229 | trapFocus: PropTypes.bool
|
4230 | };
|
4231 | const propsToOmit$1 = Object.keys(propTypes$z);
|
4232 | const defaultProps$z = {
|
4233 | isOpen: false,
|
4234 | autoFocus: true,
|
4235 | centered: false,
|
4236 | scrollable: false,
|
4237 | role: 'dialog',
|
4238 | backdrop: true,
|
4239 | keyboard: true,
|
4240 | zIndex: 1050,
|
4241 | fade: true,
|
4242 | onOpened: noop$1,
|
4243 | onClosed: noop$1,
|
4244 | modalTransition: {
|
4245 | timeout: TransitionTimeouts.Modal
|
4246 | },
|
4247 | backdropTransition: {
|
4248 | mountOnEnter: true,
|
4249 | timeout: TransitionTimeouts.Fade
|
4250 |
|
4251 | },
|
4252 | unmountOnClose: true,
|
4253 | returnFocusAfterClose: true,
|
4254 | container: 'body',
|
4255 | trapFocus: false
|
4256 | };
|
4257 |
|
4258 | class Modal extends React.Component {
|
4259 | constructor(props) {
|
4260 | super(props);
|
4261 | this._element = null;
|
4262 | this._originalBodyPadding = null;
|
4263 | this._originalBodyOverflow = null;
|
4264 | this.getFocusableChildren = this.getFocusableChildren.bind(this);
|
4265 | this.handleBackdropClick = this.handleBackdropClick.bind(this);
|
4266 | this.handleBackdropMouseDown = this.handleBackdropMouseDown.bind(this);
|
4267 | this.handleEscape = this.handleEscape.bind(this);
|
4268 | this.handleStaticBackdropAnimation = this.handleStaticBackdropAnimation.bind(this);
|
4269 | this.handleTab = this.handleTab.bind(this);
|
4270 | this.onOpened = this.onOpened.bind(this);
|
4271 | this.onClosed = this.onClosed.bind(this);
|
4272 | this.manageFocusAfterClose = this.manageFocusAfterClose.bind(this);
|
4273 | this.clearBackdropAnimationTimeout = this.clearBackdropAnimationTimeout.bind(this);
|
4274 | this.trapFocus = this.trapFocus.bind(this);
|
4275 | this.state = {
|
4276 | isOpen: false,
|
4277 | showStaticBackdropAnimation: false
|
4278 | };
|
4279 | }
|
4280 |
|
4281 | componentDidMount() {
|
4282 | const {
|
4283 | isOpen,
|
4284 | autoFocus,
|
4285 | onEnter
|
4286 | } = this.props;
|
4287 |
|
4288 | if (isOpen) {
|
4289 | this.init();
|
4290 | this.setState({
|
4291 | isOpen: true
|
4292 | });
|
4293 |
|
4294 | if (autoFocus) {
|
4295 | this.setFocus();
|
4296 | }
|
4297 | }
|
4298 |
|
4299 | if (onEnter) {
|
4300 | onEnter();
|
4301 | }
|
4302 |
|
4303 |
|
4304 | document.addEventListener('focus', this.trapFocus, true);
|
4305 | this._isMounted = true;
|
4306 | }
|
4307 |
|
4308 | componentDidUpdate(prevProps, prevState) {
|
4309 | if (this.props.isOpen && !prevProps.isOpen) {
|
4310 | this.init();
|
4311 | this.setState({
|
4312 | isOpen: true
|
4313 | });
|
4314 |
|
4315 | return;
|
4316 | }
|
4317 |
|
4318 |
|
4319 | if (this.props.autoFocus && this.state.isOpen && !prevState.isOpen) {
|
4320 | this.setFocus();
|
4321 | }
|
4322 |
|
4323 | if (this._element && prevProps.zIndex !== this.props.zIndex) {
|
4324 | this._element.style.zIndex = this.props.zIndex;
|
4325 | }
|
4326 | }
|
4327 |
|
4328 | componentWillUnmount() {
|
4329 | this.clearBackdropAnimationTimeout();
|
4330 |
|
4331 | if (this.props.onExit) {
|
4332 | this.props.onExit();
|
4333 | }
|
4334 |
|
4335 | if (this._element) {
|
4336 | this.destroy();
|
4337 |
|
4338 | if (this.props.isOpen || this.state.isOpen) {
|
4339 | this.close();
|
4340 | }
|
4341 | }
|
4342 |
|
4343 | document.removeEventListener('focus', this.trapFocus, true);
|
4344 | this._isMounted = false;
|
4345 | }
|
4346 |
|
4347 | trapFocus(ev) {
|
4348 | if (!this.props.trapFocus) {
|
4349 | return;
|
4350 | }
|
4351 |
|
4352 | if (!this._element)
|
4353 | return;
|
4354 | if (this._dialog && this._dialog.parentNode === ev.target)
|
4355 | return;
|
4356 | if (this.modalIndex < Modal.openCount - 1)
|
4357 | return;
|
4358 | const children = this.getFocusableChildren();
|
4359 |
|
4360 | for (let i = 0; i < children.length; i++) {
|
4361 |
|
4362 | if (children[i] === ev.target) return;
|
4363 | }
|
4364 |
|
4365 | if (children.length > 0) {
|
4366 |
|
4367 | ev.preventDefault();
|
4368 | ev.stopPropagation();
|
4369 | children[0].focus();
|
4370 | }
|
4371 | }
|
4372 |
|
4373 | onOpened(node, isAppearing) {
|
4374 | this.props.onOpened();
|
4375 | (this.props.modalTransition.onEntered || noop$1)(node, isAppearing);
|
4376 | }
|
4377 |
|
4378 | onClosed(node) {
|
4379 | const {
|
4380 | unmountOnClose
|
4381 | } = this.props;
|
4382 |
|
4383 | this.props.onClosed();
|
4384 | (this.props.modalTransition.onExited || noop$1)(node);
|
4385 |
|
4386 | if (unmountOnClose) {
|
4387 | this.destroy();
|
4388 | }
|
4389 |
|
4390 | this.close();
|
4391 |
|
4392 | if (this._isMounted) {
|
4393 | this.setState({
|
4394 | isOpen: false
|
4395 | });
|
4396 | }
|
4397 | }
|
4398 |
|
4399 | setFocus() {
|
4400 | if (this._dialog && this._dialog.parentNode && typeof this._dialog.parentNode.focus === 'function') {
|
4401 | this._dialog.parentNode.focus();
|
4402 | }
|
4403 | }
|
4404 |
|
4405 | getFocusableChildren() {
|
4406 | return this._element.querySelectorAll(focusableElements.join(', '));
|
4407 | }
|
4408 |
|
4409 | getFocusedChild() {
|
4410 | let currentFocus;
|
4411 | const focusableChildren = this.getFocusableChildren();
|
4412 |
|
4413 | try {
|
4414 | currentFocus = document.activeElement;
|
4415 | } catch (err) {
|
4416 | currentFocus = focusableChildren[0];
|
4417 | }
|
4418 |
|
4419 | return currentFocus;
|
4420 | }
|
4421 |
|
4422 |
|
4423 | handleBackdropClick(e) {
|
4424 | if (e.target === this._mouseDownElement) {
|
4425 | e.stopPropagation();
|
4426 | const backdrop = this._dialog ? this._dialog.parentNode : null;
|
4427 |
|
4428 | if (backdrop && e.target === backdrop && this.props.backdrop === 'static') {
|
4429 | this.handleStaticBackdropAnimation();
|
4430 | }
|
4431 |
|
4432 | if (!this.props.isOpen || this.props.backdrop !== true) return;
|
4433 |
|
4434 | if (backdrop && e.target === backdrop && this.props.toggle) {
|
4435 | this.props.toggle(e);
|
4436 | }
|
4437 | }
|
4438 | }
|
4439 |
|
4440 | handleTab(e) {
|
4441 | if (e.which !== 9) return;
|
4442 | if (this.modalIndex < Modal.openCount - 1) return;
|
4443 |
|
4444 | const focusableChildren = this.getFocusableChildren();
|
4445 | const totalFocusable = focusableChildren.length;
|
4446 | if (totalFocusable === 0) return;
|
4447 | const currentFocus = this.getFocusedChild();
|
4448 | let focusedIndex = 0;
|
4449 |
|
4450 | for (let i = 0; i < totalFocusable; i += 1) {
|
4451 | if (focusableChildren[i] === currentFocus) {
|
4452 | focusedIndex = i;
|
4453 | break;
|
4454 | }
|
4455 | }
|
4456 |
|
4457 | if (e.shiftKey && focusedIndex === 0) {
|
4458 | e.preventDefault();
|
4459 | focusableChildren[totalFocusable - 1].focus();
|
4460 | } else if (!e.shiftKey && focusedIndex === totalFocusable - 1) {
|
4461 | e.preventDefault();
|
4462 | focusableChildren[0].focus();
|
4463 | }
|
4464 | }
|
4465 |
|
4466 | handleBackdropMouseDown(e) {
|
4467 | this._mouseDownElement = e.target;
|
4468 | }
|
4469 |
|
4470 | handleEscape(e) {
|
4471 | if (this.props.isOpen && e.keyCode === keyCodes.esc && this.props.toggle) {
|
4472 | if (this.props.keyboard) {
|
4473 | e.preventDefault();
|
4474 | e.stopPropagation();
|
4475 | this.props.toggle(e);
|
4476 | } else if (this.props.backdrop === 'static') {
|
4477 | e.preventDefault();
|
4478 | e.stopPropagation();
|
4479 | this.handleStaticBackdropAnimation();
|
4480 | }
|
4481 | }
|
4482 | }
|
4483 |
|
4484 | handleStaticBackdropAnimation() {
|
4485 | this.clearBackdropAnimationTimeout();
|
4486 | this.setState({
|
4487 | showStaticBackdropAnimation: true
|
4488 | });
|
4489 | this._backdropAnimationTimeout = setTimeout(() => {
|
4490 | this.setState({
|
4491 | showStaticBackdropAnimation: false
|
4492 | });
|
4493 | }, 100);
|
4494 | }
|
4495 |
|
4496 | init() {
|
4497 | try {
|
4498 | this._triggeringElement = document.activeElement;
|
4499 | } catch (err) {
|
4500 | this._triggeringElement = null;
|
4501 | }
|
4502 |
|
4503 | if (!this._element) {
|
4504 | this._element = document.createElement('div');
|
4505 |
|
4506 | this._element.setAttribute('tabindex', '-1');
|
4507 |
|
4508 | this._element.style.position = 'relative';
|
4509 | this._element.style.zIndex = this.props.zIndex;
|
4510 | this._mountContainer = getTarget(this.props.container);
|
4511 |
|
4512 | this._mountContainer.appendChild(this._element);
|
4513 | }
|
4514 |
|
4515 | this._originalBodyPadding = getOriginalBodyPadding();
|
4516 | this._originalBodyOverflow = window.getComputedStyle(document.body).overflow;
|
4517 | conditionallyUpdateScrollbar();
|
4518 |
|
4519 | if (Modal.openCount === 0) {
|
4520 | document.body.className = classNames(document.body.className, mapToCssModules('modal-open', this.props.cssModule));
|
4521 | document.body.style.overflow = 'hidden';
|
4522 | }
|
4523 |
|
4524 | this.modalIndex = Modal.openCount;
|
4525 | Modal.openCount += 1;
|
4526 | }
|
4527 |
|
4528 | destroy() {
|
4529 | if (this._element) {
|
4530 | this._mountContainer.removeChild(this._element);
|
4531 |
|
4532 | this._element = null;
|
4533 | }
|
4534 |
|
4535 | this.manageFocusAfterClose();
|
4536 | }
|
4537 |
|
4538 | manageFocusAfterClose() {
|
4539 | if (this._triggeringElement) {
|
4540 | const {
|
4541 | returnFocusAfterClose
|
4542 | } = this.props;
|
4543 | if (this._triggeringElement.focus && returnFocusAfterClose) this._triggeringElement.focus();
|
4544 | this._triggeringElement = null;
|
4545 | }
|
4546 | }
|
4547 |
|
4548 | close() {
|
4549 | if (Modal.openCount <= 1) {
|
4550 | const modalOpenClassName = mapToCssModules('modal-open', this.props.cssModule);
|
4551 |
|
4552 | const modalOpenClassNameRegex = new RegExp(`(^| )${modalOpenClassName}( |$)`);
|
4553 | document.body.className = document.body.className.replace(modalOpenClassNameRegex, ' ').trim();
|
4554 | document.body.style.overflow = this._originalBodyOverflow;
|
4555 | }
|
4556 |
|
4557 | this.manageFocusAfterClose();
|
4558 | Modal.openCount = Math.max(0, Modal.openCount - 1);
|
4559 | setScrollbarWidth(this._originalBodyPadding);
|
4560 | }
|
4561 |
|
4562 | renderModalDialog() {
|
4563 | const attributes = omit(this.props, propsToOmit$1);
|
4564 | const dialogBaseClass = 'modal-dialog';
|
4565 | return React.createElement("div", _extends({}, attributes, {
|
4566 | className: mapToCssModules(classNames(dialogBaseClass, this.props.className, {
|
4567 | [`modal-${this.props.size}`]: this.props.size,
|
4568 | [`${dialogBaseClass}-centered`]: this.props.centered,
|
4569 | [`${dialogBaseClass}-scrollable`]: this.props.scrollable,
|
4570 | 'modal-fullscreen': this.props.fullscreen === true,
|
4571 | [`modal-fullscreen-${this.props.fullscreen}-down`]: typeof this.props.fullscreen === 'string'
|
4572 | }), this.props.cssModule),
|
4573 | role: "document",
|
4574 | ref: c => {
|
4575 | this._dialog = c;
|
4576 | }
|
4577 | }), React.createElement("div", {
|
4578 | className: mapToCssModules(classNames('modal-content', this.props.contentClassName), this.props.cssModule)
|
4579 | }, this.props.children));
|
4580 | }
|
4581 |
|
4582 | render() {
|
4583 | const {
|
4584 | unmountOnClose
|
4585 | } = this.props;
|
4586 |
|
4587 | if (!!this._element && (this.state.isOpen || !unmountOnClose)) {
|
4588 | const isModalHidden = !!this._element && !this.state.isOpen && !unmountOnClose;
|
4589 | this._element.style.display = isModalHidden ? 'none' : 'block';
|
4590 | const {
|
4591 | wrapClassName,
|
4592 | modalClassName,
|
4593 | backdropClassName,
|
4594 | cssModule,
|
4595 | isOpen,
|
4596 | backdrop,
|
4597 | role,
|
4598 | labelledBy,
|
4599 | external,
|
4600 | innerRef
|
4601 | } = this.props;
|
4602 | const modalAttributes = {
|
4603 | onClick: this.handleBackdropClick,
|
4604 | onMouseDown: this.handleBackdropMouseDown,
|
4605 | onKeyUp: this.handleEscape,
|
4606 | onKeyDown: this.handleTab,
|
4607 | style: {
|
4608 | display: 'block'
|
4609 | },
|
4610 | 'aria-labelledby': labelledBy,
|
4611 | role,
|
4612 | tabIndex: '-1'
|
4613 | };
|
4614 | const hasTransition = this.props.fade;
|
4615 |
|
4616 | const modalTransition = _objectSpread2(_objectSpread2(_objectSpread2({}, Fade.defaultProps), this.props.modalTransition), {}, {
|
4617 | baseClass: hasTransition ? this.props.modalTransition.baseClass : '',
|
4618 | timeout: hasTransition ? this.props.modalTransition.timeout : 0
|
4619 | });
|
4620 |
|
4621 | const backdropTransition = _objectSpread2(_objectSpread2(_objectSpread2({}, Fade.defaultProps), this.props.backdropTransition), {}, {
|
4622 | baseClass: hasTransition ? this.props.backdropTransition.baseClass : '',
|
4623 | timeout: hasTransition ? this.props.backdropTransition.timeout : 0
|
4624 | });
|
4625 |
|
4626 | const Backdrop = backdrop && (hasTransition ? React.createElement(Fade, _extends({}, backdropTransition, {
|
4627 | in: isOpen && !!backdrop,
|
4628 | cssModule: cssModule,
|
4629 | className: mapToCssModules(classNames('modal-backdrop', backdropClassName), cssModule)
|
4630 | })) : React.createElement("div", {
|
4631 | className: mapToCssModules(classNames('modal-backdrop', 'show', backdropClassName), cssModule)
|
4632 | }));
|
4633 | return React.createElement(Portal$1, {
|
4634 | node: this._element
|
4635 | }, React.createElement("div", {
|
4636 | className: mapToCssModules(wrapClassName)
|
4637 | }, React.createElement(Fade, _extends({}, modalAttributes, modalTransition, {
|
4638 | in: isOpen,
|
4639 | onEntered: this.onOpened,
|
4640 | onExited: this.onClosed,
|
4641 | cssModule: cssModule,
|
4642 | className: mapToCssModules(classNames('modal', modalClassName, this.state.showStaticBackdropAnimation && 'modal-static'), cssModule),
|
4643 | innerRef: innerRef
|
4644 | }), external, this.renderModalDialog()), Backdrop));
|
4645 | }
|
4646 |
|
4647 | return null;
|
4648 | }
|
4649 |
|
4650 | clearBackdropAnimationTimeout() {
|
4651 | if (this._backdropAnimationTimeout) {
|
4652 | clearTimeout(this._backdropAnimationTimeout);
|
4653 | this._backdropAnimationTimeout = undefined;
|
4654 | }
|
4655 | }
|
4656 |
|
4657 | }
|
4658 |
|
4659 | Modal.propTypes = propTypes$z;
|
4660 | Modal.defaultProps = defaultProps$z;
|
4661 | Modal.openCount = 0;
|
4662 | var Modal$1 = Modal;
|
4663 |
|
4664 | const _excluded$v = ["className", "cssModule", "children", "toggle", "tag", "wrapTag", "closeAriaLabel", "close"];
|
4665 | const propTypes$y = {
|
4666 | tag: tagPropType,
|
4667 | wrapTag: tagPropType,
|
4668 | toggle: PropTypes.func,
|
4669 | className: PropTypes.string,
|
4670 | cssModule: PropTypes.object,
|
4671 | children: PropTypes.node,
|
4672 | closeAriaLabel: PropTypes.string,
|
4673 | close: PropTypes.object
|
4674 | };
|
4675 | const defaultProps$y = {
|
4676 | tag: 'h5',
|
4677 | wrapTag: 'div',
|
4678 | closeAriaLabel: 'Close'
|
4679 | };
|
4680 |
|
4681 | const ModalHeader = props => {
|
4682 | let closeButton;
|
4683 |
|
4684 | const {
|
4685 | className,
|
4686 | cssModule,
|
4687 | children,
|
4688 | toggle,
|
4689 | tag: Tag,
|
4690 | wrapTag: WrapTag,
|
4691 | closeAriaLabel,
|
4692 | close
|
4693 | } = props,
|
4694 | attributes = _objectWithoutProperties(props, _excluded$v);
|
4695 |
|
4696 | const classes = mapToCssModules(classNames(className, 'modal-header'), cssModule);
|
4697 |
|
4698 | if (!close && toggle) {
|
4699 | closeButton = React.createElement("button", {
|
4700 | type: "button",
|
4701 | onClick: toggle,
|
4702 | className: mapToCssModules('btn-close', cssModule),
|
4703 | "aria-label": closeAriaLabel
|
4704 | });
|
4705 | }
|
4706 |
|
4707 | return React.createElement(WrapTag, _extends({}, attributes, {
|
4708 | className: classes
|
4709 | }), React.createElement(Tag, {
|
4710 | className: mapToCssModules('modal-title', cssModule)
|
4711 | }, children), close || closeButton);
|
4712 | };
|
4713 |
|
4714 | ModalHeader.propTypes = propTypes$y;
|
4715 | ModalHeader.defaultProps = defaultProps$y;
|
4716 | var ModalHeader$1 = ModalHeader;
|
4717 |
|
4718 | const _excluded$u = ["className", "cssModule", "tag"];
|
4719 | const propTypes$x = {
|
4720 | tag: tagPropType,
|
4721 | className: PropTypes.string,
|
4722 | cssModule: PropTypes.object
|
4723 | };
|
4724 | const defaultProps$x = {
|
4725 | tag: 'div'
|
4726 | };
|
4727 |
|
4728 | const ModalBody = props => {
|
4729 | const {
|
4730 | className,
|
4731 | cssModule,
|
4732 | tag: Tag
|
4733 | } = props,
|
4734 | attributes = _objectWithoutProperties(props, _excluded$u);
|
4735 |
|
4736 | const classes = mapToCssModules(classNames(className, 'modal-body'), cssModule);
|
4737 | return React.createElement(Tag, _extends({}, attributes, {
|
4738 | className: classes
|
4739 | }));
|
4740 | };
|
4741 |
|
4742 | ModalBody.propTypes = propTypes$x;
|
4743 | ModalBody.defaultProps = defaultProps$x;
|
4744 | var ModalBody$1 = ModalBody;
|
4745 |
|
4746 | const _excluded$t = ["className", "cssModule", "tag"];
|
4747 | const propTypes$w = {
|
4748 | tag: tagPropType,
|
4749 | className: PropTypes.string,
|
4750 | cssModule: PropTypes.object
|
4751 | };
|
4752 | const defaultProps$w = {
|
4753 | tag: 'div'
|
4754 | };
|
4755 |
|
4756 | const ModalFooter = props => {
|
4757 | const {
|
4758 | className,
|
4759 | cssModule,
|
4760 | tag: Tag
|
4761 | } = props,
|
4762 | attributes = _objectWithoutProperties(props, _excluded$t);
|
4763 |
|
4764 | const classes = mapToCssModules(classNames(className, 'modal-footer'), cssModule);
|
4765 | return React.createElement(Tag, _extends({}, attributes, {
|
4766 | className: classes
|
4767 | }));
|
4768 | };
|
4769 |
|
4770 | ModalFooter.propTypes = propTypes$w;
|
4771 | ModalFooter.defaultProps = defaultProps$w;
|
4772 | var ModalFooter$1 = ModalFooter;
|
4773 |
|
4774 | const defaultProps$v = {
|
4775 | placement: 'top',
|
4776 | autohide: true,
|
4777 | placementPrefix: 'bs-tooltip',
|
4778 | trigger: 'hover focus'
|
4779 | };
|
4780 |
|
4781 | const Tooltip = props => {
|
4782 | const popperClasses = classNames('tooltip', 'show', props.popperClassName);
|
4783 | const classes = classNames('tooltip-inner', props.innerClassName);
|
4784 | return React.createElement(TooltipPopoverWrapper$1, _extends({}, props, {
|
4785 | arrowClassName: "tooltip-arrow",
|
4786 | popperClassName: popperClasses,
|
4787 | innerClassName: classes
|
4788 | }));
|
4789 | };
|
4790 |
|
4791 | Tooltip.propTypes = propTypes$E;
|
4792 | Tooltip.defaultProps = defaultProps$v;
|
4793 | var Tooltip$1 = Tooltip;
|
4794 |
|
4795 | const _excluded$s = ["className", "cssModule", "size", "bordered", "borderless", "striped", "dark", "hover", "responsive", "tag", "responsiveTag", "innerRef"];
|
4796 | const propTypes$v = {
|
4797 | className: PropTypes.string,
|
4798 | cssModule: PropTypes.object,
|
4799 | size: PropTypes.string,
|
4800 | bordered: PropTypes.bool,
|
4801 | borderless: PropTypes.bool,
|
4802 | striped: PropTypes.bool,
|
4803 | dark: PropTypes.bool,
|
4804 | hover: PropTypes.bool,
|
4805 | responsive: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]),
|
4806 | tag: tagPropType,
|
4807 | responsiveTag: tagPropType,
|
4808 | innerRef: PropTypes.oneOfType([PropTypes.func, PropTypes.string, PropTypes.object])
|
4809 | };
|
4810 | const defaultProps$u = {
|
4811 | tag: 'table',
|
4812 | responsiveTag: 'div'
|
4813 | };
|
4814 |
|
4815 | const Table = props => {
|
4816 | const {
|
4817 | className,
|
4818 | cssModule,
|
4819 | size,
|
4820 | bordered,
|
4821 | borderless,
|
4822 | striped,
|
4823 | dark,
|
4824 | hover,
|
4825 | responsive,
|
4826 | tag: Tag,
|
4827 | responsiveTag: ResponsiveTag,
|
4828 | innerRef
|
4829 | } = props,
|
4830 | attributes = _objectWithoutProperties(props, _excluded$s);
|
4831 |
|
4832 | const classes = mapToCssModules(classNames(className, 'table', size ? 'table-' + size : false, bordered ? 'table-bordered' : false, borderless ? 'table-borderless' : false, striped ? 'table-striped' : false, dark ? 'table-dark' : false, hover ? 'table-hover' : false), cssModule);
|
4833 | const table = React.createElement(Tag, _extends({}, attributes, {
|
4834 | ref: innerRef,
|
4835 | className: classes
|
4836 | }));
|
4837 |
|
4838 | if (responsive) {
|
4839 | const responsiveClassName = mapToCssModules(responsive === true ? 'table-responsive' : `table-responsive-${responsive}`, cssModule);
|
4840 | return React.createElement(ResponsiveTag, {
|
4841 | className: responsiveClassName
|
4842 | }, table);
|
4843 | }
|
4844 |
|
4845 | return table;
|
4846 | };
|
4847 |
|
4848 | Table.propTypes = propTypes$v;
|
4849 | Table.defaultProps = defaultProps$u;
|
4850 | var Table$1 = Table;
|
4851 |
|
4852 | const _excluded$r = ["className", "cssModule", "tag", "flush", "horizontal", "numbered"];
|
4853 | const propTypes$u = {
|
4854 | tag: tagPropType,
|
4855 | flush: PropTypes.bool,
|
4856 | className: PropTypes.string,
|
4857 | cssModule: PropTypes.object,
|
4858 | horizontal: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]),
|
4859 | numbered: PropTypes.bool
|
4860 | };
|
4861 | const defaultProps$t = {
|
4862 | tag: 'ul',
|
4863 | horizontal: false,
|
4864 | numbered: false
|
4865 | };
|
4866 |
|
4867 | const getHorizontalClass = horizontal => {
|
4868 | if (horizontal === false) {
|
4869 | return false;
|
4870 | } else if (horizontal === true || horizontal === "xs") {
|
4871 | return "list-group-horizontal";
|
4872 | }
|
4873 |
|
4874 | return `list-group-horizontal-${horizontal}`;
|
4875 | };
|
4876 |
|
4877 | const ListGroup = props => {
|
4878 | const {
|
4879 | className,
|
4880 | cssModule,
|
4881 | tag: Tag,
|
4882 | flush,
|
4883 | horizontal,
|
4884 | numbered
|
4885 | } = props,
|
4886 | attributes = _objectWithoutProperties(props, _excluded$r);
|
4887 |
|
4888 | const classes = mapToCssModules(classNames(className, 'list-group',
|
4889 |
|
4890 | flush ? 'list-group-flush' : getHorizontalClass(horizontal), {
|
4891 | 'list-group-numbered': numbered
|
4892 | }), cssModule);
|
4893 | return React.createElement(Tag, _extends({}, attributes, {
|
4894 | className: classes
|
4895 | }));
|
4896 | };
|
4897 |
|
4898 | ListGroup.propTypes = propTypes$u;
|
4899 | ListGroup.defaultProps = defaultProps$t;
|
4900 | var ListGroup$1 = ListGroup;
|
4901 |
|
4902 | const _excluded$q = ["className", "cssModule", "inline", "tag", "innerRef"];
|
4903 | const propTypes$t = {
|
4904 | children: PropTypes.node,
|
4905 | inline: PropTypes.bool,
|
4906 | tag: tagPropType,
|
4907 | innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),
|
4908 | className: PropTypes.string,
|
4909 | cssModule: PropTypes.object
|
4910 | };
|
4911 | const defaultProps$s = {
|
4912 | tag: 'form'
|
4913 | };
|
4914 |
|
4915 | class Form extends Component {
|
4916 | constructor(props) {
|
4917 | super(props);
|
4918 | this.getRef = this.getRef.bind(this);
|
4919 | this.submit = this.submit.bind(this);
|
4920 | }
|
4921 |
|
4922 | getRef(ref) {
|
4923 | if (this.props.innerRef) {
|
4924 | this.props.innerRef(ref);
|
4925 | }
|
4926 |
|
4927 | this.ref = ref;
|
4928 | }
|
4929 |
|
4930 | submit() {
|
4931 | if (this.ref) {
|
4932 | this.ref.submit();
|
4933 | }
|
4934 | }
|
4935 |
|
4936 | render() {
|
4937 | const _this$props = this.props,
|
4938 | {
|
4939 | className,
|
4940 | cssModule,
|
4941 | inline,
|
4942 | tag: Tag,
|
4943 | innerRef
|
4944 | } = _this$props,
|
4945 | attributes = _objectWithoutProperties(_this$props, _excluded$q);
|
4946 |
|
4947 | const classes = mapToCssModules(classNames(className, inline ? 'form-inline' : false), cssModule);
|
4948 | return React.createElement(Tag, _extends({}, attributes, {
|
4949 | ref: innerRef,
|
4950 | className: classes
|
4951 | }));
|
4952 | }
|
4953 |
|
4954 | }
|
4955 |
|
4956 | Form.propTypes = propTypes$t;
|
4957 | Form.defaultProps = defaultProps$s;
|
4958 | var Form$1 = Form;
|
4959 |
|
4960 | const _excluded$p = ["className", "cssModule", "valid", "tooltip", "tag"];
|
4961 | const propTypes$s = {
|
4962 | children: PropTypes.node,
|
4963 | tag: tagPropType,
|
4964 | className: PropTypes.string,
|
4965 | cssModule: PropTypes.object,
|
4966 | valid: PropTypes.bool,
|
4967 | tooltip: PropTypes.bool
|
4968 | };
|
4969 | const defaultProps$r = {
|
4970 | tag: 'div',
|
4971 | valid: undefined
|
4972 | };
|
4973 |
|
4974 | const FormFeedback = props => {
|
4975 | const {
|
4976 | className,
|
4977 | cssModule,
|
4978 | valid,
|
4979 | tooltip,
|
4980 | tag: Tag
|
4981 | } = props,
|
4982 | attributes = _objectWithoutProperties(props, _excluded$p);
|
4983 |
|
4984 | const validMode = tooltip ? 'tooltip' : 'feedback';
|
4985 | const classes = mapToCssModules(classNames(className, valid ? `valid-${validMode}` : `invalid-${validMode}`), cssModule);
|
4986 | return React.createElement(Tag, _extends({}, attributes, {
|
4987 | className: classes
|
4988 | }));
|
4989 | };
|
4990 |
|
4991 | FormFeedback.propTypes = propTypes$s;
|
4992 | FormFeedback.defaultProps = defaultProps$r;
|
4993 | var FormFeedback$1 = FormFeedback;
|
4994 |
|
4995 | const _excluded$o = ["className", "cssModule", "row", "disabled", "check", "inline", "floating", "tag", "switch"];
|
4996 | const propTypes$r = {
|
4997 | children: PropTypes.node,
|
4998 | row: PropTypes.bool,
|
4999 | check: PropTypes.bool,
|
5000 | switch: PropTypes.bool,
|
5001 | inline: PropTypes.bool,
|
5002 | floating: PropTypes.bool,
|
5003 | disabled: PropTypes.bool,
|
5004 | tag: tagPropType,
|
5005 | className: PropTypes.string,
|
5006 | cssModule: PropTypes.object
|
5007 | };
|
5008 | const defaultProps$q = {
|
5009 | tag: 'div'
|
5010 | };
|
5011 |
|
5012 | const FormGroup = props => {
|
5013 | const {
|
5014 | className,
|
5015 | cssModule,
|
5016 | row,
|
5017 | disabled,
|
5018 | check,
|
5019 | inline,
|
5020 | floating,
|
5021 | tag: Tag,
|
5022 | switch: switchProp
|
5023 | } = props,
|
5024 | attributes = _objectWithoutProperties(props, _excluded$o);
|
5025 |
|
5026 | const formCheck = check || switchProp;
|
5027 | const classes = mapToCssModules(classNames(className, row ? 'row' : false, formCheck ? 'form-check' : 'mb-3', switchProp ? 'form-switch' : false, formCheck && inline ? 'form-check-inline' : false, formCheck && disabled ? 'disabled' : false, floating && 'form-floating'), cssModule);
|
5028 |
|
5029 | if (Tag === 'fieldset') {
|
5030 | attributes.disabled = disabled;
|
5031 | }
|
5032 |
|
5033 | return React.createElement(Tag, _extends({}, attributes, {
|
5034 | className: classes
|
5035 | }));
|
5036 | };
|
5037 |
|
5038 | FormGroup.propTypes = propTypes$r;
|
5039 | FormGroup.defaultProps = defaultProps$q;
|
5040 | var FormGroup$1 = FormGroup;
|
5041 |
|
5042 | const _excluded$n = ["className", "cssModule", "inline", "color", "tag"];
|
5043 | const propTypes$q = {
|
5044 | children: PropTypes.node,
|
5045 | inline: PropTypes.bool,
|
5046 | tag: tagPropType,
|
5047 | color: PropTypes.string,
|
5048 | className: PropTypes.string,
|
5049 | cssModule: PropTypes.object
|
5050 | };
|
5051 | const defaultProps$p = {
|
5052 | tag: 'small',
|
5053 | color: 'muted'
|
5054 | };
|
5055 |
|
5056 | const FormText = props => {
|
5057 | const {
|
5058 | className,
|
5059 | cssModule,
|
5060 | inline,
|
5061 | color,
|
5062 | tag: Tag
|
5063 | } = props,
|
5064 | attributes = _objectWithoutProperties(props, _excluded$n);
|
5065 |
|
5066 | const classes = mapToCssModules(classNames(className, !inline ? 'form-text' : false, color ? `text-${color}` : false), cssModule);
|
5067 | return React.createElement(Tag, _extends({}, attributes, {
|
5068 | className: classes
|
5069 | }));
|
5070 | };
|
5071 |
|
5072 | FormText.propTypes = propTypes$q;
|
5073 | FormText.defaultProps = defaultProps$p;
|
5074 | var FormText$1 = FormText;
|
5075 |
|
5076 | const _excluded$m = ["className", "cssModule", "type", "bsSize", "valid", "invalid", "tag", "addon", "plaintext", "innerRef"];
|
5077 | const propTypes$p = {
|
5078 | children: PropTypes.node,
|
5079 | type: PropTypes.string,
|
5080 | size: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
|
5081 | bsSize: PropTypes.string,
|
5082 | valid: PropTypes.bool,
|
5083 | invalid: PropTypes.bool,
|
5084 | tag: tagPropType,
|
5085 | innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),
|
5086 | plaintext: PropTypes.bool,
|
5087 | addon: PropTypes.bool,
|
5088 | className: PropTypes.string,
|
5089 | cssModule: PropTypes.object
|
5090 | };
|
5091 | const defaultProps$o = {
|
5092 | type: 'text'
|
5093 | };
|
5094 |
|
5095 | class Input extends React.Component {
|
5096 | constructor(props) {
|
5097 | super(props);
|
5098 | this.getRef = this.getRef.bind(this);
|
5099 | this.focus = this.focus.bind(this);
|
5100 | }
|
5101 |
|
5102 | getRef(ref) {
|
5103 | if (this.props.innerRef) {
|
5104 | this.props.innerRef(ref);
|
5105 | }
|
5106 |
|
5107 | this.ref = ref;
|
5108 | }
|
5109 |
|
5110 | focus() {
|
5111 | if (this.ref) {
|
5112 | this.ref.focus();
|
5113 | }
|
5114 | }
|
5115 |
|
5116 | render() {
|
5117 | let _this$props = this.props,
|
5118 | {
|
5119 | className,
|
5120 | cssModule,
|
5121 | type,
|
5122 | bsSize,
|
5123 | valid,
|
5124 | invalid,
|
5125 | tag,
|
5126 | addon,
|
5127 | plaintext,
|
5128 | innerRef
|
5129 | } = _this$props,
|
5130 | attributes = _objectWithoutProperties(_this$props, _excluded$m);
|
5131 |
|
5132 | const checkInput = ['switch', 'radio', 'checkbox'].indexOf(type) > -1;
|
5133 | const isNotaNumber = new RegExp('\\D', 'g');
|
5134 | const textareaInput = type === 'textarea';
|
5135 | const selectInput = type === 'select';
|
5136 | const rangeInput = type === 'range';
|
5137 | let Tag = tag || (selectInput || textareaInput ? type : 'input');
|
5138 | let formControlClass = 'form-control';
|
5139 |
|
5140 | if (plaintext) {
|
5141 | formControlClass = `${formControlClass}-plaintext`;
|
5142 | Tag = tag || 'input';
|
5143 | } else if (rangeInput) {
|
5144 | formControlClass = 'form-range';
|
5145 | } else if (selectInput) {
|
5146 | formControlClass = "form-select";
|
5147 | } else if (checkInput) {
|
5148 | if (addon) {
|
5149 | formControlClass = null;
|
5150 | } else {
|
5151 | formControlClass = 'form-check-input';
|
5152 | }
|
5153 | }
|
5154 |
|
5155 | if (attributes.size && isNotaNumber.test(attributes.size)) {
|
5156 | warnOnce('Please use the prop "bsSize" instead of the "size" to bootstrap\'s input sizing.');
|
5157 | bsSize = attributes.size;
|
5158 | delete attributes.size;
|
5159 | }
|
5160 |
|
5161 | const classes = mapToCssModules(classNames(className, invalid && 'is-invalid', valid && 'is-valid', bsSize ? selectInput ? `form-select-${bsSize}` : `form-control-${bsSize}` : false, formControlClass), cssModule);
|
5162 |
|
5163 | if (Tag === 'input' || tag && typeof tag === 'function') {
|
5164 | attributes.type = type === 'switch' ? 'checkbox' : type;
|
5165 | }
|
5166 |
|
5167 | if (attributes.children && !(plaintext || type === 'select' || typeof Tag !== 'string' || Tag === 'select')) {
|
5168 | warnOnce(`Input with a type of "${type}" cannot have children. Please use "value"/"defaultValue" instead.`);
|
5169 | delete attributes.children;
|
5170 | }
|
5171 |
|
5172 | return React.createElement(Tag, _extends({}, attributes, {
|
5173 | ref: innerRef,
|
5174 | className: classes,
|
5175 | "aria-invalid": invalid
|
5176 | }));
|
5177 | }
|
5178 |
|
5179 | }
|
5180 |
|
5181 | Input.propTypes = propTypes$p;
|
5182 | Input.defaultProps = defaultProps$o;
|
5183 | var Input$1 = Input;
|
5184 |
|
5185 | const _excluded$l = ["className", "cssModule", "tag", "type", "size"];
|
5186 | const propTypes$o = {
|
5187 | tag: tagPropType,
|
5188 | type: PropTypes.bool,
|
5189 | size: PropTypes.string,
|
5190 | className: PropTypes.string,
|
5191 | cssModule: PropTypes.object
|
5192 | };
|
5193 | const defaultProps$n = {
|
5194 | tag: 'div'
|
5195 | };
|
5196 |
|
5197 | const InputGroup = props => {
|
5198 | const {
|
5199 | className,
|
5200 | cssModule,
|
5201 | tag: Tag,
|
5202 | type,
|
5203 | size
|
5204 | } = props,
|
5205 | attributes = _objectWithoutProperties(props, _excluded$l);
|
5206 |
|
5207 | const classes = mapToCssModules(classNames(className, 'input-group', size ? `input-group-${size}` : null), cssModule);
|
5208 |
|
5209 | if (props.type === 'dropdown') {
|
5210 | return React.createElement(Dropdown$1, _extends({}, attributes, {
|
5211 | className: classes
|
5212 | }));
|
5213 | }
|
5214 |
|
5215 | return React.createElement(Tag, _extends({}, attributes, {
|
5216 | className: classes
|
5217 | }));
|
5218 | };
|
5219 |
|
5220 | InputGroup.propTypes = propTypes$o;
|
5221 | InputGroup.defaultProps = defaultProps$n;
|
5222 | var InputGroup$1 = InputGroup;
|
5223 |
|
5224 | const _excluded$k = ["className", "cssModule", "tag"];
|
5225 | const propTypes$n = {
|
5226 | tag: tagPropType,
|
5227 | className: PropTypes.string,
|
5228 | cssModule: PropTypes.object
|
5229 | };
|
5230 | const defaultProps$m = {
|
5231 | tag: 'span'
|
5232 | };
|
5233 |
|
5234 | const InputGroupText = props => {
|
5235 | const {
|
5236 | className,
|
5237 | cssModule,
|
5238 | tag: Tag
|
5239 | } = props,
|
5240 | attributes = _objectWithoutProperties(props, _excluded$k);
|
5241 |
|
5242 | const classes = mapToCssModules(classNames(className, 'input-group-text'), cssModule);
|
5243 | return React.createElement(Tag, _extends({}, attributes, {
|
5244 | className: classes
|
5245 | }));
|
5246 | };
|
5247 |
|
5248 | InputGroupText.propTypes = propTypes$n;
|
5249 | InputGroupText.defaultProps = defaultProps$m;
|
5250 | var InputGroupText$1 = InputGroupText;
|
5251 |
|
5252 | const _excluded$j = ["className", "cssModule", "hidden", "widths", "tag", "check", "size", "for"];
|
5253 | const colWidths = ['xs', 'sm', 'md', 'lg', 'xl', 'xxl'];
|
5254 | const stringOrNumberProp = PropTypes.oneOfType([PropTypes.number, PropTypes.string]);
|
5255 | const columnProps = PropTypes.oneOfType([PropTypes.bool, PropTypes.string, PropTypes.number, PropTypes.shape({
|
5256 | size: stringOrNumberProp,
|
5257 | order: stringOrNumberProp,
|
5258 | offset: stringOrNumberProp
|
5259 | })]);
|
5260 | const propTypes$m = {
|
5261 | children: PropTypes.node,
|
5262 | hidden: PropTypes.bool,
|
5263 | check: PropTypes.bool,
|
5264 | size: PropTypes.string,
|
5265 | for: PropTypes.string,
|
5266 | tag: tagPropType,
|
5267 | className: PropTypes.string,
|
5268 | cssModule: PropTypes.object,
|
5269 | xs: columnProps,
|
5270 | sm: columnProps,
|
5271 | md: columnProps,
|
5272 | lg: columnProps,
|
5273 | xl: columnProps,
|
5274 | xxl: columnProps,
|
5275 | widths: PropTypes.array
|
5276 | };
|
5277 | const defaultProps$l = {
|
5278 | tag: 'label',
|
5279 | widths: colWidths
|
5280 | };
|
5281 |
|
5282 | const getColumnSizeClass = (isXs, colWidth, colSize) => {
|
5283 | if (colSize === true || colSize === '') {
|
5284 | return isXs ? 'col' : `col-${colWidth}`;
|
5285 | } else if (colSize === 'auto') {
|
5286 | return isXs ? 'col-auto' : `col-${colWidth}-auto`;
|
5287 | }
|
5288 |
|
5289 | return isXs ? `col-${colSize}` : `col-${colWidth}-${colSize}`;
|
5290 | };
|
5291 |
|
5292 | const Label = props => {
|
5293 | const {
|
5294 | className,
|
5295 | cssModule,
|
5296 | hidden,
|
5297 | widths,
|
5298 | tag: Tag,
|
5299 | check,
|
5300 | size,
|
5301 | for: htmlFor
|
5302 | } = props,
|
5303 | attributes = _objectWithoutProperties(props, _excluded$j);
|
5304 |
|
5305 | const colClasses = [];
|
5306 | widths.forEach((colWidth, i) => {
|
5307 | let columnProp = props[colWidth];
|
5308 | delete attributes[colWidth];
|
5309 |
|
5310 | if (!columnProp && columnProp !== '') {
|
5311 | return;
|
5312 | }
|
5313 |
|
5314 | const isXs = !i;
|
5315 | let colClass;
|
5316 |
|
5317 | if (isObject(columnProp)) {
|
5318 | const colSizeInterfix = isXs ? '-' : `-${colWidth}-`;
|
5319 | colClass = getColumnSizeClass(isXs, colWidth, columnProp.size);
|
5320 | colClasses.push(mapToCssModules(classNames({
|
5321 | [colClass]: columnProp.size || columnProp.size === '',
|
5322 | [`order${colSizeInterfix}${columnProp.order}`]: columnProp.order || columnProp.order === 0,
|
5323 | [`offset${colSizeInterfix}${columnProp.offset}`]: columnProp.offset || columnProp.offset === 0
|
5324 | })), cssModule);
|
5325 | } else {
|
5326 | colClass = getColumnSizeClass(isXs, colWidth, columnProp);
|
5327 | colClasses.push(colClass);
|
5328 | }
|
5329 | });
|
5330 | const colFormLabel = size || colClasses.length;
|
5331 | const formLabel = !(check || colFormLabel);
|
5332 | const classes = mapToCssModules(classNames(className, hidden ? 'visually-hidden' : false, check ? 'form-check-label' : false, size ? `col-form-label-${size}` : false, colClasses, colFormLabel ? 'col-form-label' : false, formLabel ? 'form-label' : false), cssModule);
|
5333 | return React.createElement(Tag, _extends({
|
5334 | htmlFor: htmlFor
|
5335 | }, attributes, {
|
5336 | className: classes
|
5337 | }));
|
5338 | };
|
5339 |
|
5340 | Label.propTypes = propTypes$m;
|
5341 | Label.defaultProps = defaultProps$l;
|
5342 | var Label$1 = Label;
|
5343 |
|
5344 | const _excluded$i = ["body", "bottom", "className", "cssModule", "heading", "left", "list", "middle", "object", "right", "tag", "top"];
|
5345 | const propTypes$l = {
|
5346 | body: PropTypes.bool,
|
5347 | bottom: PropTypes.bool,
|
5348 | children: PropTypes.node,
|
5349 | className: PropTypes.string,
|
5350 | cssModule: PropTypes.object,
|
5351 | heading: PropTypes.bool,
|
5352 | left: PropTypes.bool,
|
5353 | list: PropTypes.bool,
|
5354 | middle: PropTypes.bool,
|
5355 | object: PropTypes.bool,
|
5356 | right: PropTypes.bool,
|
5357 | tag: tagPropType,
|
5358 | top: PropTypes.bool
|
5359 | };
|
5360 |
|
5361 | const Media = props => {
|
5362 | const {
|
5363 | body,
|
5364 | bottom,
|
5365 | className,
|
5366 | cssModule,
|
5367 | heading,
|
5368 | left,
|
5369 | list,
|
5370 | middle,
|
5371 | object,
|
5372 | right,
|
5373 | tag,
|
5374 | top
|
5375 | } = props,
|
5376 | attributes = _objectWithoutProperties(props, _excluded$i);
|
5377 |
|
5378 | let defaultTag;
|
5379 |
|
5380 | if (heading) {
|
5381 | defaultTag = 'h4';
|
5382 | } else if (attributes.href) {
|
5383 | defaultTag = 'a';
|
5384 | } else if (attributes.src || object) {
|
5385 | defaultTag = 'img';
|
5386 | } else if (list) {
|
5387 | defaultTag = 'ul';
|
5388 | } else {
|
5389 | defaultTag = 'div';
|
5390 | }
|
5391 |
|
5392 | const Tag = tag || defaultTag;
|
5393 | const classes = mapToCssModules(classNames(className, {
|
5394 | 'media-body': body,
|
5395 | 'media-heading': heading,
|
5396 | 'media-left': left,
|
5397 | 'media-right': right,
|
5398 | 'media-top': top,
|
5399 | 'media-bottom': bottom,
|
5400 | 'media-middle': middle,
|
5401 | 'media-object': object,
|
5402 | 'media-list': list,
|
5403 | media: !body && !heading && !left && !right && !top && !bottom && !middle && !object && !list
|
5404 | }), cssModule);
|
5405 | return React.createElement(Tag, _extends({}, attributes, {
|
5406 | className: classes
|
5407 | }));
|
5408 | };
|
5409 |
|
5410 | Media.propTypes = propTypes$l;
|
5411 | var Media$1 = Media;
|
5412 |
|
5413 | function noop() {}
|
5414 |
|
5415 | const FadePropTypes = PropTypes.shape(Fade.propTypes);
|
5416 | const propTypes$k = {
|
5417 | autoFocus: PropTypes.bool,
|
5418 | backdrop: PropTypes.bool,
|
5419 | backdropClassName: PropTypes.string,
|
5420 | backdropTransition: FadePropTypes,
|
5421 | children: PropTypes.node,
|
5422 | className: PropTypes.string,
|
5423 | container: targetPropType,
|
5424 | cssModule: PropTypes.object,
|
5425 | direction: PropTypes.oneOf(['start', 'end', 'bottom', 'top']),
|
5426 | fade: PropTypes.bool,
|
5427 | innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.string, PropTypes.func]),
|
5428 | isOpen: PropTypes.bool,
|
5429 | keyboard: PropTypes.bool,
|
5430 | labelledBy: PropTypes.string,
|
5431 | offcanvasTransition: FadePropTypes,
|
5432 | onClosed: PropTypes.func,
|
5433 | onEnter: PropTypes.func,
|
5434 | onExit: PropTypes.func,
|
5435 | onOpened: PropTypes.func,
|
5436 | returnFocusAfterClose: PropTypes.bool,
|
5437 | role: PropTypes.string,
|
5438 | scrollable: PropTypes.bool,
|
5439 | toggle: PropTypes.func,
|
5440 | trapFocus: PropTypes.bool,
|
5441 | unmountOnClose: PropTypes.bool,
|
5442 | zIndex: PropTypes.oneOfType([PropTypes.number, PropTypes.string])
|
5443 | };
|
5444 | const propsToOmit = Object.keys(propTypes$k);
|
5445 | const defaultProps$k = {
|
5446 | isOpen: false,
|
5447 | autoFocus: true,
|
5448 | direction: 'start',
|
5449 | scrollable: false,
|
5450 | role: 'dialog',
|
5451 | backdrop: true,
|
5452 | keyboard: true,
|
5453 | zIndex: 1050,
|
5454 | fade: true,
|
5455 | onOpened: noop,
|
5456 | onClosed: noop,
|
5457 | offcanvasTransition: {
|
5458 | timeout: TransitionTimeouts.Offcanvas
|
5459 | },
|
5460 | backdropTransition: {
|
5461 | mountOnEnter: true,
|
5462 | timeout: TransitionTimeouts.Fade
|
5463 |
|
5464 | },
|
5465 | unmountOnClose: true,
|
5466 | returnFocusAfterClose: true,
|
5467 | container: 'body',
|
5468 | trapFocus: false
|
5469 | };
|
5470 |
|
5471 | class Offcanvas extends React.Component {
|
5472 | constructor(props) {
|
5473 | super(props);
|
5474 | this._element = null;
|
5475 | this._originalBodyPadding = null;
|
5476 | this.getFocusableChildren = this.getFocusableChildren.bind(this);
|
5477 | this.handleBackdropClick = this.handleBackdropClick.bind(this);
|
5478 | this.handleBackdropMouseDown = this.handleBackdropMouseDown.bind(this);
|
5479 | this.handleEscape = this.handleEscape.bind(this);
|
5480 | this.handleTab = this.handleTab.bind(this);
|
5481 | this.onOpened = this.onOpened.bind(this);
|
5482 | this.onClosed = this.onClosed.bind(this);
|
5483 | this.manageFocusAfterClose = this.manageFocusAfterClose.bind(this);
|
5484 | this.clearBackdropAnimationTimeout = this.clearBackdropAnimationTimeout.bind(this);
|
5485 | this.trapFocus = this.trapFocus.bind(this);
|
5486 | this.state = {
|
5487 | isOpen: false
|
5488 | };
|
5489 | }
|
5490 |
|
5491 | componentDidMount() {
|
5492 | const {
|
5493 | isOpen,
|
5494 | autoFocus,
|
5495 | onEnter
|
5496 | } = this.props;
|
5497 |
|
5498 | if (isOpen) {
|
5499 | this.init();
|
5500 | this.setState({
|
5501 | isOpen: true
|
5502 | });
|
5503 |
|
5504 | if (autoFocus) {
|
5505 | this.setFocus();
|
5506 | }
|
5507 | }
|
5508 |
|
5509 | if (onEnter) {
|
5510 | onEnter();
|
5511 | }
|
5512 |
|
5513 |
|
5514 | document.addEventListener('focus', this.trapFocus, true);
|
5515 | this._isMounted = true;
|
5516 | }
|
5517 |
|
5518 | componentDidUpdate(prevProps, prevState) {
|
5519 | if (this.props.isOpen && !prevProps.isOpen) {
|
5520 | this.init();
|
5521 | this.setState({
|
5522 | isOpen: true
|
5523 | });
|
5524 | return;
|
5525 | }
|
5526 |
|
5527 |
|
5528 | if (this.props.autoFocus && this.state.isOpen && !prevState.isOpen) {
|
5529 | this.setFocus();
|
5530 | }
|
5531 |
|
5532 | if (this._element && prevProps.zIndex !== this.props.zIndex) {
|
5533 | this._element.style.zIndex = this.props.zIndex;
|
5534 | }
|
5535 | }
|
5536 |
|
5537 | componentWillUnmount() {
|
5538 | this.clearBackdropAnimationTimeout();
|
5539 |
|
5540 | if (this.props.onExit) {
|
5541 | this.props.onExit();
|
5542 | }
|
5543 |
|
5544 | if (this._element) {
|
5545 | this.destroy();
|
5546 |
|
5547 | if (this.props.isOpen || this.state.isOpen) {
|
5548 | this.close();
|
5549 | }
|
5550 | }
|
5551 |
|
5552 | document.removeEventListener('focus', this.trapFocus, true);
|
5553 | this._isMounted = false;
|
5554 | }
|
5555 |
|
5556 | trapFocus(ev) {
|
5557 | if (!this.props.trapFocus) {
|
5558 | return;
|
5559 | }
|
5560 |
|
5561 | if (!this._element)
|
5562 | return;
|
5563 | if (this._dialog === ev.target)
|
5564 | return;
|
5565 | if (this.offcanvasIndex < Offcanvas.openCount - 1)
|
5566 | return;
|
5567 | const children = this.getFocusableChildren();
|
5568 |
|
5569 | for (let i = 0; i < children.length; i++) {
|
5570 |
|
5571 | if (children[i] === ev.target) return;
|
5572 | }
|
5573 |
|
5574 | if (children.length > 0) {
|
5575 |
|
5576 | ev.preventDefault();
|
5577 | ev.stopPropagation();
|
5578 | children[0].focus();
|
5579 | }
|
5580 | }
|
5581 |
|
5582 | onOpened(node, isAppearing) {
|
5583 | this.props.onOpened();
|
5584 | (this.props.offcanvasTransition.onEntered || noop)(node, isAppearing);
|
5585 | }
|
5586 |
|
5587 | onClosed(node) {
|
5588 | const {
|
5589 | unmountOnClose
|
5590 | } = this.props;
|
5591 |
|
5592 | this.props.onClosed();
|
5593 | (this.props.offcanvasTransition.onExited || noop)(node);
|
5594 |
|
5595 | if (unmountOnClose) {
|
5596 | this.destroy();
|
5597 | }
|
5598 |
|
5599 | this.close();
|
5600 |
|
5601 | if (this._isMounted) {
|
5602 | this.setState({
|
5603 | isOpen: false
|
5604 | });
|
5605 | }
|
5606 | }
|
5607 |
|
5608 | setFocus() {
|
5609 | if (this._dialog && typeof this._dialog.focus === 'function') {
|
5610 | this._dialog.focus();
|
5611 | }
|
5612 | }
|
5613 |
|
5614 | getFocusableChildren() {
|
5615 | return this._element.querySelectorAll(focusableElements.join(', '));
|
5616 | }
|
5617 |
|
5618 | getFocusedChild() {
|
5619 | let currentFocus;
|
5620 | const focusableChildren = this.getFocusableChildren();
|
5621 |
|
5622 | try {
|
5623 | currentFocus = document.activeElement;
|
5624 | } catch (err) {
|
5625 | currentFocus = focusableChildren[0];
|
5626 | }
|
5627 |
|
5628 | return currentFocus;
|
5629 | }
|
5630 |
|
5631 |
|
5632 | handleBackdropClick(e) {
|
5633 | if (e.target === this._mouseDownElement) {
|
5634 | e.stopPropagation();
|
5635 | const backdrop = this._backdrop;
|
5636 | if (!this.props.isOpen || this.props.backdrop !== true) return;
|
5637 |
|
5638 | if (backdrop && e.target === backdrop && this.props.toggle) {
|
5639 | this.props.toggle(e);
|
5640 | }
|
5641 | }
|
5642 | }
|
5643 |
|
5644 | handleTab(e) {
|
5645 | if (e.which !== 9) return;
|
5646 | if (this.offcanvasIndex < Offcanvas.openCount - 1) return;
|
5647 |
|
5648 | const focusableChildren = this.getFocusableChildren();
|
5649 | const totalFocusable = focusableChildren.length;
|
5650 | if (totalFocusable === 0) return;
|
5651 | const currentFocus = this.getFocusedChild();
|
5652 | let focusedIndex = 0;
|
5653 |
|
5654 | for (let i = 0; i < totalFocusable; i += 1) {
|
5655 | if (focusableChildren[i] === currentFocus) {
|
5656 | focusedIndex = i;
|
5657 | break;
|
5658 | }
|
5659 | }
|
5660 |
|
5661 | if (e.shiftKey && focusedIndex === 0) {
|
5662 | e.preventDefault();
|
5663 | focusableChildren[totalFocusable - 1].focus();
|
5664 | } else if (!e.shiftKey && focusedIndex === totalFocusable - 1) {
|
5665 | e.preventDefault();
|
5666 | focusableChildren[0].focus();
|
5667 | }
|
5668 | }
|
5669 |
|
5670 | handleBackdropMouseDown(e) {
|
5671 | this._mouseDownElement = e.target;
|
5672 | }
|
5673 |
|
5674 | handleEscape(e) {
|
5675 | if (this.props.isOpen && e.keyCode === keyCodes.esc && this.props.toggle) {
|
5676 | if (this.props.keyboard) {
|
5677 | e.preventDefault();
|
5678 | e.stopPropagation();
|
5679 | this.props.toggle(e);
|
5680 | }
|
5681 | }
|
5682 | }
|
5683 |
|
5684 | init() {
|
5685 | try {
|
5686 | this._triggeringElement = document.activeElement;
|
5687 | } catch (err) {
|
5688 | this._triggeringElement = null;
|
5689 | }
|
5690 |
|
5691 | if (!this._element) {
|
5692 | this._element = document.createElement('div');
|
5693 |
|
5694 | this._element.setAttribute('tabindex', '-1');
|
5695 |
|
5696 | this._element.style.position = 'relative';
|
5697 | this._element.style.zIndex = this.props.zIndex;
|
5698 | this._mountContainer = getTarget(this.props.container);
|
5699 |
|
5700 | this._mountContainer.appendChild(this._element);
|
5701 | }
|
5702 |
|
5703 | this._originalBodyPadding = getOriginalBodyPadding();
|
5704 | conditionallyUpdateScrollbar();
|
5705 |
|
5706 | if (Offcanvas.openCount === 0 && this.props.backdrop && !this.props.scrollable) {
|
5707 | document.body.style.overflow = 'hidden';
|
5708 | }
|
5709 |
|
5710 | this.offcanvasIndex = Offcanvas.openCount;
|
5711 | Offcanvas.openCount += 1;
|
5712 | }
|
5713 |
|
5714 | destroy() {
|
5715 | if (this._element) {
|
5716 | this._mountContainer.removeChild(this._element);
|
5717 |
|
5718 | this._element = null;
|
5719 | }
|
5720 |
|
5721 | this.manageFocusAfterClose();
|
5722 | }
|
5723 |
|
5724 | manageFocusAfterClose() {
|
5725 | if (this._triggeringElement) {
|
5726 | const {
|
5727 | returnFocusAfterClose
|
5728 | } = this.props;
|
5729 | if (this._triggeringElement.focus && returnFocusAfterClose) this._triggeringElement.focus();
|
5730 | this._triggeringElement = null;
|
5731 | }
|
5732 | }
|
5733 |
|
5734 | close() {
|
5735 | this.manageFocusAfterClose();
|
5736 | Offcanvas.openCount = Math.max(0, Offcanvas.openCount - 1);
|
5737 | document.body.style.overflow = null;
|
5738 | setScrollbarWidth(this._originalBodyPadding);
|
5739 | }
|
5740 |
|
5741 | render() {
|
5742 | const {
|
5743 | direction,
|
5744 | unmountOnClose
|
5745 | } = this.props;
|
5746 |
|
5747 | if (!!this._element && (this.state.isOpen || !unmountOnClose)) {
|
5748 | const isOffcanvasHidden = !!this._element && !this.state.isOpen && !unmountOnClose;
|
5749 | this._element.style.display = isOffcanvasHidden ? 'none' : 'block';
|
5750 | const {
|
5751 | className,
|
5752 | backdropClassName,
|
5753 | cssModule,
|
5754 | isOpen,
|
5755 | backdrop,
|
5756 | role,
|
5757 | labelledBy,
|
5758 | style
|
5759 | } = this.props;
|
5760 | const offcanvasAttributes = {
|
5761 | onKeyUp: this.handleEscape,
|
5762 | onKeyDown: this.handleTab,
|
5763 | 'aria-labelledby': labelledBy,
|
5764 | role,
|
5765 | tabIndex: '-1'
|
5766 | };
|
5767 | const hasTransition = this.props.fade;
|
5768 |
|
5769 | const offcanvasTransition = _objectSpread2(_objectSpread2(_objectSpread2({}, Fade.defaultProps), this.props.offcanvasTransition), {}, {
|
5770 | baseClass: hasTransition ? this.props.offcanvasTransition.baseClass : '',
|
5771 | timeout: hasTransition ? this.props.offcanvasTransition.timeout : 0
|
5772 | });
|
5773 |
|
5774 | const backdropTransition = _objectSpread2(_objectSpread2(_objectSpread2({}, Fade.defaultProps), this.props.backdropTransition), {}, {
|
5775 | baseClass: hasTransition ? this.props.backdropTransition.baseClass : '',
|
5776 | timeout: hasTransition ? this.props.backdropTransition.timeout : 0
|
5777 | });
|
5778 |
|
5779 | const Backdrop = backdrop && (hasTransition ? React.createElement(Fade, _extends({}, backdropTransition, {
|
5780 | in: isOpen && !!backdrop,
|
5781 | innerRef: c => {
|
5782 | this._backdrop = c;
|
5783 | },
|
5784 | cssModule: cssModule,
|
5785 | className: mapToCssModules(classNames('offcanvas-backdrop', backdropClassName), cssModule),
|
5786 | onClick: this.handleBackdropClick,
|
5787 | onMouseDown: this.handleBackdropMouseDown
|
5788 | })) : React.createElement("div", {
|
5789 | className: mapToCssModules(classNames('offcanvas-backdrop', 'show', backdropClassName), cssModule),
|
5790 | onClick: this.handleBackdropClick,
|
5791 | onMouseDown: this.handleBackdropMouseDown
|
5792 | }));
|
5793 | const attributes = omit(this.props, propsToOmit);
|
5794 | return React.createElement(Portal$1, {
|
5795 | node: this._element
|
5796 | }, React.createElement(Fade, _extends({}, attributes, offcanvasAttributes, offcanvasTransition, {
|
5797 | in: isOpen,
|
5798 | onEntered: this.onOpened,
|
5799 | onExited: this.onClosed,
|
5800 | cssModule: cssModule,
|
5801 | className: mapToCssModules(classNames('offcanvas', className, `offcanvas-${direction}`), cssModule),
|
5802 | innerRef: c => {
|
5803 | this._dialog = c;
|
5804 | },
|
5805 | style: _objectSpread2(_objectSpread2({}, style), {}, {
|
5806 | visibility: isOpen ? 'visible' : 'hidden'
|
5807 | })
|
5808 | }), this.props.children), Backdrop);
|
5809 | }
|
5810 |
|
5811 | return null;
|
5812 | }
|
5813 |
|
5814 | clearBackdropAnimationTimeout() {
|
5815 | if (this._backdropAnimationTimeout) {
|
5816 | clearTimeout(this._backdropAnimationTimeout);
|
5817 | this._backdropAnimationTimeout = undefined;
|
5818 | }
|
5819 | }
|
5820 |
|
5821 | }
|
5822 |
|
5823 | Offcanvas.propTypes = propTypes$k;
|
5824 | Offcanvas.defaultProps = defaultProps$k;
|
5825 | Offcanvas.openCount = 0;
|
5826 | var Offcanvas$1 = Offcanvas;
|
5827 |
|
5828 | const _excluded$h = ["className", "cssModule", "tag"];
|
5829 | const propTypes$j = {
|
5830 | tag: tagPropType,
|
5831 | className: PropTypes.string,
|
5832 | cssModule: PropTypes.object
|
5833 | };
|
5834 | const defaultProps$j = {
|
5835 | tag: 'div'
|
5836 | };
|
5837 |
|
5838 | const OffcanvasBody = props => {
|
5839 | const {
|
5840 | className,
|
5841 | cssModule,
|
5842 | tag: Tag
|
5843 | } = props,
|
5844 | attributes = _objectWithoutProperties(props, _excluded$h);
|
5845 |
|
5846 | const classes = mapToCssModules(classNames(className, 'offcanvas-body'), cssModule);
|
5847 | return React.createElement(Tag, _extends({}, attributes, {
|
5848 | className: classes
|
5849 | }));
|
5850 | };
|
5851 |
|
5852 | OffcanvasBody.propTypes = propTypes$j;
|
5853 | OffcanvasBody.defaultProps = defaultProps$j;
|
5854 | var OffcanvasBody$1 = OffcanvasBody;
|
5855 |
|
5856 | const _excluded$g = ["children", "className", "close", "closeAriaLabel", "cssModule", "tag", "toggle", "wrapTag"];
|
5857 | const propTypes$i = {
|
5858 | children: PropTypes.node,
|
5859 | className: PropTypes.string,
|
5860 | close: PropTypes.object,
|
5861 | closeAriaLabel: PropTypes.string,
|
5862 | cssModule: PropTypes.object,
|
5863 | tag: tagPropType,
|
5864 | toggle: PropTypes.func,
|
5865 | wrapTag: tagPropType
|
5866 | };
|
5867 | const defaultProps$i = {
|
5868 | closeAriaLabel: 'Close',
|
5869 | tag: 'h5',
|
5870 | wrapTag: 'div'
|
5871 | };
|
5872 |
|
5873 | const OffcanvasHeader = props => {
|
5874 | let closeButton;
|
5875 |
|
5876 | const {
|
5877 | children,
|
5878 | className,
|
5879 | close,
|
5880 | closeAriaLabel,
|
5881 | cssModule,
|
5882 | tag: Tag,
|
5883 | toggle,
|
5884 | wrapTag: WrapTag
|
5885 | } = props,
|
5886 | attributes = _objectWithoutProperties(props, _excluded$g);
|
5887 |
|
5888 | const classes = mapToCssModules(classNames(className, 'offcanvas-header'), cssModule);
|
5889 |
|
5890 | if (!close && toggle) {
|
5891 | closeButton = React.createElement("button", {
|
5892 | type: "button",
|
5893 | onClick: toggle,
|
5894 | className: mapToCssModules('btn-close', cssModule),
|
5895 | "aria-label": closeAriaLabel
|
5896 | });
|
5897 | }
|
5898 |
|
5899 | return React.createElement(WrapTag, _extends({}, attributes, {
|
5900 | className: classes
|
5901 | }), React.createElement(Tag, {
|
5902 | className: mapToCssModules('offcanvas-title', cssModule)
|
5903 | }, children), close || closeButton);
|
5904 | };
|
5905 |
|
5906 | OffcanvasHeader.propTypes = propTypes$i;
|
5907 | OffcanvasHeader.defaultProps = defaultProps$i;
|
5908 | var OffcanvasHeader$1 = OffcanvasHeader;
|
5909 |
|
5910 | const _excluded$f = ["className", "listClassName", "cssModule", "size", "tag", "listTag", "aria-label"];
|
5911 | const propTypes$h = {
|
5912 | children: PropTypes.node,
|
5913 | className: PropTypes.string,
|
5914 | listClassName: PropTypes.string,
|
5915 | cssModule: PropTypes.object,
|
5916 | size: PropTypes.string,
|
5917 | tag: tagPropType,
|
5918 | listTag: tagPropType,
|
5919 | 'aria-label': PropTypes.string
|
5920 | };
|
5921 | const defaultProps$h = {
|
5922 | tag: 'nav',
|
5923 | listTag: 'ul',
|
5924 | 'aria-label': 'pagination'
|
5925 | };
|
5926 |
|
5927 | const Pagination = props => {
|
5928 | const {
|
5929 | className,
|
5930 | listClassName,
|
5931 | cssModule,
|
5932 | size,
|
5933 | tag: Tag,
|
5934 | listTag: ListTag,
|
5935 | 'aria-label': label
|
5936 | } = props,
|
5937 | attributes = _objectWithoutProperties(props, _excluded$f);
|
5938 |
|
5939 | const classes = mapToCssModules(classNames(className), cssModule);
|
5940 | const listClasses = mapToCssModules(classNames(listClassName, 'pagination', {
|
5941 | [`pagination-${size}`]: !!size
|
5942 | }), cssModule);
|
5943 | return React.createElement(Tag, {
|
5944 | className: classes,
|
5945 | "aria-label": label
|
5946 | }, React.createElement(ListTag, _extends({}, attributes, {
|
5947 | className: listClasses
|
5948 | })));
|
5949 | };
|
5950 |
|
5951 | Pagination.propTypes = propTypes$h;
|
5952 | Pagination.defaultProps = defaultProps$h;
|
5953 | var Pagination$1 = Pagination;
|
5954 |
|
5955 | const _excluded$e = ["active", "className", "cssModule", "disabled", "tag"];
|
5956 | const propTypes$g = {
|
5957 | active: PropTypes.bool,
|
5958 | children: PropTypes.node,
|
5959 | className: PropTypes.string,
|
5960 | cssModule: PropTypes.object,
|
5961 | disabled: PropTypes.bool,
|
5962 | tag: tagPropType
|
5963 | };
|
5964 | const defaultProps$g = {
|
5965 | tag: 'li'
|
5966 | };
|
5967 |
|
5968 | const PaginationItem = props => {
|
5969 | const {
|
5970 | active,
|
5971 | className,
|
5972 | cssModule,
|
5973 | disabled,
|
5974 | tag: Tag
|
5975 | } = props,
|
5976 | attributes = _objectWithoutProperties(props, _excluded$e);
|
5977 |
|
5978 | const classes = mapToCssModules(classNames(className, 'page-item', {
|
5979 | active,
|
5980 | disabled
|
5981 | }), cssModule);
|
5982 | return React.createElement(Tag, _extends({}, attributes, {
|
5983 | className: classes
|
5984 | }));
|
5985 | };
|
5986 |
|
5987 | PaginationItem.propTypes = propTypes$g;
|
5988 | PaginationItem.defaultProps = defaultProps$g;
|
5989 | var PaginationItem$1 = PaginationItem;
|
5990 |
|
5991 | const _excluded$d = ["className", "cssModule", "next", "previous", "first", "last", "tag"];
|
5992 | const propTypes$f = {
|
5993 | 'aria-label': PropTypes.string,
|
5994 | children: PropTypes.node,
|
5995 | className: PropTypes.string,
|
5996 | cssModule: PropTypes.object,
|
5997 | next: PropTypes.bool,
|
5998 | previous: PropTypes.bool,
|
5999 | first: PropTypes.bool,
|
6000 | last: PropTypes.bool,
|
6001 | tag: tagPropType
|
6002 | };
|
6003 | const defaultProps$f = {
|
6004 | tag: 'a'
|
6005 | };
|
6006 |
|
6007 | const PaginationLink = props => {
|
6008 | let {
|
6009 | className,
|
6010 | cssModule,
|
6011 | next,
|
6012 | previous,
|
6013 | first,
|
6014 | last,
|
6015 | tag: Tag
|
6016 | } = props,
|
6017 | attributes = _objectWithoutProperties(props, _excluded$d);
|
6018 |
|
6019 | const classes = mapToCssModules(classNames(className, 'page-link'), cssModule);
|
6020 | let defaultAriaLabel;
|
6021 |
|
6022 | if (previous) {
|
6023 | defaultAriaLabel = 'Previous';
|
6024 | } else if (next) {
|
6025 | defaultAriaLabel = 'Next';
|
6026 | } else if (first) {
|
6027 | defaultAriaLabel = 'First';
|
6028 | } else if (last) {
|
6029 | defaultAriaLabel = 'Last';
|
6030 | }
|
6031 |
|
6032 | const ariaLabel = props['aria-label'] || defaultAriaLabel;
|
6033 | let defaultCaret;
|
6034 |
|
6035 | if (previous) {
|
6036 | defaultCaret = '\u2039';
|
6037 | } else if (next) {
|
6038 | defaultCaret = '\u203A';
|
6039 | } else if (first) {
|
6040 | defaultCaret = '\u00ab';
|
6041 | } else if (last) {
|
6042 | defaultCaret = '\u00bb';
|
6043 | }
|
6044 |
|
6045 | let children = props.children;
|
6046 |
|
6047 | if (children && Array.isArray(children) && children.length === 0) {
|
6048 | children = null;
|
6049 | }
|
6050 |
|
6051 | if (!attributes.href && Tag === 'a') {
|
6052 | Tag = 'button';
|
6053 | }
|
6054 |
|
6055 | if (previous || next || first || last) {
|
6056 | children = [React.createElement("span", {
|
6057 | "aria-hidden": "true",
|
6058 | key: "caret"
|
6059 | }, children || defaultCaret), React.createElement("span", {
|
6060 | className: "visually-hidden",
|
6061 | key: "ariaLabel"
|
6062 | }, ariaLabel)];
|
6063 | }
|
6064 |
|
6065 | return React.createElement(Tag, _extends({}, attributes, {
|
6066 | className: classes,
|
6067 | "aria-label": ariaLabel
|
6068 | }), children);
|
6069 | };
|
6070 |
|
6071 | PaginationLink.propTypes = propTypes$f;
|
6072 | PaginationLink.defaultProps = defaultProps$f;
|
6073 | var PaginationLink$1 = PaginationLink;
|
6074 |
|
6075 |
|
6076 |
|
6077 |
|
6078 |
|
6079 |
|
6080 |
|
6081 |
|
6082 | const TabContext = React.createContext({});
|
6083 |
|
6084 | const propTypes$e = {
|
6085 | tag: tagPropType,
|
6086 | activeTab: PropTypes.any,
|
6087 | className: PropTypes.string,
|
6088 | cssModule: PropTypes.object
|
6089 | };
|
6090 | const defaultProps$e = {
|
6091 | tag: 'div'
|
6092 | };
|
6093 |
|
6094 | class TabContent extends Component {
|
6095 | static getDerivedStateFromProps(nextProps, prevState) {
|
6096 | if (prevState.activeTab !== nextProps.activeTab) {
|
6097 | return {
|
6098 | activeTab: nextProps.activeTab
|
6099 | };
|
6100 | }
|
6101 |
|
6102 | return null;
|
6103 | }
|
6104 |
|
6105 | constructor(props) {
|
6106 | super(props);
|
6107 | this.state = {
|
6108 | activeTab: this.props.activeTab
|
6109 | };
|
6110 | }
|
6111 |
|
6112 | render() {
|
6113 | const {
|
6114 | className,
|
6115 | cssModule,
|
6116 | tag: Tag
|
6117 | } = this.props;
|
6118 | const attributes = omit(this.props, Object.keys(propTypes$e));
|
6119 | const classes = mapToCssModules(classNames('tab-content', className), cssModule);
|
6120 | return React.createElement(TabContext.Provider, {
|
6121 | value: {
|
6122 | activeTabId: this.state.activeTab
|
6123 | }
|
6124 | }, React.createElement(Tag, _extends({}, attributes, {
|
6125 | className: classes
|
6126 | })));
|
6127 | }
|
6128 |
|
6129 | }
|
6130 |
|
6131 | var TabContent$1 = TabContent;
|
6132 | TabContent.propTypes = propTypes$e;
|
6133 | TabContent.defaultProps = defaultProps$e;
|
6134 |
|
6135 | const _excluded$c = ["className", "cssModule", "tabId", "tag"];
|
6136 | const propTypes$d = {
|
6137 | tag: tagPropType,
|
6138 | className: PropTypes.string,
|
6139 | cssModule: PropTypes.object,
|
6140 | tabId: PropTypes.any
|
6141 | };
|
6142 | const defaultProps$d = {
|
6143 | tag: 'div'
|
6144 | };
|
6145 | function TabPane(props) {
|
6146 | const {
|
6147 | className,
|
6148 | cssModule,
|
6149 | tabId,
|
6150 | tag: Tag
|
6151 | } = props,
|
6152 | attributes = _objectWithoutProperties(props, _excluded$c);
|
6153 |
|
6154 | const getClasses = activeTabId => mapToCssModules(classNames('tab-pane', className, {
|
6155 | active: tabId === activeTabId
|
6156 | }), cssModule);
|
6157 |
|
6158 | return React.createElement(TabContext.Consumer, null, ({
|
6159 | activeTabId
|
6160 | }) => React.createElement(Tag, _extends({}, attributes, {
|
6161 | className: getClasses(activeTabId)
|
6162 | })));
|
6163 | }
|
6164 | TabPane.propTypes = propTypes$d;
|
6165 | TabPane.defaultProps = defaultProps$d;
|
6166 |
|
6167 | const _excluded$b = ["className", "closeClassName", "closeAriaLabel", "cssModule", "tag", "color", "isOpen", "toggle", "children", "transition", "fade", "innerRef"];
|
6168 | const propTypes$c = {
|
6169 | children: PropTypes.node,
|
6170 | className: PropTypes.string,
|
6171 | closeClassName: PropTypes.string,
|
6172 | closeAriaLabel: PropTypes.string,
|
6173 | cssModule: PropTypes.object,
|
6174 | color: PropTypes.string,
|
6175 | fade: PropTypes.bool,
|
6176 | isOpen: PropTypes.bool,
|
6177 | toggle: PropTypes.func,
|
6178 | tag: tagPropType,
|
6179 | transition: PropTypes.shape(Fade.propTypes),
|
6180 | innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.string, PropTypes.func])
|
6181 | };
|
6182 | const defaultProps$c = {
|
6183 | color: 'success',
|
6184 | isOpen: true,
|
6185 | tag: 'div',
|
6186 | closeAriaLabel: 'Close',
|
6187 | fade: true,
|
6188 | transition: _objectSpread2(_objectSpread2({}, Fade.defaultProps), {}, {
|
6189 | unmountOnExit: true
|
6190 | })
|
6191 | };
|
6192 |
|
6193 | function Alert(props) {
|
6194 | const {
|
6195 | className,
|
6196 | closeClassName,
|
6197 | closeAriaLabel,
|
6198 | cssModule,
|
6199 | tag: Tag,
|
6200 | color,
|
6201 | isOpen,
|
6202 | toggle,
|
6203 | children,
|
6204 | transition,
|
6205 | fade,
|
6206 | innerRef
|
6207 | } = props,
|
6208 | attributes = _objectWithoutProperties(props, _excluded$b);
|
6209 |
|
6210 | const classes = mapToCssModules(classNames(className, 'alert', `alert-${color}`, {
|
6211 | 'alert-dismissible': toggle
|
6212 | }), cssModule);
|
6213 | const closeClasses = mapToCssModules(classNames('btn-close', closeClassName), cssModule);
|
6214 |
|
6215 | const alertTransition = _objectSpread2(_objectSpread2(_objectSpread2({}, Fade.defaultProps), transition), {}, {
|
6216 | baseClass: fade ? transition.baseClass : '',
|
6217 | timeout: fade ? transition.timeout : 0
|
6218 | });
|
6219 |
|
6220 | return React.createElement(Fade, _extends({}, attributes, alertTransition, {
|
6221 | tag: Tag,
|
6222 | className: classes,
|
6223 | in: isOpen,
|
6224 | role: "alert",
|
6225 | innerRef: innerRef
|
6226 | }), toggle ? React.createElement("button", {
|
6227 | type: "button",
|
6228 | className: closeClasses,
|
6229 | "aria-label": closeAriaLabel,
|
6230 | onClick: toggle
|
6231 | }) : null, children);
|
6232 | }
|
6233 |
|
6234 | Alert.propTypes = propTypes$c;
|
6235 | Alert.defaultProps = defaultProps$c;
|
6236 |
|
6237 | const _excluded$a = ["className", "cssModule", "tag", "isOpen", "children", "transition", "fade", "innerRef"];
|
6238 | const propTypes$b = {
|
6239 | children: PropTypes.node,
|
6240 | className: PropTypes.string,
|
6241 | cssModule: PropTypes.object,
|
6242 | fade: PropTypes.bool,
|
6243 | isOpen: PropTypes.bool,
|
6244 | tag: tagPropType,
|
6245 | transition: PropTypes.shape(Fade.propTypes),
|
6246 | innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.string, PropTypes.func])
|
6247 | };
|
6248 | const defaultProps$b = {
|
6249 | isOpen: true,
|
6250 | tag: 'div',
|
6251 | fade: true,
|
6252 | transition: _objectSpread2(_objectSpread2({}, Fade.defaultProps), {}, {
|
6253 | unmountOnExit: true
|
6254 | })
|
6255 | };
|
6256 |
|
6257 | function Toast(props) {
|
6258 | const {
|
6259 | className,
|
6260 | cssModule,
|
6261 | tag: Tag,
|
6262 | isOpen,
|
6263 | children,
|
6264 | transition,
|
6265 | fade,
|
6266 | innerRef
|
6267 | } = props,
|
6268 | attributes = _objectWithoutProperties(props, _excluded$a);
|
6269 |
|
6270 | const classes = mapToCssModules(classNames(className, 'toast'), cssModule);
|
6271 |
|
6272 | const toastTransition = _objectSpread2(_objectSpread2(_objectSpread2({}, Fade.defaultProps), transition), {}, {
|
6273 | baseClass: fade ? transition.baseClass : '',
|
6274 | timeout: fade ? transition.timeout : 0
|
6275 | });
|
6276 |
|
6277 | return React.createElement(Fade, _extends({}, attributes, toastTransition, {
|
6278 | tag: Tag,
|
6279 | className: classes,
|
6280 | in: isOpen,
|
6281 | role: "alert",
|
6282 | innerRef: innerRef
|
6283 | }), children);
|
6284 | }
|
6285 |
|
6286 | Toast.propTypes = propTypes$b;
|
6287 | Toast.defaultProps = defaultProps$b;
|
6288 |
|
6289 | const _excluded$9 = ["className", "cssModule", "innerRef", "tag"];
|
6290 | const propTypes$a = {
|
6291 | tag: tagPropType,
|
6292 | className: PropTypes.string,
|
6293 | cssModule: PropTypes.object,
|
6294 | innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.string, PropTypes.func])
|
6295 | };
|
6296 | const defaultProps$a = {
|
6297 | tag: 'div'
|
6298 | };
|
6299 |
|
6300 | const ToastBody = props => {
|
6301 | const {
|
6302 | className,
|
6303 | cssModule,
|
6304 | innerRef,
|
6305 | tag: Tag
|
6306 | } = props,
|
6307 | attributes = _objectWithoutProperties(props, _excluded$9);
|
6308 |
|
6309 | const classes = mapToCssModules(classNames(className, 'toast-body'), cssModule);
|
6310 | return React.createElement(Tag, _extends({}, attributes, {
|
6311 | className: classes,
|
6312 | ref: innerRef
|
6313 | }));
|
6314 | };
|
6315 |
|
6316 | ToastBody.propTypes = propTypes$a;
|
6317 | ToastBody.defaultProps = defaultProps$a;
|
6318 | var ToastBody$1 = ToastBody;
|
6319 |
|
6320 | const _excluded$8 = ["className", "cssModule", "children", "toggle", "tag", "wrapTag", "closeAriaLabel", "close", "tagClassName", "icon"];
|
6321 | const propTypes$9 = {
|
6322 | tag: tagPropType,
|
6323 | icon: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
|
6324 | wrapTag: tagPropType,
|
6325 | toggle: PropTypes.func,
|
6326 | className: PropTypes.string,
|
6327 | cssModule: PropTypes.object,
|
6328 | children: PropTypes.node,
|
6329 | closeAriaLabel: PropTypes.string,
|
6330 | charCode: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
|
6331 | close: PropTypes.object
|
6332 | };
|
6333 | const defaultProps$9 = {
|
6334 | tag: 'strong',
|
6335 | wrapTag: 'div',
|
6336 | tagClassName: 'me-auto',
|
6337 | closeAriaLabel: 'Close'
|
6338 | };
|
6339 |
|
6340 | const ToastHeader = props => {
|
6341 | let closeButton;
|
6342 | let icon;
|
6343 |
|
6344 | const {
|
6345 | className,
|
6346 | cssModule,
|
6347 | children,
|
6348 | toggle,
|
6349 | tag: Tag,
|
6350 | wrapTag: WrapTag,
|
6351 | closeAriaLabel,
|
6352 | close,
|
6353 | tagClassName,
|
6354 | icon: iconProp
|
6355 | } = props,
|
6356 | attributes = _objectWithoutProperties(props, _excluded$8);
|
6357 |
|
6358 | const classes = mapToCssModules(classNames(className, 'toast-header'), cssModule);
|
6359 |
|
6360 | if (!close && toggle) {
|
6361 | closeButton = React.createElement("button", {
|
6362 | type: "button",
|
6363 | onClick: toggle,
|
6364 | className: mapToCssModules('btn-close', cssModule),
|
6365 | "aria-label": closeAriaLabel
|
6366 | });
|
6367 | }
|
6368 |
|
6369 | if (typeof iconProp === "string") {
|
6370 | icon = React.createElement("svg", {
|
6371 | className: mapToCssModules(`rounded text-${iconProp}`),
|
6372 | width: "20",
|
6373 | height: "20",
|
6374 | xmlns: "http://www.w3.org/2000/svg",
|
6375 | preserveAspectRatio: "xMidYMid slice",
|
6376 | focusable: "false",
|
6377 | role: "img"
|
6378 | }, React.createElement("rect", {
|
6379 | fill: "currentColor",
|
6380 | width: "100%",
|
6381 | height: "100%"
|
6382 | }));
|
6383 | } else if (iconProp) {
|
6384 | icon = iconProp;
|
6385 | }
|
6386 |
|
6387 | return React.createElement(WrapTag, _extends({}, attributes, {
|
6388 | className: classes
|
6389 | }), icon, React.createElement(Tag, {
|
6390 | className: mapToCssModules(classNames(tagClassName, {
|
6391 | "ms-2": icon != null
|
6392 | }), cssModule)
|
6393 | }, children), close || closeButton);
|
6394 | };
|
6395 |
|
6396 | ToastHeader.propTypes = propTypes$9;
|
6397 | ToastHeader.defaultProps = defaultProps$9;
|
6398 | var ToastHeader$1 = ToastHeader;
|
6399 |
|
6400 | const _excluded$7 = ["className", "cssModule", "tag", "active", "disabled", "action", "color"];
|
6401 | const propTypes$8 = {
|
6402 | tag: tagPropType,
|
6403 | active: PropTypes.bool,
|
6404 | disabled: PropTypes.bool,
|
6405 | color: PropTypes.string,
|
6406 | action: PropTypes.bool,
|
6407 | className: PropTypes.any,
|
6408 | cssModule: PropTypes.object
|
6409 | };
|
6410 | const defaultProps$8 = {
|
6411 | tag: 'li'
|
6412 | };
|
6413 |
|
6414 | const handleDisabledOnClick = e => {
|
6415 | e.preventDefault();
|
6416 | };
|
6417 |
|
6418 | const ListGroupItem = props => {
|
6419 | const {
|
6420 | className,
|
6421 | cssModule,
|
6422 | tag: Tag,
|
6423 | active,
|
6424 | disabled,
|
6425 | action,
|
6426 | color
|
6427 | } = props,
|
6428 | attributes = _objectWithoutProperties(props, _excluded$7);
|
6429 |
|
6430 | const classes = mapToCssModules(classNames(className, active ? 'active' : false, disabled ? 'disabled' : false, action ? 'list-group-item-action' : false, color ? `list-group-item-${color}` : false, 'list-group-item'), cssModule);
|
6431 |
|
6432 | if (disabled) {
|
6433 | attributes.onClick = handleDisabledOnClick;
|
6434 | }
|
6435 |
|
6436 | return React.createElement(Tag, _extends({}, attributes, {
|
6437 | className: classes
|
6438 | }));
|
6439 | };
|
6440 |
|
6441 | ListGroupItem.propTypes = propTypes$8;
|
6442 | ListGroupItem.defaultProps = defaultProps$8;
|
6443 | var ListGroupItem$1 = ListGroupItem;
|
6444 |
|
6445 | const _excluded$6 = ["className", "cssModule", "tag"];
|
6446 | const propTypes$7 = {
|
6447 | tag: tagPropType,
|
6448 | className: PropTypes.any,
|
6449 | cssModule: PropTypes.object
|
6450 | };
|
6451 | const defaultProps$7 = {
|
6452 | tag: 'h5'
|
6453 | };
|
6454 |
|
6455 | const ListGroupItemHeading = props => {
|
6456 | const {
|
6457 | className,
|
6458 | cssModule,
|
6459 | tag: Tag
|
6460 | } = props,
|
6461 | attributes = _objectWithoutProperties(props, _excluded$6);
|
6462 |
|
6463 | const classes = mapToCssModules(classNames(className, 'list-group-item-heading'), cssModule);
|
6464 | return React.createElement(Tag, _extends({}, attributes, {
|
6465 | className: classes
|
6466 | }));
|
6467 | };
|
6468 |
|
6469 | ListGroupItemHeading.propTypes = propTypes$7;
|
6470 | ListGroupItemHeading.defaultProps = defaultProps$7;
|
6471 | var ListGroupItemHeading$1 = ListGroupItemHeading;
|
6472 |
|
6473 | const _excluded$5 = ["className", "cssModule", "tag"];
|
6474 | const propTypes$6 = {
|
6475 | tag: tagPropType,
|
6476 | className: PropTypes.any,
|
6477 | cssModule: PropTypes.object
|
6478 | };
|
6479 | const defaultProps$6 = {
|
6480 | tag: 'p'
|
6481 | };
|
6482 |
|
6483 | const ListGroupItemText = props => {
|
6484 | const {
|
6485 | className,
|
6486 | cssModule,
|
6487 | tag: Tag
|
6488 | } = props,
|
6489 | attributes = _objectWithoutProperties(props, _excluded$5);
|
6490 |
|
6491 | const classes = mapToCssModules(classNames(className, 'list-group-item-text'), cssModule);
|
6492 | return React.createElement(Tag, _extends({}, attributes, {
|
6493 | className: classes
|
6494 | }));
|
6495 | };
|
6496 |
|
6497 | ListGroupItemText.propTypes = propTypes$6;
|
6498 | ListGroupItemText.defaultProps = defaultProps$6;
|
6499 | var ListGroupItemText$1 = ListGroupItemText;
|
6500 |
|
6501 | const _excluded$4 = ["className", "cssModule", "tag", "type"];
|
6502 | const propTypes$5 = {
|
6503 | tag: tagPropType,
|
6504 | className: PropTypes.string,
|
6505 | cssModule: PropTypes.object,
|
6506 | type: PropTypes.string
|
6507 | };
|
6508 | const defaultProps$5 = {
|
6509 | tag: 'ul'
|
6510 | };
|
6511 | const List = forwardRef((props, ref) => {
|
6512 | const {
|
6513 | className,
|
6514 | cssModule,
|
6515 | tag: Tag,
|
6516 | type
|
6517 | } = props,
|
6518 | attributes = _objectWithoutProperties(props, _excluded$4);
|
6519 |
|
6520 | const classes = mapToCssModules(classNames(className, type ? `list-${type}` : false), cssModule);
|
6521 | return React.createElement(Tag, _extends({}, attributes, {
|
6522 | className: classes,
|
6523 | ref: ref
|
6524 | }));
|
6525 | });
|
6526 | List.name = 'List';
|
6527 | List.propTypes = propTypes$5;
|
6528 | List.defaultProps = defaultProps$5;
|
6529 | var List$1 = List;
|
6530 |
|
6531 | const _excluded$3 = ["className", "cssModule", "tag"];
|
6532 | const propTypes$4 = {
|
6533 | tag: tagPropType,
|
6534 | className: PropTypes.string,
|
6535 | cssModule: PropTypes.object
|
6536 | };
|
6537 | const defaultProps$4 = {
|
6538 | tag: 'li'
|
6539 | };
|
6540 | const ListInlineItem = forwardRef((props, ref) => {
|
6541 | const {
|
6542 | className,
|
6543 | cssModule,
|
6544 | tag: Tag
|
6545 | } = props,
|
6546 | attributes = _objectWithoutProperties(props, _excluded$3);
|
6547 |
|
6548 | const classes = mapToCssModules(classNames(className, 'list-inline-item'), cssModule);
|
6549 | return React.createElement(Tag, _extends({}, attributes, {
|
6550 | className: classes,
|
6551 | ref: ref
|
6552 | }));
|
6553 | });
|
6554 | ListInlineItem.name = 'ListInlineItem';
|
6555 | ListInlineItem.propTypes = propTypes$4;
|
6556 | ListInlineItem.defaultProps = defaultProps$4;
|
6557 | var ListInlineItem$1 = ListInlineItem;
|
6558 |
|
6559 | class UncontrolledAlert extends Component {
|
6560 | constructor(props) {
|
6561 | super(props);
|
6562 | this.state = {
|
6563 | isOpen: true
|
6564 | };
|
6565 | this.toggle = this.toggle.bind(this);
|
6566 | }
|
6567 |
|
6568 | toggle() {
|
6569 | this.setState({
|
6570 | isOpen: !this.state.isOpen
|
6571 | });
|
6572 | }
|
6573 |
|
6574 | render() {
|
6575 | return React.createElement(Alert, _extends({
|
6576 | isOpen: this.state.isOpen,
|
6577 | toggle: this.toggle
|
6578 | }, this.props));
|
6579 | }
|
6580 |
|
6581 | }
|
6582 |
|
6583 | var UncontrolledAlert$1 = UncontrolledAlert;
|
6584 |
|
6585 | const omitKeys$3 = ['defaultOpen'];
|
6586 | class UncontrolledButtonDropdown extends Component {
|
6587 | constructor(props) {
|
6588 | super(props);
|
6589 | this.state = {
|
6590 | isOpen: props.defaultOpen || false
|
6591 | };
|
6592 | this.toggle = this.toggle.bind(this);
|
6593 | }
|
6594 |
|
6595 | toggle() {
|
6596 | this.setState({
|
6597 | isOpen: !this.state.isOpen
|
6598 | });
|
6599 | }
|
6600 |
|
6601 | render() {
|
6602 | return React.createElement(ButtonDropdown$1, _extends({
|
6603 | isOpen: this.state.isOpen,
|
6604 | toggle: this.toggle
|
6605 | }, omit(this.props, omitKeys$3)));
|
6606 | }
|
6607 |
|
6608 | }
|
6609 | UncontrolledButtonDropdown.propTypes = _objectSpread2({
|
6610 | defaultOpen: PropTypes.bool
|
6611 | }, ButtonDropdown$1.propTypes);
|
6612 |
|
6613 | const omitKeys$2 = ['toggleEvents', 'defaultOpen'];
|
6614 | const propTypes$3 = {
|
6615 | defaultOpen: PropTypes.bool,
|
6616 | toggler: PropTypes.string.isRequired,
|
6617 | toggleEvents: PropTypes.arrayOf(PropTypes.string)
|
6618 | };
|
6619 | const defaultProps$3 = {
|
6620 | toggleEvents: defaultToggleEvents
|
6621 | };
|
6622 |
|
6623 | class UncontrolledCollapse extends Component {
|
6624 | constructor(props) {
|
6625 | super(props);
|
6626 | this.togglers = null;
|
6627 | this.removeEventListeners = null;
|
6628 | this.toggle = this.toggle.bind(this);
|
6629 | this.state = {
|
6630 | isOpen: props.defaultOpen || false
|
6631 | };
|
6632 | }
|
6633 |
|
6634 | componentDidMount() {
|
6635 | this.togglers = findDOMElements(this.props.toggler);
|
6636 |
|
6637 | if (this.togglers.length) {
|
6638 | this.removeEventListeners = addMultipleEventListeners(this.togglers, this.toggle, this.props.toggleEvents);
|
6639 | }
|
6640 | }
|
6641 |
|
6642 | componentWillUnmount() {
|
6643 | if (this.togglers.length && this.removeEventListeners) {
|
6644 | this.removeEventListeners();
|
6645 | }
|
6646 | }
|
6647 |
|
6648 | toggle(e) {
|
6649 | this.setState(({
|
6650 | isOpen
|
6651 | }) => ({
|
6652 | isOpen: !isOpen
|
6653 | }));
|
6654 | e.preventDefault();
|
6655 | }
|
6656 |
|
6657 | render() {
|
6658 | return React.createElement(Collapse$1, _extends({
|
6659 | isOpen: this.state.isOpen
|
6660 | }, omit(this.props, omitKeys$2)));
|
6661 | }
|
6662 |
|
6663 | }
|
6664 |
|
6665 | UncontrolledCollapse.propTypes = propTypes$3;
|
6666 | UncontrolledCollapse.defaultProps = defaultProps$3;
|
6667 | var UncontrolledCollapse$1 = UncontrolledCollapse;
|
6668 |
|
6669 | const omitKeys$1 = ['defaultOpen'];
|
6670 | class UncontrolledDropdown extends Component {
|
6671 | constructor(props) {
|
6672 | super(props);
|
6673 | this.state = {
|
6674 | isOpen: props.defaultOpen || false
|
6675 | };
|
6676 | this.toggle = this.toggle.bind(this);
|
6677 | }
|
6678 |
|
6679 | toggle(e) {
|
6680 | const isOpen = !this.state.isOpen;
|
6681 | this.setState({
|
6682 | isOpen
|
6683 | }, () => {
|
6684 | if (this.props.onToggle) {
|
6685 | this.props.onToggle(e, isOpen);
|
6686 | }
|
6687 | });
|
6688 | }
|
6689 |
|
6690 | render() {
|
6691 | return React.createElement(Dropdown$1, _extends({
|
6692 | isOpen: this.state.isOpen,
|
6693 | toggle: this.toggle
|
6694 | }, omit(this.props, omitKeys$1)));
|
6695 | }
|
6696 |
|
6697 | }
|
6698 | UncontrolledDropdown.propTypes = _objectSpread2({
|
6699 | defaultOpen: PropTypes.bool,
|
6700 | onToggle: PropTypes.func
|
6701 | }, Dropdown$1.propTypes);
|
6702 |
|
6703 | const omitKeys = ['defaultOpen'];
|
6704 | class UncontrolledTooltip extends Component {
|
6705 | constructor(props) {
|
6706 | super(props);
|
6707 | this.state = {
|
6708 | isOpen: props.defaultOpen || false
|
6709 | };
|
6710 | this.toggle = this.toggle.bind(this);
|
6711 | }
|
6712 |
|
6713 | toggle() {
|
6714 | this.setState({
|
6715 | isOpen: !this.state.isOpen
|
6716 | });
|
6717 | }
|
6718 |
|
6719 | render() {
|
6720 | return React.createElement(Tooltip$1, _extends({
|
6721 | isOpen: this.state.isOpen,
|
6722 | toggle: this.toggle
|
6723 | }, omit(this.props, omitKeys)));
|
6724 | }
|
6725 |
|
6726 | }
|
6727 | UncontrolledTooltip.propTypes = _objectSpread2({
|
6728 | defaultOpen: PropTypes.bool
|
6729 | }, Tooltip$1.propTypes);
|
6730 |
|
6731 | const _excluded$2 = ["className", "cssModule", "type", "size", "color", "children", "tag"];
|
6732 | const propTypes$2 = {
|
6733 | tag: tagPropType,
|
6734 | type: PropTypes.string,
|
6735 | size: PropTypes.string,
|
6736 | color: PropTypes.string,
|
6737 | className: PropTypes.string,
|
6738 | cssModule: PropTypes.object,
|
6739 | children: PropTypes.string
|
6740 | };
|
6741 | const defaultProps$2 = {
|
6742 | tag: 'div',
|
6743 | type: 'border',
|
6744 | children: 'Loading...'
|
6745 | };
|
6746 |
|
6747 | const Spinner = props => {
|
6748 | const {
|
6749 | className,
|
6750 | cssModule,
|
6751 | type,
|
6752 | size,
|
6753 | color,
|
6754 | children,
|
6755 | tag: Tag
|
6756 | } = props,
|
6757 | attributes = _objectWithoutProperties(props, _excluded$2);
|
6758 |
|
6759 | const classes = mapToCssModules(classNames(className, size ? `spinner-${type}-${size}` : false, `spinner-${type}`, color ? `text-${color}` : false), cssModule);
|
6760 | return React.createElement(Tag, _extends({
|
6761 | role: "status"
|
6762 | }, attributes, {
|
6763 | className: classes
|
6764 | }), children && React.createElement("span", {
|
6765 | className: mapToCssModules('visually-hidden', cssModule)
|
6766 | }, children));
|
6767 | };
|
6768 |
|
6769 | Spinner.propTypes = propTypes$2;
|
6770 | Spinner.defaultProps = defaultProps$2;
|
6771 | var Spinner$1 = Spinner;
|
6772 |
|
6773 | const _excluded$1 = ["className", "cssModule", "color", "innerRef", "tag", "animation", "size", "widths"];
|
6774 |
|
6775 | const propTypes$1 = _objectSpread2(_objectSpread2({}, Col$1.propTypes), {}, {
|
6776 | color: PropTypes.string,
|
6777 | tag: tagPropType,
|
6778 | animation: PropTypes.oneOf(['glow', 'wave']),
|
6779 | innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),
|
6780 | size: PropTypes.oneOf(['lg', 'sm', 'xs'])
|
6781 | });
|
6782 |
|
6783 | const defaultProps$1 = {
|
6784 | tag: 'span'
|
6785 | };
|
6786 |
|
6787 | const Placeholder = props => {
|
6788 | let {
|
6789 | className,
|
6790 | cssModule,
|
6791 | color,
|
6792 | innerRef,
|
6793 | tag: Tag,
|
6794 | animation,
|
6795 | size,
|
6796 | widths
|
6797 | } = props,
|
6798 | attributes = _objectWithoutProperties(props, _excluded$1);
|
6799 |
|
6800 | let {
|
6801 | attributes: modifiedAttributes,
|
6802 | colClasses
|
6803 | } = getColumnClasses(attributes, cssModule, widths);
|
6804 | const classes = mapToCssModules(classNames(className, colClasses, 'placeholder' + (animation ? '-' + animation : ''), size ? 'placeholder-' + size : false, color ? 'bg-' + color : false), cssModule);
|
6805 | return React.createElement(Tag, _extends({}, modifiedAttributes, {
|
6806 | className: classes,
|
6807 | ref: innerRef
|
6808 | }));
|
6809 | };
|
6810 |
|
6811 | Placeholder.propTypes = propTypes$1;
|
6812 | Placeholder.defaultProps = defaultProps$1;
|
6813 | var Placeholder$1 = Placeholder;
|
6814 |
|
6815 | const _excluded = ["cssModule", "className", "tag"];
|
6816 | const propTypes = {
|
6817 | size: PropTypes.string,
|
6818 | color: PropTypes.string,
|
6819 | outline: PropTypes.bool,
|
6820 | className: PropTypes.string,
|
6821 | tag: tagPropType
|
6822 | };
|
6823 | const defaultProps = {
|
6824 | color: 'primary',
|
6825 | tag: Button
|
6826 | };
|
6827 |
|
6828 | const PlaceholderButton = props => {
|
6829 | let {
|
6830 | cssModule,
|
6831 | className,
|
6832 | tag: Tag
|
6833 | } = props,
|
6834 | attributes = _objectWithoutProperties(props, _excluded);
|
6835 |
|
6836 | let {
|
6837 | attributes: modifiedAttributes,
|
6838 | colClasses
|
6839 | } = getColumnClasses(attributes, cssModule);
|
6840 | const classes = mapToCssModules(classNames("placeholder", className, colClasses), cssModule);
|
6841 | return React.createElement(Button, _extends({}, modifiedAttributes, {
|
6842 | className: classes,
|
6843 | disabled: true
|
6844 | }));
|
6845 | };
|
6846 |
|
6847 | PlaceholderButton.propTypes = propTypes;
|
6848 | PlaceholderButton.defaultProps = defaultProps;
|
6849 | var PlaceholderButton$1 = PlaceholderButton;
|
6850 |
|
6851 | (() => {
|
6852 | if (typeof window !== 'object' || typeof window.CustomEvent === 'function') return;
|
6853 |
|
6854 | const CustomEvent = (event, params) => {
|
6855 | params = params || {
|
6856 | bubbles: false,
|
6857 | cancelable: false,
|
6858 | detail: null
|
6859 | };
|
6860 | var evt = document.createEvent('CustomEvent');
|
6861 | evt.initCustomEvent(event, params.bubbles, params.cancelable, params.detail);
|
6862 | return evt;
|
6863 | };
|
6864 |
|
6865 | window.CustomEvent = CustomEvent;
|
6866 | })();
|
6867 |
|
6868 | (() => {
|
6869 | if (typeof Object.values === 'function') return;
|
6870 |
|
6871 | const values = O => Object.keys(O).map(key => O[key]);
|
6872 |
|
6873 | Object.values = values;
|
6874 | })();
|
6875 |
|
6876 | var polyfill = {
|
6877 | __proto__: null
|
6878 | };
|
6879 |
|
6880 | export { Accordion$1 as Accordion, AccordionBody$1 as AccordionBody, AccordionContext, AccordionHeader$1 as AccordionHeader, AccordionItem$1 as AccordionItem, Alert, Badge$1 as Badge, Breadcrumb$1 as Breadcrumb, BreadcrumbItem$1 as BreadcrumbItem, Button, ButtonDropdown$1 as ButtonDropdown, ButtonGroup$1 as ButtonGroup, ButtonToggle$1 as ButtonToggle, ButtonToolbar$1 as ButtonToolbar, Card$1 as Card, CardBody$1 as CardBody, CardColumns$1 as CardColumns, CardDeck$1 as CardDeck, CardFooter$1 as CardFooter, CardGroup$1 as CardGroup, CardHeader$1 as CardHeader, CardImg$1 as CardImg, CardImgOverlay$1 as CardImgOverlay, CardLink$1 as CardLink, CardSubtitle$1 as CardSubtitle, CardText$1 as CardText, CardTitle$1 as CardTitle, Carousel$1 as Carousel, CarouselCaption$1 as CarouselCaption, CarouselControl$1 as CarouselControl, CarouselIndicators$1 as CarouselIndicators, CarouselItem$1 as CarouselItem, CloseButton$1 as CloseButton, Col$1 as Col, Collapse$1 as Collapse, Container$1 as Container, Dropdown$1 as Dropdown, DropdownContext, DropdownItem$1 as DropdownItem, DropdownMenu$1 as DropdownMenu, DropdownToggle$1 as DropdownToggle, Fade, Form$1 as Form, FormFeedback$1 as FormFeedback, FormGroup$1 as FormGroup, FormText$1 as FormText, Input$1 as Input, InputGroup$1 as InputGroup, InputGroupText$1 as InputGroupText, Label$1 as Label, List$1 as List, ListGroup$1 as ListGroup, ListGroupItem$1 as ListGroupItem, ListGroupItemHeading$1 as ListGroupItemHeading, ListGroupItemText$1 as ListGroupItemText, ListInlineItem$1 as ListInlineItem, Media$1 as Media, Modal$1 as Modal, ModalBody$1 as ModalBody, ModalFooter$1 as ModalFooter, ModalHeader$1 as ModalHeader, Nav$1 as Nav, NavItem$1 as NavItem, NavLink$1 as NavLink, Navbar$1 as Navbar, NavbarBrand$1 as NavbarBrand, NavbarText$1 as NavbarText, NavbarToggler$1 as NavbarToggler, Offcanvas$1 as Offcanvas, OffcanvasBody$1 as OffcanvasBody, OffcanvasHeader$1 as OffcanvasHeader, Pagination$1 as Pagination, PaginationItem$1 as PaginationItem, PaginationLink$1 as PaginationLink, Placeholder$1 as Placeholder, PlaceholderButton$1 as PlaceholderButton, polyfill as Polyfill, Popover$1 as Popover, PopoverBody$1 as PopoverBody, PopoverHeader$1 as PopoverHeader, PopperContent$1 as PopperContent, PopperTargetHelper$1 as PopperTargetHelper, Progress$1 as Progress, Row$1 as Row, Spinner$1 as Spinner, TabContent$1 as TabContent, TabPane, Table$1 as Table, Toast, ToastBody$1 as ToastBody, ToastHeader$1 as ToastHeader, Tooltip$1 as Tooltip, UncontrolledAccordion$1 as UncontrolledAccordion, UncontrolledAlert$1 as UncontrolledAlert, UncontrolledButtonDropdown, UncontrolledCarousel$1 as UncontrolledCarousel, UncontrolledCollapse$1 as UncontrolledCollapse, UncontrolledDropdown, UncontrolledPopover, UncontrolledTooltip, utils as Util };
|
6881 |
|