'use strict';
Object.defineProperty(exports, '__esModule', { value: true });
var React = require('react');
var reactTransitionGroup = require('react-transition-group');
var ReactDOM = require('react-dom');
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
function _interopNamespace(e) {
if (e && e.__esModule) return e;
var n = Object.create(null);
if (e) {
Object.keys(e).forEach(function (k) {
if (k !== 'default') {
var d = Object.getOwnPropertyDescriptor(e, k);
Object.defineProperty(n, k, d.get ? d : {
enumerable: true,
get: function () { return e[k]; }
});
}
});
}
n["default"] = e;
return Object.freeze(n);
}
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
var ReactDOM__default = /*#__PURE__*/_interopDefaultLegacy(ReactDOM);
function _arrayLikeToArray$j(arr, len) {
if (len == null || len > arr.length) len = arr.length;
for (var i = 0, arr2 = new Array(len); i < len; i++) {
arr2[i] = arr[i];
}
return arr2;
}
function _arrayWithoutHoles(arr) {
if (Array.isArray(arr)) return _arrayLikeToArray$j(arr);
}
function _iterableToArray(iter) {
if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter);
}
function _unsupportedIterableToArray$j(o, minLen) {
if (!o) return;
if (typeof o === "string") return _arrayLikeToArray$j(o, minLen);
var n = Object.prototype.toString.call(o).slice(8, -1);
if (n === "Object" && o.constructor) n = o.constructor.name;
if (n === "Map" || n === "Set") return Array.from(o);
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray$j(o, minLen);
}
function _nonIterableSpread() {
throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
}
function _toConsumableArray(arr) {
return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray$j(arr) || _nonIterableSpread();
}
function _defineProperties(target, props) {
for (var i = 0; i < props.length; i++) {
var descriptor = props[i];
descriptor.enumerable = descriptor.enumerable || false;
descriptor.configurable = true;
if ("value" in descriptor) descriptor.writable = true;
Object.defineProperty(target, descriptor.key, descriptor);
}
}
function _createClass(Constructor, protoProps, staticProps) {
if (protoProps) _defineProperties(Constructor.prototype, protoProps);
if (staticProps) _defineProperties(Constructor, staticProps);
Object.defineProperty(Constructor, "prototype", {
writable: false
});
return Constructor;
}
function _classCallCheck(instance, Constructor) {
if (!(instance instanceof Constructor)) {
throw new TypeError("Cannot call a class as a function");
}
}
function _setPrototypeOf(o, p) {
_setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {
o.__proto__ = p;
return o;
};
return _setPrototypeOf(o, p);
}
function _inherits(subClass, superClass) {
if (typeof superClass !== "function" && superClass !== null) {
throw new TypeError("Super expression must either be null or a function");
}
subClass.prototype = Object.create(superClass && superClass.prototype, {
constructor: {
value: subClass,
writable: true,
configurable: true
}
});
Object.defineProperty(subClass, "prototype", {
writable: false
});
if (superClass) _setPrototypeOf(subClass, superClass);
}
function _typeof(obj) {
"@babel/helpers - typeof";
return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) {
return typeof obj;
} : function (obj) {
return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
}, _typeof(obj);
}
function _assertThisInitialized(self) {
if (self === void 0) {
throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
}
return self;
}
function _possibleConstructorReturn(self, call) {
if (call && (_typeof(call) === "object" || typeof call === "function")) {
return call;
} else if (call !== void 0) {
throw new TypeError("Derived constructors may only return object or undefined");
}
return _assertThisInitialized(self);
}
function _getPrototypeOf(o) {
_getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) {
return o.__proto__ || Object.getPrototypeOf(o);
};
return _getPrototypeOf(o);
}
function _defineProperty(obj, key, value) {
if (key in obj) {
Object.defineProperty(obj, key, {
value: value,
enumerable: true,
configurable: true,
writable: true
});
} else {
obj[key] = value;
}
return obj;
}
function _arrayWithHoles(arr) {
if (Array.isArray(arr)) return arr;
}
function _iterableToArrayLimit(arr, i) {
var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
if (_i == null) return;
var _arr = [];
var _n = true;
var _d = false;
var _s, _e;
try {
for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) {
_arr.push(_s.value);
if (i && _arr.length === i) break;
}
} catch (err) {
_d = true;
_e = err;
} finally {
try {
if (!_n && _i["return"] != null) _i["return"]();
} finally {
if (_d) throw _e;
}
}
return _arr;
}
function _nonIterableRest() {
throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
}
function _slicedToArray(arr, i) {
return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray$j(arr, i) || _nonIterableRest();
}
function classNames() {
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
if (args) {
var classes = [];
for (var i = 0; i < args.length; i++) {
var className = args[i];
if (!className) continue;
var type = _typeof(className);
if (type === 'string' || type === 'number') {
classes.push(className);
} else if (type === 'object') {
var _classes = Array.isArray(className) ? className : Object.entries(className).map(function (_ref) {
var _ref2 = _slicedToArray(_ref, 2),
key = _ref2[0],
value = _ref2[1];
return !!value ? key : null;
});
classes = _classes.length ? classes.concat(_classes.filter(function (c) {
return !!c;
})) : classes;
}
}
return classes.join(' ');
}
return undefined;
}
function _createForOfIteratorHelper$i(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray$i(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it["return"] != null) it["return"](); } finally { if (didErr) throw err; } } }; }
function _unsupportedIterableToArray$i(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray$i(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray$i(o, minLen); }
function _arrayLikeToArray$i(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
var DomHandler = /*#__PURE__*/function () {
function DomHandler() {
_classCallCheck(this, DomHandler);
}
_createClass(DomHandler, null, [{
key: "innerWidth",
value: function innerWidth(el) {
if (el) {
var width = el.offsetWidth;
var style = getComputedStyle(el);
width += parseFloat(style.paddingLeft) + parseFloat(style.paddingRight);
return width;
}
return 0;
}
}, {
key: "width",
value: function width(el) {
if (el) {
var width = el.offsetWidth;
var style = getComputedStyle(el);
width -= parseFloat(style.paddingLeft) + parseFloat(style.paddingRight);
return width;
}
return 0;
}
}, {
key: "getWindowScrollTop",
value: function getWindowScrollTop() {
var doc = document.documentElement;
return (window.pageYOffset || doc.scrollTop) - (doc.clientTop || 0);
}
}, {
key: "getWindowScrollLeft",
value: function getWindowScrollLeft() {
var doc = document.documentElement;
return (window.pageXOffset || doc.scrollLeft) - (doc.clientLeft || 0);
}
}, {
key: "getOuterWidth",
value: function getOuterWidth(el, margin) {
if (el) {
var width = el.offsetWidth || el.getBoundingClientRect().width;
if (margin) {
var style = getComputedStyle(el);
width += parseFloat(style.marginLeft) + parseFloat(style.marginRight);
}
return width;
}
return 0;
}
}, {
key: "getOuterHeight",
value: function getOuterHeight(el, margin) {
if (el) {
var height = el.offsetHeight || el.getBoundingClientRect().height;
if (margin) {
var style = getComputedStyle(el);
height += parseFloat(style.marginTop) + parseFloat(style.marginBottom);
}
return height;
}
return 0;
}
}, {
key: "getClientHeight",
value: function getClientHeight(el, margin) {
if (el) {
var height = el.clientHeight;
if (margin) {
var style = getComputedStyle(el);
height += parseFloat(style.marginTop) + parseFloat(style.marginBottom);
}
return height;
}
return 0;
}
}, {
key: "getClientWidth",
value: function getClientWidth(el, margin) {
if (el) {
var width = el.clientWidth;
if (margin) {
var style = getComputedStyle(el);
width += parseFloat(style.marginLeft) + parseFloat(style.marginRight);
}
return width;
}
return 0;
}
}, {
key: "getViewport",
value: function getViewport() {
var win = window,
d = document,
e = d.documentElement,
g = d.getElementsByTagName('body')[0],
w = win.innerWidth || e.clientWidth || g.clientWidth,
h = win.innerHeight || e.clientHeight || g.clientHeight;
return {
width: w,
height: h
};
}
}, {
key: "getOffset",
value: function getOffset(el) {
if (el) {
var rect = el.getBoundingClientRect();
return {
top: rect.top + (window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0),
left: rect.left + (window.pageXOffset || document.documentElement.scrollLeft || document.body.scrollLeft || 0)
};
}
return {
top: 'auto',
left: 'auto'
};
}
}, {
key: "index",
value: function index(element) {
if (element) {
var children = element.parentNode.childNodes;
var num = 0;
for (var i = 0; i < children.length; i++) {
if (children[i] === element) return num;
if (children[i].nodeType === 1) num++;
}
}
return -1;
}
}, {
key: "addMultipleClasses",
value: function addMultipleClasses(element, className) {
if (element && className) {
if (element.classList) {
var styles = className.split(' ');
for (var i = 0; i < styles.length; i++) {
element.classList.add(styles[i]);
}
} else {
var _styles = className.split(' ');
for (var _i = 0; _i < _styles.length; _i++) {
element.className += ' ' + _styles[_i];
}
}
}
}
}, {
key: "removeMultipleClasses",
value: function removeMultipleClasses(element, className) {
if (element && className) {
if (element.classList) {
var styles = className.split(' ');
for (var i = 0; i < styles.length; i++) {
element.classList.remove(styles[i]);
}
} else {
var _styles2 = className.split(' ');
for (var _i2 = 0; _i2 < _styles2.length; _i2++) {
element.className = element.className.replace(new RegExp('(^|\\b)' + _styles2[_i2].split(' ').join('|') + '(\\b|$)', 'gi'), ' ');
}
}
}
}
}, {
key: "addClass",
value: function addClass(element, className) {
if (element && className) {
if (element.classList) element.classList.add(className);else element.className += ' ' + className;
}
}
}, {
key: "removeClass",
value: function removeClass(element, className) {
if (element && className) {
if (element.classList) element.classList.remove(className);else element.className = element.className.replace(new RegExp('(^|\\b)' + className.split(' ').join('|') + '(\\b|$)', 'gi'), ' ');
}
}
}, {
key: "hasClass",
value: function hasClass(element, className) {
if (element) {
if (element.classList) return element.classList.contains(className);else return new RegExp('(^| )' + className + '( |$)', 'gi').test(element.className);
}
}
}, {
key: "find",
value: function find(element, selector) {
return element ? Array.from(element.querySelectorAll(selector)) : [];
}
}, {
key: "findSingle",
value: function findSingle(element, selector) {
if (element) {
return element.querySelector(selector);
}
return null;
}
}, {
key: "getHeight",
value: function getHeight(el) {
if (el) {
var height = el.offsetHeight;
var style = getComputedStyle(el);
height -= parseFloat(style.paddingTop) + parseFloat(style.paddingBottom) + parseFloat(style.borderTopWidth) + parseFloat(style.borderBottomWidth);
return height;
}
return 0;
}
}, {
key: "getWidth",
value: function getWidth(el) {
if (el) {
var width = el.offsetWidth;
var style = getComputedStyle(el);
width -= parseFloat(style.paddingLeft) + parseFloat(style.paddingRight) + parseFloat(style.borderLeftWidth) + parseFloat(style.borderRightWidth);
return width;
}
return 0;
}
}, {
key: "alignOverlay",
value: function alignOverlay(overlay, target, appendTo) {
var calculateMinWidth = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : true;
if (overlay && target) {
if (appendTo === 'self') {
this.relativePosition(overlay, target);
} else {
calculateMinWidth && (overlay.style.minWidth = DomHandler.getOuterWidth(target) + 'px');
this.absolutePosition(overlay, target);
}
}
}
}, {
key: "absolutePosition",
value: function absolutePosition(element, target) {
if (element) {
var elementDimensions = element.offsetParent ? {
width: element.offsetWidth,
height: element.offsetHeight
} : this.getHiddenElementDimensions(element);
var elementOuterHeight = elementDimensions.height;
var elementOuterWidth = elementDimensions.width;
var targetOuterHeight = target.offsetHeight;
var targetOuterWidth = target.offsetWidth;
var targetOffset = target.getBoundingClientRect();
var windowScrollTop = this.getWindowScrollTop();
var windowScrollLeft = this.getWindowScrollLeft();
var viewport = this.getViewport();
var top, left;
if (targetOffset.top + targetOuterHeight + elementOuterHeight > viewport.height) {
top = targetOffset.top + windowScrollTop - elementOuterHeight;
if (top < 0) {
top = windowScrollTop;
}
element.style.transformOrigin = 'bottom';
} else {
top = targetOuterHeight + targetOffset.top + windowScrollTop;
element.style.transformOrigin = 'top';
}
if (targetOffset.left + targetOuterWidth + elementOuterWidth > viewport.width) left = Math.max(0, targetOffset.left + windowScrollLeft + targetOuterWidth - elementOuterWidth);else left = targetOffset.left + windowScrollLeft;
element.style.top = top + 'px';
element.style.left = left + 'px';
}
}
}, {
key: "relativePosition",
value: function relativePosition(element, target) {
if (element) {
var elementDimensions = element.offsetParent ? {
width: element.offsetWidth,
height: element.offsetHeight
} : this.getHiddenElementDimensions(element);
var targetHeight = target.offsetHeight;
var targetOffset = target.getBoundingClientRect();
var viewport = this.getViewport();
var top, left;
if (targetOffset.top + targetHeight + elementDimensions.height > viewport.height) {
top = -1 * elementDimensions.height;
if (targetOffset.top + top < 0) {
top = -1 * targetOffset.top;
}
element.style.transformOrigin = 'bottom';
} else {
top = targetHeight;
element.style.transformOrigin = 'top';
}
if (elementDimensions.width > viewport.width) {
// element wider then viewport and cannot fit on screen (align at left side of viewport)
left = targetOffset.left * -1;
} else if (targetOffset.left + elementDimensions.width > viewport.width) {
// element wider then viewport but can be fit on screen (align at right side of viewport)
left = (targetOffset.left + elementDimensions.width - viewport.width) * -1;
} else {
// element fits on screen (align with target)
left = 0;
}
element.style.top = top + 'px';
element.style.left = left + 'px';
}
}
}, {
key: "flipfitCollision",
value: function flipfitCollision(element, target) {
var _this = this;
var my = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'left top';
var at = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 'left bottom';
var callback = arguments.length > 4 ? arguments[4] : undefined;
var targetOffset = target.getBoundingClientRect();
var viewport = this.getViewport();
var myArr = my.split(' ');
var atArr = at.split(' ');
var getPositionValue = function getPositionValue(arr, isOffset) {
return isOffset ? +arr.substring(arr.search(/(\+|-)/g)) || 0 : arr.substring(0, arr.search(/(\+|-)/g)) || arr;
};
var position = {
my: {
x: getPositionValue(myArr[0]),
y: getPositionValue(myArr[1] || myArr[0]),
offsetX: getPositionValue(myArr[0], true),
offsetY: getPositionValue(myArr[1] || myArr[0], true)
},
at: {
x: getPositionValue(atArr[0]),
y: getPositionValue(atArr[1] || atArr[0]),
offsetX: getPositionValue(atArr[0], true),
offsetY: getPositionValue(atArr[1] || atArr[0], true)
}
};
var myOffset = {
left: function left() {
var totalOffset = position.my.offsetX + position.at.offsetX;
return totalOffset + targetOffset.left + (position.my.x === 'left' ? 0 : -1 * (position.my.x === 'center' ? _this.getOuterWidth(element) / 2 : _this.getOuterWidth(element)));
},
top: function top() {
var totalOffset = position.my.offsetY + position.at.offsetY;
return totalOffset + targetOffset.top + (position.my.y === 'top' ? 0 : -1 * (position.my.y === 'center' ? _this.getOuterHeight(element) / 2 : _this.getOuterHeight(element)));
}
};
var alignWithAt = {
count: {
x: 0,
y: 0
},
left: function left() {
var left = myOffset.left();
var scrollLeft = DomHandler.getWindowScrollLeft();
element.style.left = left + scrollLeft + 'px';
if (this.count.x === 2) {
element.style.left = scrollLeft + 'px';
this.count.x = 0;
} else if (left < 0) {
this.count.x++;
position.my.x = 'left';
position.at.x = 'right';
position.my.offsetX *= -1;
position.at.offsetX *= -1;
this.right();
}
},
right: function right() {
var left = myOffset.left() + DomHandler.getOuterWidth(target);
var scrollLeft = DomHandler.getWindowScrollLeft();
element.style.left = left + scrollLeft + 'px';
if (this.count.x === 2) {
element.style.left = viewport.width - DomHandler.getOuterWidth(element) + scrollLeft + 'px';
this.count.x = 0;
} else if (left + DomHandler.getOuterWidth(element) > viewport.width) {
this.count.x++;
position.my.x = 'right';
position.at.x = 'left';
position.my.offsetX *= -1;
position.at.offsetX *= -1;
this.left();
}
},
top: function top() {
var top = myOffset.top();
var scrollTop = DomHandler.getWindowScrollTop();
element.style.top = top + scrollTop + 'px';
if (this.count.y === 2) {
element.style.left = scrollTop + 'px';
this.count.y = 0;
} else if (top < 0) {
this.count.y++;
position.my.y = 'top';
position.at.y = 'bottom';
position.my.offsetY *= -1;
position.at.offsetY *= -1;
this.bottom();
}
},
bottom: function bottom() {
var top = myOffset.top() + DomHandler.getOuterHeight(target);
var scrollTop = DomHandler.getWindowScrollTop();
element.style.top = top + scrollTop + 'px';
if (this.count.y === 2) {
element.style.left = viewport.height - DomHandler.getOuterHeight(element) + scrollTop + 'px';
this.count.y = 0;
} else if (top + DomHandler.getOuterHeight(target) > viewport.height) {
this.count.y++;
position.my.y = 'bottom';
position.at.y = 'top';
position.my.offsetY *= -1;
position.at.offsetY *= -1;
this.top();
}
},
center: function center(axis) {
if (axis === 'y') {
var top = myOffset.top() + DomHandler.getOuterHeight(target) / 2;
element.style.top = top + DomHandler.getWindowScrollTop() + 'px';
if (top < 0) {
this.bottom();
} else if (top + DomHandler.getOuterHeight(target) > viewport.height) {
this.top();
}
} else {
var left = myOffset.left() + DomHandler.getOuterWidth(target) / 2;
element.style.left = left + DomHandler.getWindowScrollLeft() + 'px';
if (left < 0) {
this.left();
} else if (left + DomHandler.getOuterWidth(element) > viewport.width) {
this.right();
}
}
}
};
alignWithAt[position.at.x]('x');
alignWithAt[position.at.y]('y');
if (this.isFunction(callback)) {
callback(position);
}
}
}, {
key: "findCollisionPosition",
value: function findCollisionPosition(position) {
if (position) {
var isAxisY = position === 'top' || position === 'bottom';
var myXPosition = position === 'left' ? 'right' : 'left';
var myYPosition = position === 'top' ? 'bottom' : 'top';
if (isAxisY) {
return {
axis: 'y',
my: "center ".concat(myYPosition),
at: "center ".concat(position)
};
}
return {
axis: 'x',
my: "".concat(myXPosition, " center"),
at: "".concat(position, " center")
};
}
}
}, {
key: "getParents",
value: function getParents(element) {
var parents = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
return element['parentNode'] === null ? parents : this.getParents(element.parentNode, parents.concat([element.parentNode]));
}
}, {
key: "getScrollableParents",
value: function getScrollableParents(element) {
var scrollableParents = [];
if (element) {
var parents = this.getParents(element);
var overflowRegex = /(auto|scroll)/;
var overflowCheck = function overflowCheck(node) {
var styleDeclaration = node ? getComputedStyle(node) : null;
return styleDeclaration && (overflowRegex.test(styleDeclaration.getPropertyValue('overflow')) || overflowRegex.test(styleDeclaration.getPropertyValue('overflowX')) || overflowRegex.test(styleDeclaration.getPropertyValue('overflowY')));
};
var _iterator = _createForOfIteratorHelper$i(parents),
_step;
try {
for (_iterator.s(); !(_step = _iterator.n()).done;) {
var parent = _step.value;
var scrollSelectors = parent.nodeType === 1 && parent.dataset['scrollselectors'];
if (scrollSelectors) {
var selectors = scrollSelectors.split(',');
var _iterator2 = _createForOfIteratorHelper$i(selectors),
_step2;
try {
for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
var selector = _step2.value;
var el = this.findSingle(parent, selector);
if (el && overflowCheck(el)) {
scrollableParents.push(el);
}
}
} catch (err) {
_iterator2.e(err);
} finally {
_iterator2.f();
}
}
if (parent.nodeType !== 9 && overflowCheck(parent)) {
scrollableParents.push(parent);
}
}
} catch (err) {
_iterator.e(err);
} finally {
_iterator.f();
}
}
return scrollableParents;
}
}, {
key: "getHiddenElementOuterHeight",
value: function getHiddenElementOuterHeight(element) {
if (element) {
element.style.visibility = 'hidden';
element.style.display = 'block';
var elementHeight = element.offsetHeight;
element.style.display = 'none';
element.style.visibility = 'visible';
return elementHeight;
}
return 0;
}
}, {
key: "getHiddenElementOuterWidth",
value: function getHiddenElementOuterWidth(element) {
if (element) {
element.style.visibility = 'hidden';
element.style.display = 'block';
var elementWidth = element.offsetWidth;
element.style.display = 'none';
element.style.visibility = 'visible';
return elementWidth;
}
return 0;
}
}, {
key: "getHiddenElementDimensions",
value: function getHiddenElementDimensions(element) {
var dimensions = {};
if (element) {
element.style.visibility = 'hidden';
element.style.display = 'block';
dimensions.width = element.offsetWidth;
dimensions.height = element.offsetHeight;
element.style.display = 'none';
element.style.visibility = 'visible';
}
return dimensions;
}
}, {
key: "fadeIn",
value: function fadeIn(element, duration) {
if (element) {
element.style.opacity = 0;
var last = +new Date();
var opacity = 0;
var tick = function tick() {
opacity = +element.style.opacity + (new Date().getTime() - last) / duration;
element.style.opacity = opacity;
last = +new Date();
if (+opacity < 1) {
window.requestAnimationFrame && requestAnimationFrame(tick) || setTimeout(tick, 16);
}
};
tick();
}
}
}, {
key: "fadeOut",
value: function fadeOut(element, duration) {
if (element) {
var opacity = 1,
interval = 50,
gap = interval / duration;
var fading = setInterval(function () {
opacity -= gap;
if (opacity <= 0) {
opacity = 0;
clearInterval(fading);
}
element.style.opacity = opacity;
}, interval);
}
}
}, {
key: "getUserAgent",
value: function getUserAgent() {
return navigator.userAgent;
}
}, {
key: "isIOS",
value: function isIOS() {
return /iPad|iPhone|iPod/.test(navigator.userAgent) && !window['MSStream'];
}
}, {
key: "isAndroid",
value: function isAndroid() {
return /(android)/i.test(navigator.userAgent);
}
}, {
key: "isTouchDevice",
value: function isTouchDevice() {
return 'ontouchstart' in window || navigator.maxTouchPoints > 0 || navigator.msMaxTouchPoints > 0;
}
}, {
key: "isFunction",
value: function isFunction(obj) {
return !!(obj && obj.constructor && obj.call && obj.apply);
}
}, {
key: "appendChild",
value: function appendChild(element, target) {
if (this.isElement(target)) target.appendChild(element);else if (target.el && target.el.nativeElement) target.el.nativeElement.appendChild(element);else throw new Error('Cannot append ' + target + ' to ' + element);
}
}, {
key: "removeChild",
value: function removeChild(element, target) {
if (this.isElement(target)) target.removeChild(element);else if (target.el && target.el.nativeElement) target.el.nativeElement.removeChild(element);else throw new Error('Cannot remove ' + element + ' from ' + target);
}
}, {
key: "isElement",
value: function isElement(obj) {
return (typeof HTMLElement === "undefined" ? "undefined" : _typeof(HTMLElement)) === "object" ? obj instanceof HTMLElement : obj && _typeof(obj) === "object" && obj !== null && obj.nodeType === 1 && typeof obj.nodeName === "string";
}
}, {
key: "scrollInView",
value: function scrollInView(container, item) {
var borderTopValue = getComputedStyle(container).getPropertyValue('borderTopWidth');
var borderTop = borderTopValue ? parseFloat(borderTopValue) : 0;
var paddingTopValue = getComputedStyle(container).getPropertyValue('paddingTop');
var paddingTop = paddingTopValue ? parseFloat(paddingTopValue) : 0;
var containerRect = container.getBoundingClientRect();
var itemRect = item.getBoundingClientRect();
var offset = itemRect.top + document.body.scrollTop - (containerRect.top + document.body.scrollTop) - borderTop - paddingTop;
var scroll = container.scrollTop;
var elementHeight = container.clientHeight;
var itemHeight = this.getOuterHeight(item);
if (offset < 0) {
container.scrollTop = scroll + offset;
} else if (offset + itemHeight > elementHeight) {
container.scrollTop = scroll + offset - elementHeight + itemHeight;
}
}
}, {
key: "clearSelection",
value: function clearSelection() {
if (window.getSelection) {
if (window.getSelection().empty) {
window.getSelection().empty();
} else if (window.getSelection().removeAllRanges && window.getSelection().rangeCount > 0 && window.getSelection().getRangeAt(0).getClientRects().length > 0) {
window.getSelection().removeAllRanges();
}
} else if (document['selection'] && document['selection'].empty) {
try {
document['selection'].empty();
} catch (error) {//ignore IE bug
}
}
}
}, {
key: "calculateScrollbarWidth",
value: function calculateScrollbarWidth(el) {
if (el) {
var style = getComputedStyle(el);
return el.offsetWidth - el.clientWidth - parseFloat(style.borderLeftWidth) - parseFloat(style.borderRightWidth);
} else {
if (this.calculatedScrollbarWidth != null) return this.calculatedScrollbarWidth;
var scrollDiv = document.createElement("div");
scrollDiv.className = "p-scrollbar-measure";
document.body.appendChild(scrollDiv);
var scrollbarWidth = scrollDiv.offsetWidth - scrollDiv.clientWidth;
document.body.removeChild(scrollDiv);
this.calculatedScrollbarWidth = scrollbarWidth;
return scrollbarWidth;
}
}
}, {
key: "getBrowser",
value: function getBrowser() {
if (!this.browser) {
var matched = this.resolveUserAgent();
this.browser = {};
if (matched.browser) {
this.browser[matched.browser] = true;
this.browser['version'] = matched.version;
}
if (this.browser['chrome']) {
this.browser['webkit'] = true;
} else if (this.browser['webkit']) {
this.browser['safari'] = true;
}
}
return this.browser;
}
}, {
key: "resolveUserAgent",
value: function resolveUserAgent() {
var ua = navigator.userAgent.toLowerCase();
var match = /(chrome)[ ]([\w.]+)/.exec(ua) || /(webkit)[ ]([\w.]+)/.exec(ua) || /(opera)(?:.*version|)[ ]([\w.]+)/.exec(ua) || /(msie) ([\w.]+)/.exec(ua) || ua.indexOf("compatible") < 0 && /(mozilla)(?:.*? rv:([\w.]+)|)/.exec(ua) || [];
return {
browser: match[1] || "",
version: match[2] || "0"
};
}
}, {
key: "isVisible",
value: function isVisible(element) {
return element && element.offsetParent != null;
}
}, {
key: "isExist",
value: function isExist(element) {
return element !== null && typeof element !== 'undefined' && element.nodeName && element.parentNode;
}
}, {
key: "hasDOM",
value: function hasDOM() {
return !!(typeof window !== 'undefined' && window.document && window.document.createElement);
}
}, {
key: "getFocusableElements",
value: function getFocusableElements(element) {
var selector = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
var focusableElements = DomHandler.find(element, "button:not([tabindex = \"-1\"]):not([disabled]):not([style*=\"display:none\"]):not([hidden])".concat(selector, ",\n [href][clientHeight][clientWidth]:not([tabindex = \"-1\"]):not([disabled]):not([style*=\"display:none\"]):not([hidden])").concat(selector, ",\n input:not([tabindex = \"-1\"]):not([disabled]):not([style*=\"display:none\"]):not([hidden])").concat(selector, ",\n select:not([tabindex = \"-1\"]):not([disabled]):not([style*=\"display:none\"]):not([hidden])").concat(selector, ",\n textarea:not([tabindex = \"-1\"]):not([disabled]):not([style*=\"display:none\"]):not([hidden])").concat(selector, ",\n [tabIndex]:not([tabIndex = \"-1\"]):not([disabled]):not([style*=\"display:none\"]):not([hidden])").concat(selector, ",\n [contenteditable]:not([tabIndex = \"-1\"]):not([disabled]):not([style*=\"display:none\"]):not([hidden])").concat(selector));
var visibleFocusableElements = [];
var _iterator3 = _createForOfIteratorHelper$i(focusableElements),
_step3;
try {
for (_iterator3.s(); !(_step3 = _iterator3.n()).done;) {
var focusableElement = _step3.value;
if (getComputedStyle(focusableElement).display !== "none" && getComputedStyle(focusableElement).visibility !== "hidden") visibleFocusableElements.push(focusableElement);
}
} catch (err) {
_iterator3.e(err);
} finally {
_iterator3.f();
}
return visibleFocusableElements;
}
}, {
key: "getFirstFocusableElement",
value: function getFirstFocusableElement(element, selector) {
var focusableElements = DomHandler.getFocusableElements(element, selector);
return focusableElements.length > 0 ? focusableElements[0] : null;
}
}, {
key: "getLastFocusableElement",
value: function getLastFocusableElement(element, selector) {
var focusableElements = DomHandler.getFocusableElements(element, selector);
return focusableElements.length > 0 ? focusableElements[focusableElements.length - 1] : null;
}
}, {
key: "getCursorOffset",
value: function getCursorOffset(el, prevText, nextText, currentText) {
if (el) {
var style = getComputedStyle(el);
var ghostDiv = document.createElement('div');
ghostDiv.style.position = 'absolute';
ghostDiv.style.top = '0px';
ghostDiv.style.left = '0px';
ghostDiv.style.visibility = 'hidden';
ghostDiv.style.pointerEvents = 'none';
ghostDiv.style.overflow = style.overflow;
ghostDiv.style.width = style.width;
ghostDiv.style.height = style.height;
ghostDiv.style.padding = style.padding;
ghostDiv.style.border = style.border;
ghostDiv.style.overflowWrap = style.overflowWrap;
ghostDiv.style.whiteSpace = style.whiteSpace;
ghostDiv.style.lineHeight = style.lineHeight;
ghostDiv.innerHTML = prevText.replace(/\r\n|\r|\n/g, '
');
var ghostSpan = document.createElement('span');
ghostSpan.textContent = currentText;
ghostDiv.appendChild(ghostSpan);
var text = document.createTextNode(nextText);
ghostDiv.appendChild(text);
document.body.appendChild(ghostDiv);
var offsetLeft = ghostSpan.offsetLeft,
offsetTop = ghostSpan.offsetTop,
clientHeight = ghostSpan.clientHeight;
document.body.removeChild(ghostDiv);
return {
left: Math.abs(offsetLeft - el.scrollLeft),
top: Math.abs(offsetTop - el.scrollTop) + clientHeight
};
}
return {
top: 'auto',
left: 'auto'
};
}
}, {
key: "invokeElementMethod",
value: function invokeElementMethod(element, methodName, args) {
element[methodName].apply(element, args);
}
}, {
key: "isClickable",
value: function isClickable(element) {
var targetNode = element.nodeName;
var parentNode = element.parentElement && element.parentElement.nodeName;
return targetNode === 'INPUT' || targetNode === 'TEXTAREA' || targetNode === 'BUTTON' || targetNode === 'A' || parentNode === 'INPUT' || parentNode === 'TEXTAREA' || parentNode === 'BUTTON' || parentNode === 'A' || this.hasClass(element, 'p-button') || this.hasClass(element.parentElement, 'p-button') || this.hasClass(element.parentElement, 'p-checkbox') || this.hasClass(element.parentElement, 'p-radiobutton');
}
}, {
key: "applyStyle",
value: function applyStyle(element, style) {
if (typeof style === 'string') {
element.style.cssText = this.style;
} else {
for (var prop in this.style) {
element.style[prop] = style[prop];
}
}
}
}, {
key: "exportCSV",
value: function exportCSV(csv, filename) {
var blob = new Blob([csv], {
type: 'application/csv;charset=utf-8;'
});
if (window.navigator.msSaveOrOpenBlob) {
navigator.msSaveOrOpenBlob(blob, filename + '.csv');
} else {
var isDownloaded = DomHandler.saveAs({
name: filename + '.csv',
src: URL.createObjectURL(blob)
});
if (!isDownloaded) {
csv = 'data:text/csv;charset=utf-8,' + csv;
window.open(encodeURI(csv));
}
}
}
}, {
key: "saveAs",
value: function saveAs(file) {
if (file) {
var link = document.createElement('a');
if (link.download !== undefined) {
var name = file.name,
src = file.src;
link.setAttribute('href', src);
link.setAttribute('download', name);
link.style.display = 'none';
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
return true;
}
}
return false;
}
}, {
key: "createInlineStyle",
value: function createInlineStyle(nonce) {
var styleElement = document.createElement('style');
try {
if (!nonce) {
nonce = process.env.REACT_APP_CSS_NONCE;
}
} catch (error) {// NOOP
}
nonce && styleElement.setAttribute('nonce', nonce);
document.head.appendChild(styleElement);
return styleElement;
}
}, {
key: "removeInlineStyle",
value: function removeInlineStyle(styleElement) {
if (this.isExist(styleElement)) {
try {
document.head.removeChild(styleElement);
} catch (error) {// style element may have already been removed in a fast refresh
}
styleElement = null;
}
return styleElement;
}
}]);
return DomHandler;
}();
var ConnectedOverlayScrollHandler = /*#__PURE__*/function () {
function ConnectedOverlayScrollHandler(element) {
var listener = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : function () {};
_classCallCheck(this, ConnectedOverlayScrollHandler);
this.element = element;
this.listener = listener;
}
_createClass(ConnectedOverlayScrollHandler, [{
key: "bindScrollListener",
value: function bindScrollListener() {
this.scrollableParents = DomHandler.getScrollableParents(this.element);
for (var i = 0; i < this.scrollableParents.length; i++) {
this.scrollableParents[i].addEventListener('scroll', this.listener);
}
}
}, {
key: "unbindScrollListener",
value: function unbindScrollListener() {
if (this.scrollableParents) {
for (var i = 0; i < this.scrollableParents.length; i++) {
this.scrollableParents[i].removeEventListener('scroll', this.listener);
}
}
}
}, {
key: "destroy",
value: function destroy() {
this.unbindScrollListener();
this.element = null;
this.listener = null;
this.scrollableParents = null;
}
}]);
return ConnectedOverlayScrollHandler;
}();
function EventBus () {
var allHandlers = new Map();
return {
on: function on(type, handler) {
var handlers = allHandlers.get(type);
if (!handlers) handlers = [handler];else handlers.push(handler);
allHandlers.set(type, handlers);
},
off: function off(type, handler) {
var handlers = allHandlers.get(type);
handlers && handlers.splice(handlers.indexOf(handler) >>> 0, 1);
},
emit: function emit(type, evt) {
var handlers = allHandlers.get(type);
handlers && handlers.slice().forEach(function (handler) {
return handler(evt);
});
}
};
}
function ownKeys$V(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$V(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$V(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$V(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function mask(el, options) {
var defaultOptions = {
mask: null,
slotChar: '_',
autoClear: true,
unmask: false,
readOnly: false,
onComplete: null,
onChange: null,
onFocus: null,
onBlur: null
};
options = _objectSpread$V(_objectSpread$V({}, defaultOptions), options);
var tests, partialPosition, len, firstNonMaskPos, defs, androidChrome, lastRequiredNonMaskPos, oldVal, focusText, caretTimeoutId, buffer, defaultBuffer;
var caret = function caret(first, last) {
var range, begin, end;
if (!el.offsetParent || el !== document.activeElement) {
return;
}
if (typeof first === 'number') {
begin = first;
end = typeof last === 'number' ? last : begin;
if (el.setSelectionRange) {
el.setSelectionRange(begin, end);
} else if (el['createTextRange']) {
range = el['createTextRange']();
range.collapse(true);
range.moveEnd('character', end);
range.moveStart('character', begin);
range.select();
}
} else {
if (el.setSelectionRange) {
begin = el.selectionStart;
end = el.selectionEnd;
} else if (document['selection'] && document['selection'].createRange) {
range = document['selection'].createRange();
begin = 0 - range.duplicate().moveStart('character', -100000);
end = begin + range.text.length;
}
return {
begin: begin,
end: end
};
}
};
var isCompleted = function isCompleted() {
for (var i = firstNonMaskPos; i <= lastRequiredNonMaskPos; i++) {
if (tests[i] && buffer[i] === getPlaceholder(i)) {
return false;
}
}
return true;
};
var getPlaceholder = function getPlaceholder(i) {
if (i < options.slotChar.length) {
return options.slotChar.charAt(i);
}
return options.slotChar.charAt(0);
};
var getValue = function getValue() {
return options.unmask ? getUnmaskedValue() : el && el.value;
};
var seekNext = function seekNext(pos) {
while (++pos < len && !tests[pos]) {
}
return pos;
};
var seekPrev = function seekPrev(pos) {
while (--pos >= 0 && !tests[pos]) {
}
return pos;
};
var shiftL = function shiftL(begin, end) {
var i, j;
if (begin < 0) {
return;
}
for (i = begin, j = seekNext(end); i < len; i++) {
if (tests[i]) {
if (j < len && tests[i].test(buffer[j])) {
buffer[i] = buffer[j];
buffer[j] = getPlaceholder(j);
} else {
break;
}
j = seekNext(j);
}
}
writeBuffer();
caret(Math.max(firstNonMaskPos, begin));
};
var shiftR = function shiftR(pos) {
var i, c, j, t;
for (i = pos, c = getPlaceholder(pos); i < len; i++) {
if (tests[i]) {
j = seekNext(i);
t = buffer[i];
buffer[i] = c;
if (j < len && tests[j].test(t)) {
c = t;
} else {
break;
}
}
}
};
var handleAndroidInput = function handleAndroidInput(e) {
var curVal = el.value;
var pos = caret();
if (oldVal && oldVal.length && oldVal.length > curVal.length) {
// a deletion or backspace happened
checkVal(true);
while (pos.begin > 0 && !tests[pos.begin - 1]) {
pos.begin--;
}
if (pos.begin === 0) {
while (pos.begin < firstNonMaskPos && !tests[pos.begin]) {
pos.begin++;
}
}
caret(pos.begin, pos.begin);
} else {
checkVal(true);
while (pos.begin < len && !tests[pos.begin]) {
pos.begin++;
}
caret(pos.begin, pos.begin);
}
if (options.onComplete && isCompleted()) {
options.onComplete({
originalEvent: e,
value: getValue()
});
}
};
var onBlur = function onBlur(e) {
checkVal();
updateModel(e);
if (options.onBlur) {
options.onBlur(e);
}
if (el.value !== focusText) {
var event = document.createEvent('HTMLEvents');
event.initEvent('change', true, false);
el.dispatchEvent(event);
}
};
var onKeyDown = function onKeyDown(e) {
if (options.readOnly) {
return;
}
var k = e.which || e.keyCode,
pos,
begin,
end;
var iPhone = /iphone/i.test(DomHandler.getUserAgent());
oldVal = el.value; //backspace, delete, and escape get special treatment
if (k === 8 || k === 46 || iPhone && k === 127) {
pos = caret();
begin = pos.begin;
end = pos.end;
if (end - begin === 0) {
begin = k !== 46 ? seekPrev(begin) : end = seekNext(begin - 1);
end = k === 46 ? seekNext(end) : end;
}
clearBuffer(begin, end);
shiftL(begin, end - 1);
updateModel(e);
e.preventDefault();
} else if (k === 13) {
// enter
onBlur(e);
updateModel(e);
} else if (k === 27) {
// escape
el.value = focusText;
caret(0, checkVal());
updateModel(e);
e.preventDefault();
}
};
var onKeyPress = function onKeyPress(e) {
if (options.readOnly) {
return;
}
var k = e.which || e.keyCode,
pos = caret(),
p,
c,
next,
completed;
if (e.ctrlKey || e.altKey || e.metaKey || k < 32) {
//Ignore
return;
} else if (k && k !== 13) {
if (pos.end - pos.begin !== 0) {
clearBuffer(pos.begin, pos.end);
shiftL(pos.begin, pos.end - 1);
}
p = seekNext(pos.begin - 1);
if (p < len) {
c = String.fromCharCode(k);
if (tests[p].test(c)) {
shiftR(p);
buffer[p] = c;
writeBuffer();
next = seekNext(p);
if (/android/i.test(DomHandler.getUserAgent())) {
//Path for CSP Violation on FireFox OS 1.1
var proxy = function proxy() {
caret(next);
};
setTimeout(proxy, 0);
} else {
caret(next);
}
if (pos.begin <= lastRequiredNonMaskPos) {
completed = isCompleted();
}
}
}
e.preventDefault();
}
updateModel(e);
if (options.onComplete && completed) {
options.onComplete({
originalEvent: e,
value: getValue()
});
}
};
var clearBuffer = function clearBuffer(start, end) {
var i;
for (i = start; i < end && i < len; i++) {
if (tests[i]) {
buffer[i] = getPlaceholder(i);
}
}
};
var writeBuffer = function writeBuffer() {
el.value = buffer.join('');
};
var checkVal = function checkVal(allow) {
//try to place characters where they belong
var test = el.value,
lastMatch = -1,
i,
c,
pos;
for (i = 0, pos = 0; i < len; i++) {
if (tests[i]) {
buffer[i] = getPlaceholder(i);
while (pos++ < test.length) {
c = test.charAt(pos - 1);
if (tests[i].test(c)) {
buffer[i] = c;
lastMatch = i;
break;
}
}
if (pos > test.length) {
clearBuffer(i + 1, len);
break;
}
} else {
if (buffer[i] === test.charAt(pos)) {
pos++;
}
if (i < partialPosition) {
lastMatch = i;
}
}
}
if (allow) {
writeBuffer();
} else if (lastMatch + 1 < partialPosition) {
if (options.autoClear || buffer.join('') === defaultBuffer) {
// Invalid value. Remove it and replace it with the
// mask, which is the default behavior.
if (el.value) el.value = '';
clearBuffer(0, len);
} else {
// Invalid value, but we opt to show the value to the
// user and allow them to correct their mistake.
writeBuffer();
}
} else {
writeBuffer();
el.value = el.value.substring(0, lastMatch + 1);
}
return partialPosition ? i : firstNonMaskPos;
};
var onFocus = function onFocus(e) {
if (options.readOnly) {
return;
}
clearTimeout(caretTimeoutId);
var pos;
focusText = el.value;
pos = checkVal();
caretTimeoutId = setTimeout(function () {
if (el !== document.activeElement) {
return;
}
writeBuffer();
if (pos === options.mask.replace("?", "").length) {
caret(0, pos);
} else {
caret(pos);
}
}, 10);
if (options.onFocus) {
options.onFocus(e);
}
};
var onInput = function onInput(event) {
if (androidChrome) handleAndroidInput(event);else handleInputChange(event);
};
var handleInputChange = function handleInputChange(e) {
if (options.readOnly) {
return;
}
var pos = checkVal(true);
caret(pos);
updateModel(e);
if (options.onComplete && isCompleted()) {
options.onComplete({
originalEvent: e,
value: getValue()
});
}
};
var getUnmaskedValue = function getUnmaskedValue() {
var unmaskedBuffer = [];
for (var i = 0; i < buffer.length; i++) {
var c = buffer[i];
if (tests[i] && c !== getPlaceholder(i)) {
unmaskedBuffer.push(c);
}
}
return unmaskedBuffer.join('');
};
var updateModel = function updateModel(e) {
if (options.onChange) {
var val = getValue().replace(options.slotChar, '');
options.onChange({
originalEvent: e,
value: defaultBuffer !== val ? val : ''
});
}
};
var bindEvents = function bindEvents() {
el.addEventListener('focus', onFocus);
el.addEventListener('blur', onBlur);
el.addEventListener('keydown', onKeyDown);
el.addEventListener('keypress', onKeyPress);
el.addEventListener('input', onInput);
el.addEventListener('paste', handleInputChange);
};
var unbindEvents = function unbindEvents() {
el.removeEventListener('focus', onFocus);
el.removeEventListener('blur', onBlur);
el.removeEventListener('keydown', onKeyDown);
el.removeEventListener('keypress', onKeyPress);
el.removeEventListener('input', onInput);
el.removeEventListener('paste', handleInputChange);
};
var init = function init() {
tests = [];
partialPosition = options.mask.length;
len = options.mask.length;
firstNonMaskPos = null;
defs = {
'9': '[0-9]',
'a': '[A-Za-z]',
'*': '[A-Za-z0-9]'
};
var ua = DomHandler.getUserAgent();
androidChrome = /chrome/i.test(ua) && /android/i.test(ua);
var maskTokens = options.mask.split('');
for (var i = 0; i < maskTokens.length; i++) {
var c = maskTokens[i];
if (c === '?') {
len--;
partialPosition = i;
} else if (defs[c]) {
tests.push(new RegExp(defs[c]));
if (firstNonMaskPos === null) {
firstNonMaskPos = tests.length - 1;
}
if (i < partialPosition) {
lastRequiredNonMaskPos = tests.length - 1;
}
} else {
tests.push(null);
}
}
buffer = [];
for (var _i = 0; _i < maskTokens.length; _i++) {
var _c = maskTokens[_i];
if (_c !== '?') {
if (defs[_c]) buffer.push(getPlaceholder(_i));else buffer.push(_c);
}
}
defaultBuffer = buffer.join('');
};
if (el && options.mask) {
init();
bindEvents();
}
return {
init: init,
bindEvents: bindEvents,
unbindEvents: unbindEvents,
updateModel: updateModel,
getValue: getValue
};
}
var ObjectUtils = /*#__PURE__*/function () {
function ObjectUtils() {
_classCallCheck(this, ObjectUtils);
}
_createClass(ObjectUtils, null, [{
key: "equals",
value: function equals(obj1, obj2, field) {
if (field && obj1 && _typeof(obj1) === 'object' && obj2 && _typeof(obj2) === 'object') return this.resolveFieldData(obj1, field) === this.resolveFieldData(obj2, field);else return this.deepEquals(obj1, obj2);
}
}, {
key: "deepEquals",
value: function deepEquals(a, b) {
if (a === b) return true;
if (a && b && _typeof(a) == 'object' && _typeof(b) == 'object') {
var arrA = Array.isArray(a),
arrB = Array.isArray(b),
i,
length,
key;
if (arrA && arrB) {
length = a.length;
if (length !== b.length) return false;
for (i = length; i-- !== 0;) {
if (!this.deepEquals(a[i], b[i])) return false;
}
return true;
}
if (arrA !== arrB) return false;
var dateA = a instanceof Date,
dateB = b instanceof Date;
if (dateA !== dateB) return false;
if (dateA && dateB) return a.getTime() === b.getTime();
var regexpA = a instanceof RegExp,
regexpB = b instanceof RegExp;
if (regexpA !== regexpB) return false;
if (regexpA && regexpB) return a.toString() === b.toString();
var keys = Object.keys(a);
length = keys.length;
if (length !== Object.keys(b).length) return false;
for (i = length; i-- !== 0;) {
if (!Object.prototype.hasOwnProperty.call(b, keys[i])) return false;
}
for (i = length; i-- !== 0;) {
key = keys[i];
if (!this.deepEquals(a[key], b[key])) return false;
}
return true;
}
/*eslint no-self-compare: "off"*/
return a !== a && b !== b;
}
}, {
key: "resolveFieldData",
value: function resolveFieldData(data, field) {
if (data && Object.keys(data).length && field) {
if (this.isFunction(field)) {
return field(data);
} else if (field.indexOf('.') === -1) {
return data[field];
} else {
var fields = field.split('.');
var value = data;
for (var i = 0, len = fields.length; i < len; ++i) {
if (value == null) {
return null;
}
value = value[fields[i]];
}
return value;
}
} else {
return null;
}
}
}, {
key: "isFunction",
value: function isFunction(obj) {
return !!(obj && obj.constructor && obj.call && obj.apply);
}
}, {
key: "findDiffKeys",
value: function findDiffKeys(obj1, obj2) {
if (!obj1 || !obj2) {
return {};
}
return Object.keys(obj1).filter(function (key) {
return !obj2.hasOwnProperty(key);
}).reduce(function (result, current) {
result[current] = obj1[current];
return result;
}, {});
}
}, {
key: "reorderArray",
value: function reorderArray(value, from, to) {
var target;
if (value && from !== to) {
if (to >= value.length) {
target = to - value.length;
while (target-- + 1) {
value.push(undefined);
}
}
value.splice(to, 0, value.splice(from, 1)[0]);
}
}
}, {
key: "findIndexInList",
value: function findIndexInList(value, list, dataKey) {
var _this = this;
if (list) {
return dataKey ? list.findIndex(function (item) {
return _this.equals(item, value, dataKey);
}) : list.findIndex(function (item) {
return item === value;
});
}
return -1;
}
}, {
key: "getJSXElement",
value: function getJSXElement(obj) {
for (var _len = arguments.length, params = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
params[_key - 1] = arguments[_key];
}
return this.isFunction(obj) ? obj.apply(void 0, params) : obj;
}
}, {
key: "getPropValue",
value: function getPropValue(obj) {
for (var _len2 = arguments.length, params = new Array(_len2 > 1 ? _len2 - 1 : 0), _key2 = 1; _key2 < _len2; _key2++) {
params[_key2 - 1] = arguments[_key2];
}
return this.isFunction(obj) ? obj.apply(void 0, params) : obj;
}
}, {
key: "getRefElement",
value: function getRefElement(ref) {
if (ref) {
return _typeof(ref) === 'object' && ref.hasOwnProperty('current') ? ref.current : ref;
}
return null;
}
}, {
key: "removeAccents",
value: function removeAccents(str) {
if (str && str.search(/[\xC0-\xFF]/g) > -1) {
str = str.replace(/[\xC0-\xC5]/g, "A").replace(/[\xC6]/g, "AE").replace(/[\xC7]/g, "C").replace(/[\xC8-\xCB]/g, "E").replace(/[\xCC-\xCF]/g, "I").replace(/[\xD0]/g, "D").replace(/[\xD1]/g, "N").replace(/[\xD2-\xD6\xD8]/g, "O").replace(/[\xD9-\xDC]/g, "U").replace(/[\xDD]/g, "Y").replace(/[\xDE]/g, "P").replace(/[\xE0-\xE5]/g, "a").replace(/[\xE6]/g, "ae").replace(/[\xE7]/g, "c").replace(/[\xE8-\xEB]/g, "e").replace(/[\xEC-\xEF]/g, "i").replace(/[\xF1]/g, "n").replace(/[\xF2-\xF6\xF8]/g, "o").replace(/[\xF9-\xFC]/g, "u").replace(/[\xFE]/g, "p").replace(/[\xFD\xFF]/g, "y");
}
return str;
}
}, {
key: "isEmpty",
value: function isEmpty(value) {
return value === null || value === undefined || value === '' || Array.isArray(value) && value.length === 0 || !(value instanceof Date) && _typeof(value) === 'object' && Object.keys(value).length === 0;
}
}, {
key: "isNotEmpty",
value: function isNotEmpty(value) {
return !this.isEmpty(value);
}
}]);
return ObjectUtils;
}();
function _extends() {
_extends = Object.assign || function (target) {
for (var i = 1; i < arguments.length; i++) {
var source = arguments[i];
for (var key in source) {
if (Object.prototype.hasOwnProperty.call(source, key)) {
target[key] = source[key];
}
}
}
return target;
};
return _extends.apply(this, arguments);
}
function ownKeys$U(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$U(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$U(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$U(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
var IconUtils = /*#__PURE__*/function () {
function IconUtils() {
_classCallCheck(this, IconUtils);
}
_createClass(IconUtils, null, [{
key: "getJSXIcon",
value: function getJSXIcon(icon, iconProps, options) {
var content = null;
if (icon) {
var iconType = _typeof(icon);
var className = classNames(iconProps.className, iconType === 'string' && icon);
content = /*#__PURE__*/React__default["default"].createElement("span", _extends({}, iconProps, {
className: className
}));
if (iconType !== 'string') {
var defaultContentOptions = _objectSpread$U({
iconProps: iconProps,
element: content
}, options);
return ObjectUtils.getJSXElement(icon, defaultContentOptions);
}
}
return content;
}
}]);
return IconUtils;
}();
var lastId = 0;
function UniqueComponentId () {
var prefix = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'pr_id_';
lastId++;
return "".concat(prefix).concat(lastId);
}
function handler() {
var zIndexes = [];
var generateZIndex = function generateZIndex(key, autoZIndex) {
var baseZIndex = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 999;
var lastZIndex = getLastZIndex(key, autoZIndex, baseZIndex);
var newZIndex = lastZIndex.value + (lastZIndex.key === key ? 0 : baseZIndex) + 1;
zIndexes.push({
key: key,
value: newZIndex
});
return newZIndex;
};
var revertZIndex = function revertZIndex(zIndex) {
zIndexes = zIndexes.filter(function (obj) {
return obj.value !== zIndex;
});
};
var getCurrentZIndex = function getCurrentZIndex(key, autoZIndex) {
return getLastZIndex(key, autoZIndex).value;
};
var getLastZIndex = function getLastZIndex(key, autoZIndex) {
var baseZIndex = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
return _toConsumableArray(zIndexes).reverse().find(function (obj) {
return autoZIndex ? true : obj.key === key;
}) || {
key: key,
value: baseZIndex
};
};
var getZIndex = function getZIndex(el) {
return el ? parseInt(el.style.zIndex, 10) || 0 : 0;
};
return {
get: getZIndex,
set: function set(key, el, autoZIndex, baseZIndex) {
if (el) {
el.style.zIndex = String(generateZIndex(key, autoZIndex, baseZIndex));
}
},
clear: function clear(el) {
if (el) {
revertZIndex(ZIndexUtils.get(el));
el.style.zIndex = '';
}
},
getCurrent: function getCurrent(key, autoZIndex) {
return getCurrentZIndex(key, autoZIndex);
}
};
}
var ZIndexUtils = handler();
var FilterMatchMode = Object.freeze({
STARTS_WITH: 'startsWith',
CONTAINS: 'contains',
NOT_CONTAINS: 'notContains',
ENDS_WITH: 'endsWith',
EQUALS: 'equals',
NOT_EQUALS: 'notEquals',
IN: 'in',
LESS_THAN: 'lt',
LESS_THAN_OR_EQUAL_TO: 'lte',
GREATER_THAN: 'gt',
GREATER_THAN_OR_EQUAL_TO: 'gte',
BETWEEN: 'between',
DATE_IS: 'dateIs',
DATE_IS_NOT: 'dateIsNot',
DATE_BEFORE: 'dateBefore',
DATE_AFTER: 'dateAfter',
CUSTOM: 'custom'
});
var PrimeReact = /*#__PURE__*/_createClass(function PrimeReact() {
_classCallCheck(this, PrimeReact);
});
_defineProperty(PrimeReact, "ripple", false);
_defineProperty(PrimeReact, "inputStyle", 'outlined');
_defineProperty(PrimeReact, "locale", 'en');
_defineProperty(PrimeReact, "appendTo", null);
_defineProperty(PrimeReact, "cssTransition", true);
_defineProperty(PrimeReact, "autoZIndex", true);
_defineProperty(PrimeReact, "nonce", null);
_defineProperty(PrimeReact, "zIndex", {
modal: 1100,
overlay: 1000,
menu: 1000,
tooltip: 1100,
toast: 1200
});
_defineProperty(PrimeReact, "filterMatchModeOptions", {
text: [FilterMatchMode.STARTS_WITH, FilterMatchMode.CONTAINS, FilterMatchMode.NOT_CONTAINS, FilterMatchMode.ENDS_WITH, FilterMatchMode.EQUALS, FilterMatchMode.NOT_EQUALS],
numeric: [FilterMatchMode.EQUALS, FilterMatchMode.NOT_EQUALS, FilterMatchMode.LESS_THAN, FilterMatchMode.LESS_THAN_OR_EQUAL_TO, FilterMatchMode.GREATER_THAN, FilterMatchMode.GREATER_THAN_OR_EQUAL_TO],
date: [FilterMatchMode.DATE_IS, FilterMatchMode.DATE_IS_NOT, FilterMatchMode.DATE_BEFORE, FilterMatchMode.DATE_AFTER]
});
function ownKeys$T(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$T(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$T(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$T(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
var locales = {
'en': {
startsWith: 'Starts with',
contains: 'Contains',
notContains: 'Not contains',
endsWith: 'Ends with',
equals: 'Equals',
notEquals: 'Not equals',
noFilter: 'No Filter',
lt: 'Less than',
lte: 'Less than or equal to',
gt: 'Greater than',
gte: 'Greater than or equal to',
dateIs: 'Date is',
dateIsNot: 'Date is not',
dateBefore: 'Date is before',
dateAfter: 'Date is after',
custom: 'Custom',
clear: 'Clear',
apply: 'Apply',
matchAll: 'Match All',
matchAny: 'Match Any',
addRule: 'Add Rule',
removeRule: 'Remove Rule',
accept: 'Yes',
reject: 'No',
choose: 'Choose',
upload: 'Upload',
cancel: 'Cancel',
dayNames: ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'],
dayNamesShort: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'],
dayNamesMin: ['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa'],
monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],
monthNamesShort: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
today: 'Today',
weekHeader: 'Wk',
firstDayOfWeek: 0,
dateFormat: 'mm/dd/yy',
weak: 'Weak',
medium: 'Medium',
strong: 'Strong',
passwordPrompt: 'Enter a password',
emptyFilterMessage: 'No results found',
emptyMessage: 'No available options'
}
};
function locale(locale) {
locale && (PrimeReact.locale = locale);
return {
locale: PrimeReact.locale,
options: locales[PrimeReact.locale]
};
}
function addLocale(locale, options) {
locales[locale] = _objectSpread$T(_objectSpread$T({}, locales['en']), options);
}
function updateLocaleOption(key, value, locale) {
localeOptions(locale)[key] = value;
}
function updateLocaleOptions(options, locale) {
var _locale = locale || PrimeReact.locale;
locales[_locale] = _objectSpread$T(_objectSpread$T({}, locales[_locale]), options);
}
function localeOption(key, locale) {
var _locale = locale || PrimeReact.locale;
try {
return localeOptions(_locale)[key];
} catch (error) {
throw new Error("The ".concat(key, " option is not found in the current locale('").concat(_locale, "')."));
}
}
function localeOptions(locale) {
var _locale = locale || PrimeReact.locale;
return locales[_locale];
}
var PrimeIcons = Object.freeze({
ALIGN_CENTER: 'pi pi-align-center',
ALIGN_JUSTIFY: 'pi pi-align-justify',
ALIGN_LEFT: 'pi pi-align-left',
ALIGN_RIGHT: 'pi pi-align-right',
AMAZON: 'pi pi-amazon',
ANDROID: 'pi pi-android',
ANGLE_DOUBLE_DOWN: 'pi pi-angle-double-down',
ANGLE_DOUBLE_LEFT: 'pi pi-angle-double-left',
ANGLE_DOUBLE_RIGHT: 'pi pi-angle-double-right',
ANGLE_DOUBLE_UP: 'pi pi-angle-double-up',
ANGLE_DOWN: 'pi pi-angle-down',
ANGLE_LEFT: 'pi pi-angle-left',
ANGLE_RIGHT: 'pi pi-angle-right',
ANGLE_UP: 'pi pi-angle-up',
APPLE: 'pi pi-apple',
ARROW_CIRCLE_DOWN: 'pi pi-arrow-circle-down',
ARROW_CIRCLE_LEFT: 'pi pi-arrow-circle-left',
ARROW_CIRCLE_RIGHT: 'pi pi-arrow-circle-right',
ARROW_CIRCLE_UP: 'pi pi-arrow-circle-up',
ARROW_DOWN: 'pi pi-arrow-down',
ARROW_DOWN_LEFT: 'pi pi-arrow-down-left',
ARROW_DOWN_RIGHT: 'pi pi-arrow-down-right',
ARROW_LEFT: 'pi pi-arrow-left',
ARROW_RIGHT: 'pi pi-arrow-right',
ARROW_UP: 'pi pi-arrow-up',
ARROW_UP_LEFT: 'pi pi-arrow-up-left',
ARROW_UP_RIGHT: 'pi pi-arrow-up-right',
ARROW_H: 'pi pi-arrow-h',
ARROW_V: 'pi pi-arrow-v',
AT: 'pi pi-at',
BACKWARD: 'pi pi-backward',
BAN: 'pi pi-ban',
BARS: 'pi pi-bars',
BELL: 'pi pi-bell',
BOLT: 'pi pi-bolt',
BOOK: 'pi pi-book',
BOOKMARK: 'pi pi-bookmark',
BOOKMARK_FILL: 'pi pi-bookmark-fill',
BOX: 'pi pi-box',
BRIEFCASE: 'pi pi-briefcase',
BUILDING: 'pi pi-building',
CALENDAR: 'pi pi-calendar',
CALENDAR_MINUS: 'pi pi-calendar-minus',
CALENDAR_PLUS: 'pi pi-calendar-plus',
CALENDAR_TIMES: 'pi pi-calendar-times',
CAMERA: 'pi pi-camera',
CAR: 'pi pi-car',
CARET_DOWN: 'pi pi-caret-down',
CARET_LEFT: 'pi pi-caret-left',
CARET_RIGHT: 'pi pi-caret-right',
CARET_UP: 'pi pi-caret-up',
CHART_BAR: 'pi pi-chart-bar',
CHART_LINE: 'pi pi-chart-line',
CHART_PIE: 'pi pi-chart-pie',
CHECK: 'pi pi-check',
CHECK_CIRCLE: 'pi pi-check-circle',
CHECK_SQUARE: 'pi pi-check-square',
CHEVRON_CIRCLE_DOWN: 'pi pi-chevron-circle-down',
CHEVRON_CIRCLE_LEFT: 'pi pi-chevron-circle-left',
CHEVRON_CIRCLE_RIGHT: 'pi pi-chevron-circle-right',
CHEVRON_CIRCLE_UP: 'pi pi-chevron-circle-up',
CHEVRON_DOWN: 'pi pi-chevron-down',
CHEVRON_LEFT: 'pi pi-chevron-left',
CHEVRON_RIGHT: 'pi pi-chevron-right',
CHEVRON_UP: 'pi pi-chevron-up',
CIRCLE: 'pi pi-circle',
CIRCLE_FILL: 'pi pi-circle-fill',
CLOCK: 'pi pi-clock',
CLONE: 'pi pi-clone',
CLOUD: 'pi pi-cloud',
CLOUD_DOWNLOAD: 'pi pi-cloud-download',
CLOUD_UPLOAD: 'pi pi-cloud-upload',
CODE: 'pi pi-code',
COG: 'pi pi-cog',
COMMENT: 'pi pi-comment',
COMMENTS: 'pi pi-comments',
COMPASS: 'pi pi-compass',
COPY: 'pi pi-copy',
CREDIT_CARD: 'pi pi-credit-card',
DATABASE: 'pi pi-database',
DESKTOP: 'pi pi-desktop',
DIRECTIONS: 'pi pi-directions',
DIRECTIONS_ALT: 'pi pi-directions-alt',
DISCORD: 'pi pi-discord',
DOLLAR: 'pi pi-dollar',
DOWNLOAD: 'pi pi-download',
EJECT: 'pi pi-eject',
ELLIPSIS_H: 'pi pi-ellipsis-h',
ELLIPSIS_V: 'pi pi-ellipsis-v',
ENVELOPE: 'pi pi-envelope',
EURO: 'pi pi-euro',
EXCLAMATION_CIRCLE: 'pi pi-exclamation-circle',
EXCLAMATION_TRIANGLE: 'pi pi-exclamation-triangle',
EXTERNAL_LINK: 'pi pi-external-link',
EYE: 'pi pi-eye',
EYE_SLASH: 'pi pi-eye-slash',
FACEBOOK: 'pi pi-facebook',
FAST_BACKWARD: 'pi pi-fast-backward',
FAST_FORWARD: 'pi pi-fast-forward',
FILE: 'pi pi-file',
FILE_EXCEL: 'pi pi-file-excel',
FILE_PDF: 'pi pi-file-pdf',
FILTER: 'pi pi-filter',
FILTER_FILL: 'pi pi-filter-fill',
FILTER_SLASH: 'pi pi-filter-slash',
FLAG: 'pi pi-flag',
FLAG_FILL: 'pi pi-flag-fill',
FOLDER: 'pi pi-folder',
FOLDER_OPEN: 'pi pi-folder-open',
FORWARD: 'pi pi-forward',
GITHUB: 'pi pi-github',
GLOBE: 'pi pi-globe',
GOOGLE: 'pi pi-google',
HASHTAG: 'pi pi-hashtag',
HEART: 'pi pi-heart',
HEART_FILL: 'pi pi-heart-fill',
HISTORY: 'pi pi-history',
HOME: 'pi pi-home',
ID_CARD: 'pi pi-id-card',
IMAGE: 'pi pi-image',
IMAGES: 'pi pi-images',
INBOX: 'pi pi-inbox',
INFO: 'pi pi-info',
INFO_CIRCLE: 'pi pi-info-circle',
INSTAGRAM: 'pi pi-instagram',
KEY: 'pi pi-key',
LINK: 'pi pi-link',
LINKEDIN: 'pi pi-linkedin',
LIST: 'pi pi-list',
LOCK: 'pi pi-lock',
LOCK_OPEN: 'pi pi-lock-open',
MAP: 'pi pi-map',
MAP_MARKER: 'pi pi-map-marker',
MICROSOFT: 'pi pi-microsoft',
MINUS: 'pi pi-minus',
MINUS_CIRCLE: 'pi pi-minus-circle',
MOBILE: 'pi pi-mobile',
MONEY_BILL: 'pi pi-money-bill',
MOON: 'pi pi-moon',
PALETTE: 'pi pi-palette',
PAPERCLIP: 'pi pi-paperclip',
PAUSE: 'pi pi-pause',
PAYPAL: 'pi pi-paypal',
PENCIL: 'pi pi-pencil',
PERCENTAGE: 'pi pi-percentage',
PHONE: 'pi pi-phone',
PLAY: 'pi pi-play',
PLUS: 'pi pi-plus',
PLUS_CIRCLE: 'pi pi-plus-circle',
POUND: 'pi pi-pound',
POWER_OFF: 'pi pi-power-off',
PRIME: 'pi pi-prime',
PRINT: 'pi pi-print',
QRCODE: 'pi pi-qrcode',
QUESTION: 'pi pi-question',
QUESTION_CIRCLE: 'pi pi-question-circle',
REDDIT: 'pi pi-reddit',
REFRESH: 'pi pi-refresh',
REPLAY: 'pi pi-replay',
REPLY: 'pi pi-reply',
SAVE: 'pi pi-save',
SEARCH: 'pi pi-search',
SEARCH_MINUS: 'pi pi-search-minus',
SEARCH_PLUS: 'pi pi-search-plus',
SEND: 'pi pi-send',
SERVER: 'pi pi-server',
SHARE_ALT: 'pi pi-share-alt',
SHIELD: 'pi pi-shield',
SHOPPING_BAG: 'pi pi-shopping-bag',
SHOPPING_CART: 'pi pi-shopping-cart',
SIGN_IN: 'pi pi-sign-in',
SIGN_OUT: 'pi pi-sign-out',
SITEMAP: 'pi pi-sitemap',
SLACK: 'pi pi-slack',
SLIDERS_H: 'pi pi-sliders-h',
SLIDERS_V: 'pi pi-sliders-v',
SORT: 'pi pi-sort',
SORT_ALPHA_DOWN: 'pi pi-sort-alpha-down',
SORT_ALPHA_ALT_DOWN: 'pi pi-sort-alpha-alt-down',
SORT_ALPHA_UP: 'pi pi-sort-alpha-up',
SORT_ALPHA_ALT_UP: 'pi pi-sort-alpha-alt-up',
SORT_ALT: 'pi pi-sort-alt',
SORT_ALT_SLASH: 'pi pi-sort-slash',
SORT_AMOUNT_DOWN: 'pi pi-sort-amount-down',
SORT_AMOUNT_DOWN_ALT: 'pi pi-sort-amount-down-alt',
SORT_AMOUNT_UP: 'pi pi-sort-amount-up',
SORT_AMOUNT_UP_ALT: 'pi pi-sort-amount-up-alt',
SORT_DOWN: 'pi pi-sort-down',
SORT_NUMERIC_DOWN: 'pi pi-sort-numeric-down',
SORT_NUMERIC_ALT_DOWN: 'pi pi-sort-numeric-alt-down',
SORT_NUMERIC_UP: 'pi pi-sort-numeric-up',
SORT_NUMERIC_ALT_UP: 'pi pi-sort-numeric-alt-up',
SORT_UP: 'pi pi-sort-up',
SPINNER: 'pi pi-spinner',
STAR: 'pi pi-star',
STAR_FILL: 'pi pi-star-fill',
STEP_BACKWARD: 'pi pi-step-backward',
STEP_BACKWARD_ALT: 'pi pi-step-backward-alt',
STEP_FORWARD: 'pi pi-step-forward',
STEP_FORWARD_ALT: 'pi pi-step-forward-alt',
STOP: 'pi pi-stop',
STOP_CIRCLE: 'pi pi-stop-circle',
SUN: 'pi pi-sun',
SYNC: 'pi pi-sync',
TABLE: 'pi pi-table',
TABLET: 'pi pi-tablet',
TAG: 'pi pi-tag',
TAGS: 'pi pi-tags',
TELEGRAM: 'pi pi-telegram',
TH_LARGE: 'pi pi-th-large',
THUMBS_DOWN: 'pi pi-thumbs-down',
THUMBS_UP: 'pi pi-thumbs-up',
TICKET: 'pi pi-ticket',
TIMES: 'pi pi-times',
TIMES_CIRCLE: 'pi pi-times-circle',
TRASH: 'pi pi-trash',
TWITTER: 'pi pi-twitter',
UNDO: 'pi pi-undo',
UNLOCK: 'pi pi-unlock',
UPLOAD: 'pi pi-upload',
USER: 'pi pi-user',
USER_EDIT: 'pi pi-user-edit',
USER_MINUS: 'pi pi-user-minus',
USER_PLUS: 'pi pi-user-plus',
USERS: 'pi pi-users',
VIDEO: 'pi pi-video',
VIMEO: 'pi pi-vimeo',
VOLUME_DOWN: 'pi pi-volume-down',
VOLUME_OFF: 'pi pi-volume-off',
VOLUME_UP: 'pi pi-volume-up',
WALLET: 'pi pi-wallet',
WHATSAPP: 'pi pi-whatsapp',
WIFI: 'pi pi-wifi',
WINDOW_MAXIMIZE: 'pi pi-window-maximize',
WINDOW_MINIMIZE: 'pi pi-window-minimize',
YOUTUBE: 'pi pi-youtube'
});
var MessageSeverity = Object.freeze({
SUCCESS: 'success',
INFO: 'info',
WARN: 'warn',
ERROR: 'error'
});
var FilterOperator = Object.freeze({
AND: 'and',
OR: 'or'
});
function _createForOfIteratorHelper$h(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray$h(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it["return"] != null) it["return"](); } finally { if (didErr) throw err; } } }; }
function _unsupportedIterableToArray$h(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray$h(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray$h(o, minLen); }
function _arrayLikeToArray$h(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
var FilterService = {
filter: function filter(value, fields, filterValue, filterMatchMode, filterLocale) {
var filteredItems = [];
if (value) {
var _iterator = _createForOfIteratorHelper$h(value),
_step;
try {
for (_iterator.s(); !(_step = _iterator.n()).done;) {
var item = _step.value;
var _iterator2 = _createForOfIteratorHelper$h(fields),
_step2;
try {
for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
var field = _step2.value;
var fieldValue = ObjectUtils.resolveFieldData(item, field);
if (this.filters[filterMatchMode](fieldValue, filterValue, filterLocale)) {
filteredItems.push(item);
break;
}
}
} catch (err) {
_iterator2.e(err);
} finally {
_iterator2.f();
}
}
} catch (err) {
_iterator.e(err);
} finally {
_iterator.f();
}
}
return filteredItems;
},
filters: {
startsWith: function startsWith(value, filter, filterLocale) {
if (filter === undefined || filter === null || filter.trim() === '') {
return true;
}
if (value === undefined || value === null) {
return false;
}
var filterValue = ObjectUtils.removeAccents(filter.toString()).toLocaleLowerCase(filterLocale);
var stringValue = ObjectUtils.removeAccents(value.toString()).toLocaleLowerCase(filterLocale);
return stringValue.slice(0, filterValue.length) === filterValue;
},
contains: function contains(value, filter, filterLocale) {
if (filter === undefined || filter === null || typeof filter === 'string' && filter.trim() === '') {
return true;
}
if (value === undefined || value === null) {
return false;
}
var filterValue = ObjectUtils.removeAccents(filter.toString()).toLocaleLowerCase(filterLocale);
var stringValue = ObjectUtils.removeAccents(value.toString()).toLocaleLowerCase(filterLocale);
return stringValue.indexOf(filterValue) !== -1;
},
notContains: function notContains(value, filter, filterLocale) {
if (filter === undefined || filter === null || typeof filter === 'string' && filter.trim() === '') {
return true;
}
if (value === undefined || value === null) {
return false;
}
var filterValue = ObjectUtils.removeAccents(filter.toString()).toLocaleLowerCase(filterLocale);
var stringValue = ObjectUtils.removeAccents(value.toString()).toLocaleLowerCase(filterLocale);
return stringValue.indexOf(filterValue) === -1;
},
endsWith: function endsWith(value, filter, filterLocale) {
if (filter === undefined || filter === null || filter.trim() === '') {
return true;
}
if (value === undefined || value === null) {
return false;
}
var filterValue = ObjectUtils.removeAccents(filter.toString()).toLocaleLowerCase(filterLocale);
var stringValue = ObjectUtils.removeAccents(value.toString()).toLocaleLowerCase(filterLocale);
return stringValue.indexOf(filterValue, stringValue.length - filterValue.length) !== -1;
},
equals: function equals(value, filter, filterLocale) {
if (filter === undefined || filter === null || typeof filter === 'string' && filter.trim() === '') {
return true;
}
if (value === undefined || value === null) {
return false;
}
if (value.getTime && filter.getTime) return value.getTime() === filter.getTime();else return ObjectUtils.removeAccents(value.toString()).toLocaleLowerCase(filterLocale) === ObjectUtils.removeAccents(filter.toString()).toLocaleLowerCase(filterLocale);
},
notEquals: function notEquals(value, filter, filterLocale) {
if (filter === undefined || filter === null || typeof filter === 'string' && filter.trim() === '') {
return false;
}
if (value === undefined || value === null) {
return true;
}
if (value.getTime && filter.getTime) return value.getTime() !== filter.getTime();else return ObjectUtils.removeAccents(value.toString()).toLocaleLowerCase(filterLocale) !== ObjectUtils.removeAccents(filter.toString()).toLocaleLowerCase(filterLocale);
},
"in": function _in(value, filter) {
if (filter === undefined || filter === null || filter.length === 0) {
return true;
}
for (var i = 0; i < filter.length; i++) {
if (ObjectUtils.equals(value, filter[i])) {
return true;
}
}
return false;
},
between: function between(value, filter) {
if (filter == null || filter[0] == null || filter[1] == null) {
return true;
}
if (value === undefined || value === null) {
return false;
}
if (value.getTime) return filter[0].getTime() <= value.getTime() && value.getTime() <= filter[1].getTime();else return filter[0] <= value && value <= filter[1];
},
lt: function lt(value, filter) {
if (filter === undefined || filter === null) {
return true;
}
if (value === undefined || value === null) {
return false;
}
if (value.getTime && filter.getTime) return value.getTime() < filter.getTime();else return value < filter;
},
lte: function lte(value, filter) {
if (filter === undefined || filter === null) {
return true;
}
if (value === undefined || value === null) {
return false;
}
if (value.getTime && filter.getTime) return value.getTime() <= filter.getTime();else return value <= filter;
},
gt: function gt(value, filter) {
if (filter === undefined || filter === null) {
return true;
}
if (value === undefined || value === null) {
return false;
}
if (value.getTime && filter.getTime) return value.getTime() > filter.getTime();else return value > filter;
},
gte: function gte(value, filter) {
if (filter === undefined || filter === null) {
return true;
}
if (value === undefined || value === null) {
return false;
}
if (value.getTime && filter.getTime) return value.getTime() >= filter.getTime();else return value >= filter;
},
dateIs: function dateIs(value, filter) {
if (filter === undefined || filter === null) {
return true;
}
if (value === undefined || value === null) {
return false;
}
return value.toDateString() === filter.toDateString();
},
dateIsNot: function dateIsNot(value, filter) {
if (filter === undefined || filter === null) {
return true;
}
if (value === undefined || value === null) {
return false;
}
return value.toDateString() !== filter.toDateString();
},
dateBefore: function dateBefore(value, filter) {
if (filter === undefined || filter === null) {
return true;
}
if (value === undefined || value === null) {
return false;
}
return value.getTime() < filter.getTime();
},
dateAfter: function dateAfter(value, filter) {
if (filter === undefined || filter === null) {
return true;
}
if (value === undefined || value === null) {
return false;
}
return value.getTime() > filter.getTime();
}
},
register: function register(rule, fn) {
this.filters[rule] = fn;
}
};
function ownKeys$S(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$S(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$S(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$S(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createSuper$2l(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$2l(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$2l() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var CSSTransition = /*#__PURE__*/function (_Component) {
_inherits(CSSTransition, _Component);
var _super = _createSuper$2l(CSSTransition);
function CSSTransition(props) {
var _this;
_classCallCheck(this, CSSTransition);
_this = _super.call(this, props);
_this.onEnter = _this.onEnter.bind(_assertThisInitialized(_this));
_this.onEntering = _this.onEntering.bind(_assertThisInitialized(_this));
_this.onEntered = _this.onEntered.bind(_assertThisInitialized(_this));
_this.onExit = _this.onExit.bind(_assertThisInitialized(_this));
_this.onExiting = _this.onExiting.bind(_assertThisInitialized(_this));
_this.onExited = _this.onExited.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(CSSTransition, [{
key: "disabled",
get: function get() {
return this.props.disabled || this.props.options && this.props.options.disabled || !PrimeReact.cssTransition;
}
}, {
key: "onEnter",
value: function onEnter(node, isAppearing) {
this.props.onEnter && this.props.onEnter(node, isAppearing); // component
this.props.options && this.props.options.onEnter && this.props.options.onEnter(node, isAppearing); // user option
}
}, {
key: "onEntering",
value: function onEntering(node, isAppearing) {
this.props.onEntering && this.props.onEntering(node, isAppearing); // component
this.props.options && this.props.options.onEntering && this.props.options.onEntering(node, isAppearing); // user option
}
}, {
key: "onEntered",
value: function onEntered(node, isAppearing) {
this.props.onEntered && this.props.onEntered(node, isAppearing); // component
this.props.options && this.props.options.onEntered && this.props.options.onEntered(node, isAppearing); // user option
}
}, {
key: "onExit",
value: function onExit(node) {
this.props.onExit && this.props.onExit(node); // component
this.props.options && this.props.options.onExit && this.props.options.onExit(node); // user option
}
}, {
key: "onExiting",
value: function onExiting(node) {
this.props.onExiting && this.props.onExiting(node); // component
this.props.options && this.props.options.onExiting && this.props.options.onExiting(node); // user option
}
}, {
key: "onExited",
value: function onExited(node) {
this.props.onExited && this.props.onExited(node); // component
this.props.options && this.props.options.onExited && this.props.options.onExited(node); // user option
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps) {
if (this.props["in"] !== prevProps["in"] && this.disabled) {
// no animation
var node = ObjectUtils.getRefElement(this.props.nodeRef);
if (this.props["in"]) {
this.onEnter(node, true);
this.onEntering(node, true);
this.onEntered(node, true);
} else {
this.onExit(node);
this.onExiting(node);
this.onExited(node);
}
}
}
}, {
key: "render",
value: function render() {
if (this.disabled) {
return this.props["in"] ? this.props.children : null;
} else {
var immutableProps = {
nodeRef: this.props.nodeRef,
"in": this.props["in"],
onEnter: this.onEnter,
onEntering: this.onEntering,
onEntered: this.onEntered,
onExit: this.onExit,
onExiting: this.onExiting,
onExited: this.onExited
};
var mutableProps = {
classNames: this.props.classNames,
timeout: this.props.timeout,
unmountOnExit: this.props.unmountOnExit
};
var props = _objectSpread$S(_objectSpread$S(_objectSpread$S({}, mutableProps), this.props.options || {}), immutableProps);
return /*#__PURE__*/React__default["default"].createElement(reactTransitionGroup.CSSTransition, props, this.props.children);
}
}
}]);
return CSSTransition;
}(React.Component);
function ownKeys$R(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$R(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$R(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$R(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createSuper$2k(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$2k(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$2k() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var AccordionTab = /*#__PURE__*/function (_Component) {
_inherits(AccordionTab, _Component);
var _super = _createSuper$2k(AccordionTab);
function AccordionTab() {
_classCallCheck(this, AccordionTab);
return _super.apply(this, arguments);
}
return _createClass(AccordionTab);
}(React.Component);
_defineProperty(AccordionTab, "defaultProps", {
header: null,
disabled: false,
style: null,
className: null,
headerStyle: null,
headerClassName: null,
headerTemplate: null,
contentStyle: null,
contentClassName: null
});
var Accordion = /*#__PURE__*/function (_Component2) {
_inherits(Accordion, _Component2);
var _super2 = _createSuper$2k(Accordion);
function Accordion(props) {
var _this;
_classCallCheck(this, Accordion);
_this = _super2.call(this, props);
var state = {
id: _this.props.id
};
if (!_this.props.onTabChange) {
state = _objectSpread$R(_objectSpread$R({}, state), {}, {
activeIndex: props.activeIndex
});
}
_this.state = state;
return _this;
}
_createClass(Accordion, [{
key: "shouldTabRender",
value: function shouldTabRender(tab) {
return tab && tab.type === AccordionTab;
}
}, {
key: "onTabHeaderClick",
value: function onTabHeaderClick(event, tab, index) {
if (!tab.props.disabled) {
var selected = this.isSelected(index);
var newActiveIndex = null;
if (this.props.multiple) {
var indexes = (this.props.onTabChange ? this.props.activeIndex : this.state.activeIndex) || [];
if (selected) indexes = indexes.filter(function (i) {
return i !== index;
});else indexes = [].concat(_toConsumableArray(indexes), [index]);
newActiveIndex = indexes;
} else {
newActiveIndex = selected ? null : index;
}
var callback = selected ? this.props.onTabClose : this.props.onTabOpen;
if (callback) {
callback({
originalEvent: event,
index: index
});
}
if (this.props.onTabChange) {
this.props.onTabChange({
originalEvent: event,
index: newActiveIndex
});
} else {
this.setState({
activeIndex: newActiveIndex
});
}
}
event.preventDefault();
}
}, {
key: "isSelected",
value: function isSelected(index) {
var activeIndex = this.props.onTabChange ? this.props.activeIndex : this.state.activeIndex;
return this.props.multiple ? activeIndex && activeIndex.indexOf(index) >= 0 : activeIndex === index;
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
if (!this.state.id) {
this.setState({
id: UniqueComponentId()
});
}
}
}, {
key: "renderTabHeader",
value: function renderTabHeader(tab, selected, index) {
var _this2 = this;
var style = _objectSpread$R(_objectSpread$R({}, tab.props.headerStyle || {}), tab.props.style || {});
var className = classNames('p-accordion-header', {
'p-highlight': selected,
'p-disabled': tab.props.disabled
}, tab.props.headerClassName, tab.props.className);
var id = this.state.id + '_header_' + index;
var ariaControls = this.state.id + '_content_' + index;
var tabIndex = tab.props.disabled ? -1 : null;
var header = tab.props.headerTemplate ? ObjectUtils.getJSXElement(tab.props.headerTemplate, tab.props) : /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-accordion-header-text"
}, tab.props.header);
var icon = selected ? this.props.collapseIcon : this.props.expandIcon;
return /*#__PURE__*/React__default["default"].createElement("div", {
className: className,
style: style
}, /*#__PURE__*/React__default["default"].createElement("a", {
href: '#' + ariaControls,
id: id,
className: "p-accordion-header-link",
"aria-controls": ariaControls,
role: "tab",
"aria-expanded": selected,
onClick: function onClick(event) {
return _this2.onTabHeaderClick(event, tab, index);
},
tabIndex: tabIndex
}, IconUtils.getJSXIcon(icon, {
className: 'p-accordion-toggle-icon'
}, {
props: this.props,
selected: selected
}), header));
}
}, {
key: "renderTabContent",
value: function renderTabContent(tab, selected, index) {
var style = _objectSpread$R(_objectSpread$R({}, tab.props.contentStyle || {}), tab.props.style || {});
var className = classNames('p-toggleable-content', tab.props.contentClassName, tab.props.className);
var id = this.state.id + '_content_' + index;
var toggleableContentRef = /*#__PURE__*/React__default["default"].createRef();
return /*#__PURE__*/React__default["default"].createElement(CSSTransition, {
nodeRef: toggleableContentRef,
classNames: "p-toggleable-content",
timeout: {
enter: 1000,
exit: 450
},
"in": selected,
unmountOnExit: true,
options: this.props.transitionOptions
}, /*#__PURE__*/React__default["default"].createElement("div", {
ref: toggleableContentRef,
id: id,
className: className,
style: style,
role: "region",
"aria-labelledby": this.state.id + '_header_' + index
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-accordion-content"
}, tab.props.children)));
}
}, {
key: "renderTab",
value: function renderTab(tab, index) {
var selected = this.isSelected(index);
var tabHeader = this.renderTabHeader(tab, selected, index);
var tabContent = this.renderTabContent(tab, selected, index);
var tabClassName = classNames('p-accordion-tab', {
'p-accordion-tab-active': selected
});
return /*#__PURE__*/React__default["default"].createElement("div", {
key: tab.props.header,
className: tabClassName
}, tabHeader, tabContent);
}
}, {
key: "renderTabs",
value: function renderTabs() {
var _this3 = this;
return React__default["default"].Children.map(this.props.children, function (tab, index) {
if (_this3.shouldTabRender(tab)) {
return _this3.renderTab(tab, index);
}
});
}
}, {
key: "render",
value: function render() {
var _this4 = this;
var className = classNames('p-accordion p-component', this.props.className);
var tabs = this.renderTabs();
return /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this4.container = el;
},
id: this.state.id,
className: className,
style: this.props.style
}, tabs);
}
}]);
return Accordion;
}(React.Component);
_defineProperty(Accordion, "defaultProps", {
id: null,
activeIndex: null,
className: null,
style: null,
multiple: false,
expandIcon: 'pi pi-chevron-right',
collapseIcon: 'pi pi-chevron-down',
transitionOptions: null,
onTabOpen: null,
onTabClose: null,
onTabChange: null
});
var KeyFilter = /*#__PURE__*/function () {
function KeyFilter() {
_classCallCheck(this, KeyFilter);
}
_createClass(KeyFilter, null, [{
key: "isNavKeyPress",
value:
/* eslint-disable */
/* eslint-enable */
function isNavKeyPress(e) {
var k = e.keyCode;
k = DomHandler.getBrowser().safari ? KeyFilter.SAFARI_KEYS[k] || k : k;
return k >= 33 && k <= 40 || k === KeyFilter.KEYS.RETURN || k === KeyFilter.KEYS.TAB || k === KeyFilter.KEYS.ESC;
}
}, {
key: "isSpecialKey",
value: function isSpecialKey(e) {
var k = e.keyCode;
return k === 9 || k === 13 || k === 27 || k === 16 || k === 17 || k >= 18 && k <= 20 || DomHandler.getBrowser().opera && !e.shiftKey && (k === 8 || k >= 33 && k <= 35 || k >= 36 && k <= 39 || k >= 44 && k <= 45);
}
}, {
key: "getKey",
value: function getKey(e) {
var k = e.keyCode || e.charCode;
return DomHandler.getBrowser().safari ? KeyFilter.SAFARI_KEYS[k] || k : k;
}
}, {
key: "getCharCode",
value: function getCharCode(e) {
return e.charCode || e.keyCode || e.which;
}
}, {
key: "onKeyPress",
value: function onKeyPress(e, keyfilter, validateOnly) {
if (validateOnly) {
return;
}
var regex = KeyFilter.DEFAULT_MASKS[keyfilter] ? KeyFilter.DEFAULT_MASKS[keyfilter] : keyfilter;
var browser = DomHandler.getBrowser();
if (e.ctrlKey || e.altKey) {
return;
}
var k = this.getKey(e);
if (browser.mozilla && (this.isNavKeyPress(e) || k === KeyFilter.KEYS.BACKSPACE || k === KeyFilter.KEYS.DELETE && e.charCode === 0)) {
return;
}
var c = this.getCharCode(e);
var cc = String.fromCharCode(c);
if (browser.mozilla && (this.isSpecialKey(e) || !cc)) {
return;
}
if (!regex.test(cc)) {
e.preventDefault();
}
}
}, {
key: "validate",
value: function validate(e, keyfilter) {
var value = e.target.value,
validatePattern = true;
if (value && !keyfilter.test(value)) {
validatePattern = false;
}
return validatePattern;
}
}]);
return KeyFilter;
}();
_defineProperty(KeyFilter, "DEFAULT_MASKS", {
pint: /[\d]/,
"int": /[\d\-]/,
pnum: /[\d\.]/,
money: /[\d\.\s,]/,
num: /[\d\-\.]/,
hex: /[0-9a-f]/i,
email: /[a-z0-9_\.\-@]/i,
alpha: /[a-z_]/i,
alphanum: /[a-z0-9_]/i
});
_defineProperty(KeyFilter, "KEYS", {
TAB: 9,
RETURN: 13,
ESC: 27,
BACKSPACE: 8,
DELETE: 46
});
_defineProperty(KeyFilter, "SAFARI_KEYS", {
63234: 37,
// left
63235: 39,
// right
63232: 38,
// up
63233: 40,
// down
63276: 33,
// page up
63277: 34,
// page down
63272: 46,
// delete
63273: 36,
// home
63275: 35 // end
});
function _createSuper$2j(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$2j(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$2j() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var Portal = /*#__PURE__*/function (_Component) {
_inherits(Portal, _Component);
var _super = _createSuper$2j(Portal);
function Portal(props) {
var _this;
_classCallCheck(this, Portal);
_this = _super.call(this, props);
var mounted = props.visible && DomHandler.hasDOM();
_this.state = {
mounted: mounted
};
return _this;
}
_createClass(Portal, [{
key: "componentDidMount",
value: function componentDidMount() {
if (DomHandler.hasDOM() && !this.state.mounted) {
this.setState({
mounted: true
}, this.props.onMounted);
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
this.props.onUnmounted && this.props.onUnmounted();
}
}, {
key: "render",
value: function render() {
var element = this.props.element || this.props.children;
if (element && this.state.mounted) {
var appendTo = this.props.appendTo || PrimeReact.appendTo || document.body;
return appendTo === 'self' ? element : /*#__PURE__*/ReactDOM__default["default"].createPortal(element, appendTo);
}
return null;
}
}]);
return Portal;
}(React.Component);
_defineProperty(Portal, "defaultProps", {
element: null,
appendTo: null,
visible: false,
onMounted: null,
onUnmounted: null
});
function _createSuper$2i(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$2i(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$2i() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
function ownKeys$Q(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$Q(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$Q(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$Q(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function tip(props) {
var appendTo = props.appendTo || document.body;
var tooltipWrapper = document.createDocumentFragment();
DomHandler.appendChild(tooltipWrapper, appendTo);
props = _objectSpread$Q(_objectSpread$Q({}, props), props.options);
var tooltipEl = /*#__PURE__*/React__default["default"].createElement(Tooltip, props);
ReactDOM__default["default"].render(tooltipEl, tooltipWrapper);
var updateTooltip = function updateTooltip(newProps) {
props = _objectSpread$Q(_objectSpread$Q({}, props), newProps);
ReactDOM__default["default"].render( /*#__PURE__*/React__default["default"].cloneElement(tooltipEl, props), tooltipWrapper);
};
return {
destroy: function destroy() {
ReactDOM__default["default"].unmountComponentAtNode(tooltipWrapper);
},
updateContent: function updateContent(newContent) {
console.warn("The 'updateContent' method has been deprecated on Tooltip. Use update(newProps) method.");
updateTooltip({
content: newContent
});
},
update: function update(newProps) {
updateTooltip(newProps);
}
};
}
var Tooltip = /*#__PURE__*/function (_Component) {
_inherits(Tooltip, _Component);
var _super = _createSuper$2i(Tooltip);
function Tooltip(props) {
var _this;
_classCallCheck(this, Tooltip);
_this = _super.call(this, props);
_this.state = {
visible: false,
position: _this.props.position
};
_this.show = _this.show.bind(_assertThisInitialized(_this));
_this.hide = _this.hide.bind(_assertThisInitialized(_this));
_this.onMouseEnter = _this.onMouseEnter.bind(_assertThisInitialized(_this));
_this.onMouseLeave = _this.onMouseLeave.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(Tooltip, [{
key: "isTargetContentEmpty",
value: function isTargetContentEmpty(target) {
return !(this.props.content || this.getTargetOption(target, 'tooltip'));
}
}, {
key: "isContentEmpty",
value: function isContentEmpty(target) {
return !(this.props.content || this.getTargetOption(target, 'tooltip') || this.props.children);
}
}, {
key: "isMouseTrack",
value: function isMouseTrack(target) {
return this.getTargetOption(target, 'mousetrack') || this.props.mouseTrack;
}
}, {
key: "isDisabled",
value: function isDisabled(target) {
return this.getTargetOption(target, 'disabled') === 'true' || this.hasTargetOption(target, 'disabled') || this.props.disabled;
}
}, {
key: "isShowOnDisabled",
value: function isShowOnDisabled(target) {
return this.getTargetOption(target, 'showondisabled') || this.props.showOnDisabled;
}
}, {
key: "isAutoHide",
value: function isAutoHide() {
return this.getTargetOption(this.currentTarget, 'autohide') || this.props.autoHide;
}
}, {
key: "getTargetOption",
value: function getTargetOption(target, option) {
if (this.hasTargetOption(target, "data-pr-".concat(option))) {
return target.getAttribute("data-pr-".concat(option));
}
return null;
}
}, {
key: "hasTargetOption",
value: function hasTargetOption(target, option) {
return target && target.hasAttribute(option);
}
}, {
key: "getEvents",
value: function getEvents(target) {
var showEvent = this.getTargetOption(target, 'showevent') || this.props.showEvent;
var hideEvent = this.getTargetOption(target, 'hideevent') || this.props.hideEvent;
if (this.isMouseTrack(target)) {
showEvent = 'mousemove';
hideEvent = 'mouseleave';
} else {
var event = this.getTargetOption(target, 'event') || this.props.event;
if (event === 'focus') {
showEvent = 'focus';
hideEvent = 'blur';
}
}
return {
showEvent: showEvent,
hideEvent: hideEvent
};
}
}, {
key: "getPosition",
value: function getPosition(target) {
return this.getTargetOption(target, 'position') || this.state.position;
}
}, {
key: "getMouseTrackPosition",
value: function getMouseTrackPosition(target) {
var top = this.getTargetOption(target, 'mousetracktop') || this.props.mouseTrackTop;
var left = this.getTargetOption(target, 'mousetrackleft') || this.props.mouseTrackLeft;
return {
top: top,
left: left
};
}
}, {
key: "updateText",
value: function updateText(target, callback) {
if (this.tooltipTextEl) {
var content = this.getTargetOption(target, 'tooltip') || this.props.content;
if (content) {
this.tooltipTextEl.innerHTML = ''; // remove children
this.tooltipTextEl.appendChild(document.createTextNode(content));
callback();
} else if (this.props.children) {
callback();
}
}
}
}, {
key: "show",
value: function show(e) {
var _this2 = this;
this.currentTarget = e.currentTarget;
var disabled = this.isDisabled(this.currentTarget);
var empty = this.isContentEmpty(this.isShowOnDisabled(this.currentTarget) && disabled ? this.currentTarget.firstChild : this.currentTarget);
if (empty || disabled) {
return;
}
var updateTooltipState = function updateTooltipState() {
_this2.updateText(_this2.currentTarget, function () {
if (_this2.props.autoZIndex && !ZIndexUtils.get(_this2.containerEl)) {
ZIndexUtils.set('tooltip', _this2.containerEl, PrimeReact.autoZIndex, _this2.props.baseZIndex || PrimeReact.zIndex['tooltip']);
}
_this2.containerEl.style.left = '';
_this2.containerEl.style.top = '';
if (_this2.isMouseTrack(_this2.currentTarget) && !_this2.containerSize) {
_this2.containerSize = {
width: DomHandler.getOuterWidth(_this2.containerEl),
height: DomHandler.getOuterHeight(_this2.containerEl)
};
}
_this2.align(_this2.currentTarget, {
x: e.pageX,
y: e.pageY
});
});
};
if (this.state.visible) {
this.applyDelay('updateDelay', updateTooltipState);
} else {
this.sendCallback(this.props.onBeforeShow, {
originalEvent: e,
target: this.currentTarget
});
this.applyDelay('showDelay', function () {
_this2.setState({
visible: true,
position: _this2.getPosition(_this2.currentTarget)
}, function () {
updateTooltipState();
_this2.sendCallback(_this2.props.onShow, {
originalEvent: e,
target: _this2.currentTarget
});
});
_this2.bindDocumentResizeListener();
_this2.bindScrollListener();
DomHandler.addClass(_this2.currentTarget, _this2.getTargetOption(_this2.currentTarget, 'classname'));
});
}
}
}, {
key: "hide",
value: function hide(e) {
var _this3 = this;
this.clearTimeouts();
if (this.state.visible) {
DomHandler.removeClass(this.currentTarget, this.getTargetOption(this.currentTarget, 'classname'));
this.sendCallback(this.props.onBeforeHide, {
originalEvent: e,
target: this.currentTarget
});
this.applyDelay('hideDelay', function () {
ZIndexUtils.clear(_this3.containerEl);
DomHandler.removeClass(_this3.containerEl, 'p-tooltip-active');
if (!_this3.isAutoHide() && _this3.allowHide === false) {
return;
}
_this3.setState({
visible: false,
position: _this3.props.position
}, function () {
if (_this3.tooltipTextEl) {
ReactDOM__default["default"].unmountComponentAtNode(_this3.tooltipTextEl);
}
_this3.unbindDocumentResizeListener();
_this3.unbindScrollListener();
_this3.currentTarget = null;
_this3.scrollHandler = null;
_this3.containerSize = null;
_this3.allowHide = true;
_this3.sendCallback(_this3.props.onHide, {
originalEvent: e,
target: _this3.currentTarget
});
});
});
}
}
}, {
key: "align",
value: function align(target, coordinate) {
var _this4 = this;
var left = 0,
top = 0;
if (this.isMouseTrack(target) && coordinate) {
var containerSize = {
width: DomHandler.getOuterWidth(this.containerEl),
height: DomHandler.getOuterHeight(this.containerEl)
};
left = coordinate.x;
top = coordinate.y;
var _this$getMouseTrackPo = this.getMouseTrackPosition(target),
mouseTrackTop = _this$getMouseTrackPo.top,
mouseTrackLeft = _this$getMouseTrackPo.left;
switch (this.state.position) {
case 'left':
left -= containerSize.width + mouseTrackLeft;
top -= containerSize.height / 2 - mouseTrackTop;
break;
case 'right':
left += mouseTrackLeft;
top -= containerSize.height / 2 - mouseTrackTop;
break;
case 'top':
left -= containerSize.width / 2 - mouseTrackLeft;
top -= containerSize.height + mouseTrackTop;
break;
case 'bottom':
left -= containerSize.width / 2 - mouseTrackLeft;
top += mouseTrackTop;
break;
}
if (left <= 0 || this.containerSize.width > containerSize.width) {
this.containerEl.style.left = '0px';
this.containerEl.style.right = window.innerWidth - containerSize.width - left + 'px';
} else {
this.containerEl.style.right = '';
this.containerEl.style.left = left + 'px';
}
this.containerEl.style.top = top + 'px';
DomHandler.addClass(this.containerEl, 'p-tooltip-active');
} else {
var pos = DomHandler.findCollisionPosition(this.state.position);
var my = this.getTargetOption(target, 'my') || this.props.my || pos.my;
var at = this.getTargetOption(target, 'at') || this.props.at || pos.at;
this.containerEl.style.padding = '0px';
DomHandler.flipfitCollision(this.containerEl, target, my, at, function (currentPosition) {
var _currentPosition$at = currentPosition.at,
atX = _currentPosition$at.x,
atY = _currentPosition$at.y;
var myX = currentPosition.my.x;
var position = _this4.props.at ? atX !== 'center' && atX !== myX ? atX : atY : currentPosition.at["".concat(pos.axis)];
_this4.containerEl.style.padding = '';
_this4.setState({
position: position
}, function () {
_this4.updateContainerPosition();
DomHandler.addClass(_this4.containerEl, 'p-tooltip-active');
});
});
}
}
}, {
key: "updateContainerPosition",
value: function updateContainerPosition() {
if (this.containerEl) {
var style = getComputedStyle(this.containerEl);
if (this.state.position === 'left') this.containerEl.style.left = parseFloat(style.left) - parseFloat(style.paddingLeft) * 2 + 'px';else if (this.state.position === 'top') this.containerEl.style.top = parseFloat(style.top) - parseFloat(style.paddingTop) * 2 + 'px';
}
}
}, {
key: "onMouseEnter",
value: function onMouseEnter() {
if (!this.isAutoHide()) {
this.allowHide = false;
}
}
}, {
key: "onMouseLeave",
value: function onMouseLeave(e) {
if (!this.isAutoHide()) {
this.allowHide = true;
this.hide(e);
}
}
}, {
key: "bindDocumentResizeListener",
value: function bindDocumentResizeListener() {
var _this5 = this;
this.documentResizeListener = function (e) {
if (!DomHandler.isTouchDevice()) {
_this5.hide(e);
}
};
window.addEventListener('resize', this.documentResizeListener);
}
}, {
key: "unbindDocumentResizeListener",
value: function unbindDocumentResizeListener() {
if (this.documentResizeListener) {
window.removeEventListener('resize', this.documentResizeListener);
this.documentResizeListener = null;
}
}
}, {
key: "bindScrollListener",
value: function bindScrollListener() {
var _this6 = this;
if (!this.scrollHandler) {
this.scrollHandler = new ConnectedOverlayScrollHandler(this.currentTarget, function (e) {
if (_this6.state.visible) {
_this6.hide(e);
}
});
}
this.scrollHandler.bindScrollListener();
}
}, {
key: "unbindScrollListener",
value: function unbindScrollListener() {
if (this.scrollHandler) {
this.scrollHandler.unbindScrollListener();
}
}
}, {
key: "bindTargetEvent",
value: function bindTargetEvent(target) {
if (target) {
var _this$getEvents = this.getEvents(target),
showEvent = _this$getEvents.showEvent,
hideEvent = _this$getEvents.hideEvent;
var currentTarget = this.getTarget(target);
currentTarget.addEventListener(showEvent, this.show);
currentTarget.addEventListener(hideEvent, this.hide);
}
}
}, {
key: "unbindTargetEvent",
value: function unbindTargetEvent(target) {
if (target) {
var _this$getEvents2 = this.getEvents(target),
showEvent = _this$getEvents2.showEvent,
hideEvent = _this$getEvents2.hideEvent;
var currentTarget = this.getTarget(target);
currentTarget.removeEventListener(showEvent, this.show);
currentTarget.removeEventListener(hideEvent, this.hide);
}
}
}, {
key: "applyDelay",
value: function applyDelay(delayProp, callback) {
this.clearTimeouts();
var delay = this.getTargetOption(this.currentTarget, delayProp.toLowerCase()) || this.props[delayProp];
if (!!delay) {
this["".concat(delayProp, "Timeout")] = setTimeout(function () {
return callback();
}, delay);
} else {
callback();
}
}
}, {
key: "sendCallback",
value: function sendCallback(callback) {
if (callback) {
for (var _len = arguments.length, params = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
params[_key - 1] = arguments[_key];
}
callback.apply(void 0, params);
}
}
}, {
key: "clearTimeouts",
value: function clearTimeouts() {
clearTimeout(this.showDelayTimeout);
clearTimeout(this.updateDelayTimeout);
clearTimeout(this.hideDelayTimeout);
}
}, {
key: "getTarget",
value: function getTarget(target) {
if (target) {
if (this.isShowOnDisabled(target)) {
var wrapper = document.createElement('span');
target.parentNode.insertBefore(wrapper, target);
wrapper.appendChild(target);
return wrapper;
}
return target;
}
return null;
}
}, {
key: "updateTargetEvents",
value: function updateTargetEvents(target) {
this.unloadTargetEvents(target);
this.loadTargetEvents(target);
}
}, {
key: "loadTargetEvents",
value: function loadTargetEvents(target) {
this.setTargetEventOperations(target || this.props.target, 'bindTargetEvent');
}
}, {
key: "unloadTargetEvents",
value: function unloadTargetEvents(target) {
this.setTargetEventOperations(target || this.props.target, 'unbindTargetEvent');
}
}, {
key: "setTargetEventOperations",
value: function setTargetEventOperations(target, operation) {
var _this7 = this;
if (target) {
if (DomHandler.isElement(target)) {
this[operation](target);
} else {
var setEvent = function setEvent(target) {
var element = DomHandler.find(document, target);
element.forEach(function (el) {
_this7[operation](el);
});
};
if (target instanceof Array) {
target.forEach(function (t) {
setEvent(t);
});
} else {
setEvent(target);
}
}
}
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
if (this.props.target) {
this.loadTargetEvents();
}
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps, prevState) {
var _this8 = this;
if (prevProps.target !== this.props.target) {
this.unloadTargetEvents(prevProps.target);
this.loadTargetEvents();
}
if (this.state.visible) {
if (prevProps.content !== this.props.content) {
this.applyDelay('updateDelay', function () {
_this8.updateText(_this8.currentTarget, function () {
_this8.align(_this8.currentTarget);
});
});
}
if (this.currentTarget && this.isDisabled(this.currentTarget)) {
this.hide();
}
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
this.clearTimeouts();
this.unbindDocumentResizeListener();
this.unloadTargetEvents();
if (this.scrollHandler) {
this.scrollHandler.destroy();
this.scrollHandler = null;
}
ZIndexUtils.clear(this.containerEl);
}
}, {
key: "renderElement",
value: function renderElement() {
var _this9 = this;
var tooltipClassName = classNames('p-tooltip p-component', _defineProperty({}, "p-tooltip-".concat(this.state.position), true), this.props.className);
var isTargetContentEmpty = this.isTargetContentEmpty(this.currentTarget);
return /*#__PURE__*/React__default["default"].createElement("div", {
id: this.props.id,
ref: function ref(el) {
return _this9.containerEl = el;
},
className: tooltipClassName,
style: this.props.style,
role: "tooltip",
"aria-hidden": this.state.visible,
onMouseEnter: this.onMouseEnter,
onMouseLeave: this.onMouseLeave
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-tooltip-arrow"
}), /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this9.tooltipTextEl = el;
},
className: "p-tooltip-text"
}, isTargetContentEmpty && this.props.children));
}
}, {
key: "render",
value: function render() {
if (this.state.visible) {
var element = this.renderElement();
return /*#__PURE__*/React__default["default"].createElement(Portal, {
element: element,
appendTo: this.props.appendTo,
visible: true
});
}
return null;
}
}]);
return Tooltip;
}(React.Component);
_defineProperty(Tooltip, "defaultProps", {
id: null,
target: null,
content: null,
disabled: false,
className: null,
style: null,
appendTo: null,
position: 'right',
my: null,
at: null,
event: null,
showEvent: 'mouseenter',
hideEvent: 'mouseleave',
autoZIndex: true,
baseZIndex: 0,
mouseTrack: false,
mouseTrackTop: 5,
mouseTrackLeft: 5,
showDelay: 0,
updateDelay: 0,
hideDelay: 0,
autoHide: true,
showOnDisabled: false,
onBeforeShow: null,
onBeforeHide: null,
onShow: null,
onHide: null
});
function ownKeys$P(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$P(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$P(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$P(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createSuper$2h(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$2h(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$2h() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var InputTextComponent = /*#__PURE__*/function (_Component) {
_inherits(InputTextComponent, _Component);
var _super = _createSuper$2h(InputTextComponent);
function InputTextComponent(props) {
var _this;
_classCallCheck(this, InputTextComponent);
_this = _super.call(this, props);
_this.onInput = _this.onInput.bind(_assertThisInitialized(_this));
_this.onKeyPress = _this.onKeyPress.bind(_assertThisInitialized(_this));
_this.elementRef = /*#__PURE__*/React.createRef(_this.props.forwardRef);
return _this;
}
_createClass(InputTextComponent, [{
key: "isFilled",
value: function isFilled() {
return this.props.value != null && this.props.value.toString().length > 0 || this.props.defaultValue != null && this.props.defaultValue.toString().length > 0 || this.elementRef && this.elementRef.current && this.elementRef.current.value != null && this.elementRef.current.value.toString().length > 0;
}
}, {
key: "onKeyPress",
value: function onKeyPress(event) {
if (this.props.onKeyPress) {
this.props.onKeyPress(event);
}
if (this.props.keyfilter) {
KeyFilter.onKeyPress(event, this.props.keyfilter, this.props.validateOnly);
}
}
}, {
key: "onInput",
value: function onInput(event) {
var validatePattern = true;
if (this.props.keyfilter && this.props.validateOnly) {
validatePattern = KeyFilter.validate(event, this.props.keyfilter);
}
if (this.props.onInput) {
this.props.onInput(event, validatePattern);
}
if (!this.props.onChange) {
if (event.target.value.length > 0) DomHandler.addClass(event.target, 'p-filled');else DomHandler.removeClass(event.target, 'p-filled');
}
}
}, {
key: "updateForwardRef",
value: function updateForwardRef() {
var ref = this.props.forwardRef;
if (ref) {
if (typeof ref === 'function') {
ref(this.elementRef.current);
} else {
ref.current = this.elementRef.current;
}
}
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
this.updateForwardRef();
if (this.props.tooltip) {
this.renderTooltip();
}
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps) {
if (prevProps.tooltip !== this.props.tooltip || prevProps.tooltipOptions !== this.props.tooltipOptions) {
if (this.tooltip) this.tooltip.update(_objectSpread$P({
content: this.props.tooltip
}, this.props.tooltipOptions || {}));else this.renderTooltip();
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
if (this.tooltip) {
this.tooltip.destroy();
this.tooltip = null;
}
}
}, {
key: "renderTooltip",
value: function renderTooltip() {
this.tooltip = tip({
target: this.elementRef.current,
content: this.props.tooltip,
options: this.props.tooltipOptions
});
}
}, {
key: "render",
value: function render() {
var className = classNames('p-inputtext p-component', {
'p-disabled': this.props.disabled,
'p-filled': this.isFilled()
}, this.props.className);
var inputProps = ObjectUtils.findDiffKeys(this.props, InputTextComponent.defaultProps);
return /*#__PURE__*/React__default["default"].createElement("input", _extends({
ref: this.elementRef
}, inputProps, {
className: className,
onInput: this.onInput,
onKeyPress: this.onKeyPress
}));
}
}]);
return InputTextComponent;
}(React.Component);
_defineProperty(InputTextComponent, "defaultProps", {
keyfilter: null,
validateOnly: false,
tooltip: null,
tooltipOptions: null,
onInput: null,
onKeyPress: null,
forwardRef: null
});
var InputText = /*#__PURE__*/React__default["default"].forwardRef(function (props, ref) {
return /*#__PURE__*/React__default["default"].createElement(InputTextComponent, _extends({
forwardRef: ref
}, props));
});
function _createSuper$2g(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$2g(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$2g() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var Ripple = /*#__PURE__*/function (_Component) {
_inherits(Ripple, _Component);
var _super = _createSuper$2g(Ripple);
function Ripple(props) {
var _this;
_classCallCheck(this, Ripple);
_this = _super.call(this, props);
_this.onMouseDown = _this.onMouseDown.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(Ripple, [{
key: "getTarget",
value: function getTarget() {
return this.ink && this.ink.parentElement;
}
}, {
key: "bindEvents",
value: function bindEvents() {
if (this.target) {
this.target.addEventListener('mousedown', this.onMouseDown);
}
}
}, {
key: "unbindEvents",
value: function unbindEvents() {
if (this.target) {
this.target.removeEventListener('mousedown', this.onMouseDown);
}
}
}, {
key: "onMouseDown",
value: function onMouseDown(event) {
if (!this.ink || getComputedStyle(this.ink, null).display === 'none') {
return;
}
DomHandler.removeClass(this.ink, 'p-ink-active');
if (!DomHandler.getHeight(this.ink) && !DomHandler.getWidth(this.ink)) {
var d = Math.max(DomHandler.getOuterWidth(this.target), DomHandler.getOuterHeight(this.target));
this.ink.style.height = d + 'px';
this.ink.style.width = d + 'px';
}
var offset = DomHandler.getOffset(this.target);
var x = event.pageX - offset.left + document.body.scrollTop - DomHandler.getWidth(this.ink) / 2;
var y = event.pageY - offset.top + document.body.scrollLeft - DomHandler.getHeight(this.ink) / 2;
this.ink.style.top = y + 'px';
this.ink.style.left = x + 'px';
DomHandler.addClass(this.ink, 'p-ink-active');
}
}, {
key: "onAnimationEnd",
value: function onAnimationEnd(event) {
DomHandler.removeClass(event.currentTarget, 'p-ink-active');
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
if (this.ink) {
this.target = this.getTarget();
this.bindEvents();
}
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate() {
if (this.ink && !this.target) {
this.target = this.getTarget();
this.bindEvents();
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
if (this.ink) {
this.target = null;
this.unbindEvents();
}
}
}, {
key: "render",
value: function render() {
var _this2 = this;
return PrimeReact.ripple ? /*#__PURE__*/React__default["default"].createElement("span", {
ref: function ref(el) {
return _this2.ink = el;
},
className: "p-ink",
onAnimationEnd: this.onAnimationEnd
}) : null;
}
}]);
return Ripple;
}(React.Component);
function ownKeys$O(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$O(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$O(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$O(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createSuper$2f(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$2f(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$2f() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var ButtonComponent = /*#__PURE__*/function (_Component) {
_inherits(ButtonComponent, _Component);
var _super = _createSuper$2f(ButtonComponent);
function ButtonComponent(props) {
var _this;
_classCallCheck(this, ButtonComponent);
_this = _super.call(this, props);
_this.elementRef = /*#__PURE__*/React.createRef(_this.props.forwardRef);
return _this;
}
_createClass(ButtonComponent, [{
key: "updateForwardRef",
value: function updateForwardRef() {
var ref = this.props.forwardRef;
if (ref) {
if (typeof ref === 'function') {
ref(this.elementRef.current);
} else {
ref.current = this.elementRef.current;
}
}
}
}, {
key: "isDisabled",
value: function isDisabled() {
return this.props.disabled || this.props.loading;
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
this.updateForwardRef();
if (this.props.tooltip) {
this.renderTooltip();
}
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps) {
if (prevProps.tooltip !== this.props.tooltip || prevProps.tooltipOptions !== this.props.tooltipOptions) {
if (this.tooltip) this.tooltip.update(_objectSpread$O({
content: this.props.tooltip
}, this.props.tooltipOptions || {}));else this.renderTooltip();
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
if (this.tooltip) {
this.tooltip.destroy();
this.tooltip = null;
}
}
}, {
key: "renderTooltip",
value: function renderTooltip() {
this.tooltip = tip({
target: this.elementRef.current,
content: this.props.tooltip,
options: this.props.tooltipOptions
});
}
}, {
key: "renderIcon",
value: function renderIcon() {
var icon = this.props.loading ? this.props.loadingIcon : this.props.icon;
var className = classNames('p-button-icon p-c', {
'p-button-loading-icon': this.props.loading,
'p-button-icon-left': this.props.iconPos === 'left' && this.props.label,
'p-button-icon-right': this.props.iconPos === 'right' && this.props.label,
'p-button-icon-top': this.props.iconPos === 'top' && this.props.label,
'p-button-icon-bottom': this.props.iconPos === 'bottom' && this.props.label
});
return IconUtils.getJSXIcon(icon, {
className: className
}, {
props: this.props
});
}
}, {
key: "renderLabel",
value: function renderLabel() {
if (this.props.label) {
return /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-button-label p-c"
}, this.props.label);
}
return !this.props.children && !this.props.label && /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-button-label p-c",
dangerouslySetInnerHTML: {
__html: " "
}
});
}
}, {
key: "renderBadge",
value: function renderBadge() {
if (this.props.badge) {
var badgeClassName = classNames('p-badge', this.props.badgeClassName);
return /*#__PURE__*/React__default["default"].createElement("span", {
className: badgeClassName
}, this.props.badge);
}
return null;
}
}, {
key: "render",
value: function render() {
var disabled = this.isDisabled();
var className = classNames('p-button p-component', this.props.className, _defineProperty({
'p-button-icon-only': (this.props.icon || this.props.loading && this.props.loadingIcon) && !this.props.label,
'p-button-vertical': (this.props.iconPos === 'top' || this.props.iconPos === 'bottom') && this.props.label,
'p-disabled': disabled,
'p-button-loading': this.props.loading,
'p-button-loading-label-only': this.props.loading && !this.props.icon && this.props.label
}, "p-button-loading-".concat(this.props.iconPos), this.props.loading && this.props.loadingIcon && this.props.label));
var icon = this.renderIcon();
var label = this.renderLabel();
var badge = this.renderBadge();
var buttonProps = ObjectUtils.findDiffKeys(this.props, ButtonComponent.defaultProps);
return /*#__PURE__*/React__default["default"].createElement("button", _extends({
ref: this.elementRef
}, buttonProps, {
className: className,
disabled: disabled
}), icon, label, this.props.children, badge, /*#__PURE__*/React__default["default"].createElement(Ripple, null));
}
}]);
return ButtonComponent;
}(React.Component);
_defineProperty(ButtonComponent, "defaultProps", {
label: null,
icon: null,
iconPos: 'left',
badge: null,
badgeClassName: null,
tooltip: null,
tooltipOptions: null,
forwardRef: null,
disabled: false,
loading: false,
loadingIcon: 'pi pi-spinner pi-spin'
});
var Button = /*#__PURE__*/React__default["default"].forwardRef(function (props, ref) {
return /*#__PURE__*/React__default["default"].createElement(ButtonComponent, _extends({
forwardRef: ref
}, props));
});
function ownKeys$N(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$N(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$N(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$N(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createSuper$2e(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$2e(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$2e() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var VirtualScroller = /*#__PURE__*/function (_Component) {
_inherits(VirtualScroller, _Component);
var _super = _createSuper$2e(VirtualScroller);
function VirtualScroller(props) {
var _this;
_classCallCheck(this, VirtualScroller);
_this = _super.call(this, props);
var isBoth = _this.isBoth();
_this.state = {
first: isBoth ? {
rows: 0,
cols: 0
} : 0,
last: isBoth ? {
rows: 0,
cols: 0
} : 0,
numItemsInViewport: isBoth ? {
rows: 0,
cols: 0
} : 0,
numToleratedItems: props.numToleratedItems,
loading: props.loading,
loaderArr: []
};
_this.onScroll = _this.onScroll.bind(_assertThisInitialized(_this));
_this.lastScrollPos = isBoth ? {
top: 0,
left: 0
} : 0;
return _this;
}
_createClass(VirtualScroller, [{
key: "scrollTo",
value: function scrollTo(options) {
this.el && this.el.scrollTo(options);
}
}, {
key: "scrollToIndex",
value: function scrollToIndex(index) {
var _this2 = this;
var behavior = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'auto';
var isBoth = this.isBoth();
var isHorizontal = this.isHorizontal();
var first = this.state.first;
var _this$calculateNumIte = this.calculateNumItems(),
numToleratedItems = _this$calculateNumIte.numToleratedItems;
var itemSize = this.props.itemSize;
var contentPos = this.getContentPosition();
var calculateFirst = function calculateFirst() {
var _index = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
var _numT = arguments.length > 1 ? arguments[1] : undefined;
return _index <= _numT ? 0 : _index;
};
var calculateCoord = function calculateCoord(_first, _size, _cpos) {
return _first * _size + _cpos;
};
var scrollTo = function scrollTo() {
var left = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
var top = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
return _this2.scrollTo({
left: left,
top: top,
behavior: behavior
});
};
if (isBoth) {
var newFirst = {
rows: calculateFirst(index[0], numToleratedItems[0]),
cols: calculateFirst(index[1], numToleratedItems[1])
};
if (newFirst.rows !== first.rows || newFirst.cols !== first.cols) {
scrollTo(calculateCoord(newFirst.cols, itemSize[1], contentPos.left), calculateCoord(newFirst.rows, itemSize[0], contentPos.top));
this.setState({
first: newFirst
});
}
} else {
var _newFirst = calculateFirst(index, numToleratedItems);
if (_newFirst !== first) {
isHorizontal ? scrollTo(calculateCoord(_newFirst, itemSize, contentPos.left), 0) : scrollTo(0, calculateCoord(_newFirst, itemSize, contentPos.top));
this.setState({
first: _newFirst
});
}
}
}
}, {
key: "scrollInView",
value: function scrollInView(index, to) {
var _this3 = this;
var behavior = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'auto';
if (to) {
var isBoth = this.isBoth();
var isHorizontal = this.isHorizontal();
var _this$getRenderedRang = this.getRenderedRange(),
first = _this$getRenderedRang.first,
viewport = _this$getRenderedRang.viewport;
var itemSize = this.props.itemSize;
var scrollTo = function scrollTo() {
var left = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
var top = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
return _this3.scrollTo({
left: left,
top: top,
behavior: behavior
});
};
var isToStart = to === 'to-start';
var isToEnd = to === 'to-end';
if (isToStart) {
if (isBoth) {
if (viewport.first.rows - first.rows > index[0]) {
scrollTo(viewport.first.cols * itemSize, (viewport.first.rows - 1) * itemSize);
} else if (viewport.first.cols - first.cols > index[1]) {
scrollTo((viewport.first.cols - 1) * itemSize, viewport.first.rows * itemSize);
}
} else {
if (viewport.first - first > index) {
var pos = (viewport.first - 1) * itemSize;
isHorizontal ? scrollTo(pos, 0) : scrollTo(0, pos);
}
}
} else if (isToEnd) {
if (isBoth) {
if (viewport.last.rows - first.rows <= index[0] + 1) {
scrollTo(viewport.first.cols * itemSize, (viewport.first.rows + 1) * itemSize);
} else if (viewport.last.cols - first.cols <= index[1] + 1) {
scrollTo((viewport.first.cols + 1) * itemSize, viewport.first.rows * itemSize);
}
} else {
if (viewport.last - first <= index + 1) {
var _pos2 = (viewport.first + 1) * itemSize;
isHorizontal ? scrollTo(_pos2, 0) : scrollTo(0, _pos2);
}
}
}
} else {
this.scrollToIndex(index, behavior);
}
}
}, {
key: "getRows",
value: function getRows() {
return this.state.loading ? this.props.loaderDisabled ? this.state.loaderArr : [] : this.loadedItems();
}
}, {
key: "getColumns",
value: function getColumns() {
if (this.props.columns) {
var isBoth = this.isBoth();
var isHorizontal = this.isHorizontal();
if (isBoth || isHorizontal) {
return this.state.loading && this.props.loaderDisabled ? isBoth ? this.state.loaderArr[0] : this.state.loaderArr : this.props.columns.slice(isBoth ? this.state.first.cols : this.state.first, isBoth ? this.state.last.cols : this.state.last);
}
}
return this.props.columns;
}
}, {
key: "getRenderedRange",
value: function getRenderedRange() {
var isBoth = this.isBoth();
var isHorizontal = this.isHorizontal();
var _this$state = this.state,
first = _this$state.first,
last = _this$state.last,
numItemsInViewport = _this$state.numItemsInViewport;
var itemSize = this.props.itemSize;
var calculateFirstInViewport = function calculateFirstInViewport(_pos, _size) {
return Math.floor(_pos / (_size || _pos));
};
var firstInViewport = first;
var lastInViewport = 0;
if (this.el) {
var scrollTop = this.el.scrollTop;
var scrollLeft = this.el.scrollLeft;
if (isBoth) {
firstInViewport = {
rows: calculateFirstInViewport(scrollTop, itemSize[0]),
cols: calculateFirstInViewport(scrollLeft, itemSize[1])
};
lastInViewport = {
rows: firstInViewport.rows + numItemsInViewport.rows,
cols: firstInViewport.cols + numItemsInViewport.cols
};
} else {
var scrollPos = isHorizontal ? scrollLeft : scrollTop;
firstInViewport = calculateFirstInViewport(scrollPos, itemSize);
lastInViewport = firstInViewport + numItemsInViewport;
}
}
return {
first: first,
last: last,
viewport: {
first: firstInViewport,
last: lastInViewport
}
};
}
}, {
key: "isVertical",
value: function isVertical() {
return this.props.orientation === 'vertical';
}
}, {
key: "isHorizontal",
value: function isHorizontal() {
return this.props.orientation === 'horizontal';
}
}, {
key: "isBoth",
value: function isBoth() {
return this.props.orientation === 'both';
}
}, {
key: "calculateNumItems",
value: function calculateNumItems() {
var isBoth = this.isBoth();
var isHorizontal = this.isHorizontal();
var itemSize = this.props.itemSize;
var contentPos = this.getContentPosition();
var contentWidth = this.el ? this.el.offsetWidth - contentPos.left : 0;
var contentHeight = this.el ? this.el.offsetHeight - contentPos.top : 0;
var calculateNumItemsInViewport = function calculateNumItemsInViewport(_contentSize, _itemSize) {
return Math.ceil(_contentSize / (_itemSize || _contentSize));
};
var calculateNumToleratedItems = function calculateNumToleratedItems(_numItems) {
return Math.ceil(_numItems / 2);
};
var numItemsInViewport = isBoth ? {
rows: calculateNumItemsInViewport(contentHeight, itemSize[0]),
cols: calculateNumItemsInViewport(contentWidth, itemSize[1])
} : calculateNumItemsInViewport(isHorizontal ? contentWidth : contentHeight, itemSize);
var numToleratedItems = this.state.numToleratedItems || (isBoth ? [calculateNumToleratedItems(numItemsInViewport.rows), calculateNumToleratedItems(numItemsInViewport.cols)] : calculateNumToleratedItems(numItemsInViewport));
return {
numItemsInViewport: numItemsInViewport,
numToleratedItems: numToleratedItems
};
}
}, {
key: "calculateOptions",
value: function calculateOptions() {
var _this4 = this;
var isBoth = this.isBoth();
var first = this.state.first;
var _this$calculateNumIte2 = this.calculateNumItems(),
numItemsInViewport = _this$calculateNumIte2.numItemsInViewport,
numToleratedItems = _this$calculateNumIte2.numToleratedItems;
var calculateLast = function calculateLast(_first, _num, _numT, _isCols) {
return _this4.getLast(_first + _num + (_first < _numT ? 2 : 3) * _numT, _isCols);
};
var last = isBoth ? {
rows: calculateLast(first.rows, numItemsInViewport.rows, numToleratedItems[0]),
cols: calculateLast(first.cols, numItemsInViewport.cols, numToleratedItems[1], true)
} : calculateLast(first, numItemsInViewport, numToleratedItems);
var state = {
numItemsInViewport: numItemsInViewport,
last: last,
numToleratedItems: numToleratedItems
};
if (this.props.showLoader) {
state['loaderArr'] = isBoth ? Array.from({
length: numItemsInViewport.rows
}).map(function () {
return Array.from({
length: numItemsInViewport.cols
});
}) : Array.from({
length: numItemsInViewport
});
}
this.setState(state, function () {
if (_this4.props.lazy) {
_this4.props.onLazyLoad && _this4.props.onLazyLoad({
first: _this4.state.first,
last: _this4.state.last
});
}
});
}
}, {
key: "getLast",
value: function getLast() {
var last = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
var isCols = arguments.length > 1 ? arguments[1] : undefined;
if (this.props.items) {
return Math.min(isCols ? (this.props.columns || this.props.items[0]).length : this.props.items.length, last);
}
return 0;
}
}, {
key: "getContentPosition",
value: function getContentPosition() {
if (this.content) {
var style = getComputedStyle(this.content);
var left = parseInt(style.paddingLeft, 10) + Math.max(parseInt(style.left, 10), 0);
var right = parseInt(style.paddingRight, 10) + Math.max(parseInt(style.right, 10), 0);
var top = parseInt(style.paddingTop, 10) + Math.max(parseInt(style.top, 10), 0);
var bottom = parseInt(style.paddingBottom, 10) + Math.max(parseInt(style.bottom, 10), 0);
return {
left: left,
right: right,
top: top,
bottom: bottom,
x: left + right,
y: top + bottom
};
}
return {
left: 0,
right: 0,
top: 0,
bottom: 0,
x: 0,
y: 0
};
}
}, {
key: "setSize",
value: function setSize() {
var _this5 = this;
if (this.el) {
var isBoth = this.isBoth();
var isHorizontal = this.isHorizontal();
var parentElement = this.el.parentElement;
var width = this.props.scrollWidth || "".concat(this.el.offsetWidth || parentElement.offsetWidth, "px");
var height = this.props.scrollHeight || "".concat(this.el.offsetHeight || parentElement.offsetHeight, "px");
var setProp = function setProp(_name, _value) {
return _this5.el.style[_name] = _value;
};
if (isBoth || isHorizontal) {
setProp('height', height);
setProp('width', width);
} else {
setProp('height', height);
}
}
}
}, {
key: "setSpacerSize",
value: function setSpacerSize() {
var _this6 = this;
var items = this.props.items;
if (this.spacer && items) {
var isBoth = this.isBoth();
var isHorizontal = this.isHorizontal();
var itemSize = this.props.itemSize;
var contentPos = this.getContentPosition();
var setProp = function setProp(_name, _value, _size) {
var _cpos = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 0;
return _this6.spacer.style[_name] = (_value || []).length * _size + _cpos + 'px';
};
if (isBoth) {
setProp('height', items, itemSize[0], contentPos.y);
setProp('width', this.props.columns || items[1], itemSize[1], contentPos.x);
} else {
isHorizontal ? setProp('width', this.props.columns || items, itemSize, contentPos.x) : setProp('height', items, itemSize, contentPos.y);
}
}
}
}, {
key: "setContentPosition",
value: function setContentPosition(pos) {
var _this7 = this;
if (this.content) {
var isBoth = this.isBoth();
var isHorizontal = this.isHorizontal();
var first = pos ? pos.first : this.state.first;
var itemSize = this.props.itemSize;
var calculateTranslateVal = function calculateTranslateVal(_first, _size) {
return _first * _size;
};
var setTransform = function setTransform() {
var _x = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
var _y = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
_this7.sticky && (_this7.sticky.style.top = "-".concat(_y, "px"));
_this7.content.style.transform = "translate3d(".concat(_x, "px, ").concat(_y, "px, 0)");
};
if (isBoth) {
setTransform(calculateTranslateVal(first.cols, itemSize[1]), calculateTranslateVal(first.rows, itemSize[0]));
} else {
var translateVal = calculateTranslateVal(first, itemSize);
isHorizontal ? setTransform(translateVal, 0) : setTransform(0, translateVal);
}
}
}
}, {
key: "onScrollPositionChange",
value: function onScrollPositionChange(event) {
var _this8 = this;
var target = event.target;
var isBoth = this.isBoth();
var isHorizontal = this.isHorizontal();
var _this$state2 = this.state,
first = _this$state2.first,
last = _this$state2.last,
numItemsInViewport = _this$state2.numItemsInViewport,
numToleratedItems = _this$state2.numToleratedItems;
var itemSize = this.props.itemSize;
var contentPos = this.getContentPosition();
var calculateScrollPos = function calculateScrollPos(_pos, _cpos) {
return _pos ? _pos > _cpos ? _pos - _cpos : _pos : 0;
};
var calculateCurrentIndex = function calculateCurrentIndex(_pos, _size) {
return Math.floor(_pos / (_size || _pos));
};
var calculateTriggerIndex = function calculateTriggerIndex(_currentIndex, _first, _last, _num, _numT, _isScrollDownOrRight) {
return _currentIndex <= _numT ? _numT : _isScrollDownOrRight ? _last - _num - _numT : _first + _numT - 1;
};
var calculateFirst = function calculateFirst(_currentIndex, _triggerIndex, _first, _last, _num, _numT, _isScrollDownOrRight) {
if (_currentIndex <= _numT) return 0;else return Math.max(0, _isScrollDownOrRight ? _currentIndex < _triggerIndex ? _first : _currentIndex - _numT : _currentIndex > _triggerIndex ? _first : _currentIndex - 2 * _numT);
};
var calculateLast = function calculateLast(_currentIndex, _first, _last, _num, _numT, _isCols) {
var lastValue = _first + _num + 2 * _numT;
if (_currentIndex >= _numT) {
lastValue += _numT + 1;
}
return _this8.getLast(lastValue, _isCols);
};
var scrollTop = calculateScrollPos(target.scrollTop, contentPos.top);
var scrollLeft = calculateScrollPos(target.scrollLeft, contentPos.left);
var newFirst = 0;
var newLast = last;
var isRangeChanged = false;
if (isBoth) {
var isScrollDown = this.lastScrollPos.top <= scrollTop;
var isScrollRight = this.lastScrollPos.left <= scrollLeft;
var currentIndex = {
rows: calculateCurrentIndex(scrollTop, itemSize[0]),
cols: calculateCurrentIndex(scrollLeft, itemSize[1])
};
var triggerIndex = {
rows: calculateTriggerIndex(currentIndex.rows, first.rows, last.rows, numItemsInViewport.rows, numToleratedItems[0], isScrollDown),
cols: calculateTriggerIndex(currentIndex.cols, first.cols, last.cols, numItemsInViewport.cols, numToleratedItems[1], isScrollRight)
};
newFirst = {
rows: calculateFirst(currentIndex.rows, triggerIndex.rows, first.rows, last.rows, numItemsInViewport.rows, numToleratedItems[0], isScrollDown),
cols: calculateFirst(currentIndex.cols, triggerIndex.cols, first.cols, last.cols, numItemsInViewport.cols, numToleratedItems[1], isScrollRight)
};
newLast = {
rows: calculateLast(currentIndex.rows, newFirst.rows, last.rows, numItemsInViewport.rows, numToleratedItems[0]),
cols: calculateLast(currentIndex.cols, newFirst.cols, last.cols, numItemsInViewport.cols, numToleratedItems[1], true)
};
isRangeChanged = newFirst.rows !== first.rows && newLast.rows !== last.rows || newFirst.cols !== first.cols && newLast.cols !== last.cols;
this.lastScrollPos = {
top: scrollTop,
left: scrollLeft
};
} else {
var scrollPos = isHorizontal ? scrollLeft : scrollTop;
var isScrollDownOrRight = this.lastScrollPos <= scrollPos;
var _currentIndex2 = calculateCurrentIndex(scrollPos, itemSize);
var _triggerIndex2 = calculateTriggerIndex(_currentIndex2, first, last, numItemsInViewport, numToleratedItems, isScrollDownOrRight);
newFirst = calculateFirst(_currentIndex2, _triggerIndex2, first, last, numItemsInViewport, numToleratedItems, isScrollDownOrRight);
newLast = calculateLast(_currentIndex2, newFirst, last, numItemsInViewport, numToleratedItems);
isRangeChanged = newFirst !== first && newLast !== last;
this.lastScrollPos = scrollPos;
}
return {
first: newFirst,
last: newLast,
isRangeChanged: isRangeChanged
};
}
}, {
key: "onScrollChange",
value: function onScrollChange(event) {
var _this9 = this;
var _this$onScrollPositio = this.onScrollPositionChange(event),
first = _this$onScrollPositio.first,
last = _this$onScrollPositio.last,
isRangeChanged = _this$onScrollPositio.isRangeChanged;
if (isRangeChanged) {
var newState = {
first: first,
last: last
};
this.setContentPosition(newState);
this.setState(newState, function () {
_this9.props.onScrollIndexChange && _this9.props.onScrollIndexChange(newState);
if (_this9.props.lazy) {
_this9.props.onLazyLoad && _this9.props.onLazyLoad(newState);
}
});
}
}
}, {
key: "onScroll",
value: function onScroll(event) {
var _this10 = this;
this.props.onScroll && this.props.onScroll(event);
if (this.props.delay) {
if (this.scrollTimeout) {
clearTimeout(this.scrollTimeout);
}
if (!this.state.loading && this.props.showLoader) {
var _this$onScrollPositio2 = this.onScrollPositionChange(event),
changed = _this$onScrollPositio2.isRangeChanged;
changed && this.setState({
loading: true
});
}
this.scrollTimeout = setTimeout(function () {
_this10.onScrollChange(event);
if (_this10.state.loading && _this10.props.showLoader && !_this10.props.lazy) {
_this10.setState({
loading: false
});
}
}, this.props.delay);
} else {
this.onScrollChange(event);
}
}
}, {
key: "getOptions",
value: function getOptions(renderedIndex) {
var first = this.state.first;
var count = (this.props.items || []).length;
var index = this.isBoth() ? first.rows + renderedIndex : first + renderedIndex;
return {
index: index,
count: count,
first: index === 0,
last: index === count - 1,
even: index % 2 === 0,
odd: index % 2 !== 0,
props: this.props
};
}
}, {
key: "loaderOptions",
value: function loaderOptions(index, extOptions) {
var count = this.state.loaderArr.length;
return _objectSpread$N({
index: index,
count: count,
first: index === 0,
last: index === count - 1,
even: index % 2 === 0,
odd: index % 2 !== 0,
props: this.props
}, extOptions);
}
}, {
key: "loadedItems",
value: function loadedItems() {
var _this11 = this;
var items = this.props.items;
if (items && !this.state.loading) {
var isBoth = this.isBoth();
var isHorizontal = this.isHorizontal();
var _this$state3 = this.state,
first = _this$state3.first,
last = _this$state3.last;
if (isBoth) return items.slice(first.rows, last.rows).map(function (item) {
return _this11.props.columns ? item : item.slice(first.cols, last.cols);
});else if (isHorizontal && this.props.columns) return items;else return items.slice(first, last);
}
return [];
}
}, {
key: "isPropChanged",
value: function isPropChanged(prevProps) {
var _this12 = this;
var props = ['itemSize', 'scrollHeight'];
return props.some(function (p) {
return !ObjectUtils.equals(prevProps[p], _this12.props[p]);
});
}
}, {
key: "init",
value: function init() {
this.setSize();
this.calculateOptions();
this.setSpacerSize();
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
this.init();
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps, prevState) {
if (!prevProps.items || prevProps.items.length !== (this.props.items || []).length || this.isPropChanged(prevProps)) {
this.init();
}
if (this.props.lazy && prevProps.loading !== this.props.loading && this.state.loading !== this.props.loading) {
this.setState({
loading: this.props.loading
});
}
if (prevProps.orientation !== this.props.orientation) {
this.lastScrollPos = this.isBoth() ? {
top: 0,
left: 0
} : 0;
}
}
}, {
key: "renderLoaderItem",
value: function renderLoaderItem(index) {
var extOptions = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
var options = this.loaderOptions(index, extOptions);
var content = ObjectUtils.getJSXElement(this.props.loadingTemplate, options);
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, {
key: index
}, content);
}
}, {
key: "renderLoader",
value: function renderLoader() {
var _this13 = this;
if (!this.props.loaderDisabled && this.props.showLoader && this.state.loading) {
var className = classNames('p-virtualscroller-loader', {
'p-component-overlay': !this.props.loadingTemplate
});
var content = /*#__PURE__*/React__default["default"].createElement("i", {
className: "p-virtualscroller-loading-icon pi pi-spinner pi-spin"
});
if (this.props.loadingTemplate) {
var isBoth = this.isBoth();
var numItemsInViewport = this.state.numItemsInViewport;
content = this.state.loaderArr.map(function (_, index) {
return _this13.renderLoaderItem(index, isBoth && {
numCols: numItemsInViewport.cols
});
});
}
return /*#__PURE__*/React__default["default"].createElement("div", {
className: className
}, content);
}
return null;
}
}, {
key: "renderSpacer",
value: function renderSpacer() {
var _this14 = this;
if (this.props.showSpacer) {
return /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this14.spacer = el;
},
className: "p-virtualscroller-spacer"
});
}
return null;
}
}, {
key: "renderItem",
value: function renderItem(item, index) {
var options = this.getOptions(index);
var content = ObjectUtils.getJSXElement(this.props.itemTemplate, item, options);
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, {
key: options.index
}, content);
}
}, {
key: "renderItems",
value: function renderItems(loadedItems) {
var _this15 = this;
return loadedItems.map(function (item, index) {
return _this15.renderItem(item, index);
});
}
}, {
key: "renderContent",
value: function renderContent() {
var _this16 = this;
var loadedItems = this.loadedItems();
var items = this.renderItems(loadedItems);
var className = classNames('p-virtualscroller-content', {
'p-virtualscroller-loading': this.state.loading
});
var content = /*#__PURE__*/React__default["default"].createElement("div", {
className: className,
ref: function ref(el) {
return _this16.content = el;
}
}, items);
if (this.props.contentTemplate) {
var defaultOptions = {
className: className,
contentRef: function contentRef(el) {
return _this16.content = el;
},
spacerRef: function spacerRef(el) {
return _this16.spacer = el;
},
stickyRef: function stickyRef(el) {
return _this16.sticky = el;
},
items: loadedItems,
getItemOptions: function getItemOptions(index) {
return _this16.getOptions(index);
},
children: items,
element: content,
props: this.props,
loading: this.state.loading,
getLoaderOptions: function getLoaderOptions(index, ext) {
return _this16.loaderOptions(index, ext);
},
loadingTemplate: this.props.loadingTemplate,
itemSize: this.props.itemSize,
rows: this.getRows(),
columns: this.getColumns(),
vertical: this.isVertical(),
horizontal: this.isHorizontal(),
both: this.isBoth()
};
return ObjectUtils.getJSXElement(this.props.contentTemplate, defaultOptions);
}
return content;
}
}, {
key: "render",
value: function render() {
var _this17 = this;
if (this.props.disabled) {
var content = ObjectUtils.getJSXElement(this.props.contentTemplate, {
items: this.props.items,
rows: this.props.items,
columns: this.props.columns
});
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, this.props.children, content);
} else {
var isBoth = this.isBoth();
var isHorizontal = this.isHorizontal();
var className = classNames('p-virtualscroller', {
'p-both-scroll': isBoth,
'p-horizontal-scroll': isHorizontal
}, this.props.className);
var loader = this.renderLoader();
var _content = this.renderContent();
var spacer = this.renderSpacer();
return /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this17.el = el;
},
className: className,
tabIndex: 0,
style: this.props.style,
onScroll: this.onScroll
}, _content, spacer, loader);
}
}
}]);
return VirtualScroller;
}(React.Component);
_defineProperty(VirtualScroller, "defaultProps", {
id: null,
style: null,
className: null,
items: null,
itemSize: 0,
scrollHeight: null,
scrollWidth: null,
orientation: 'vertical',
numToleratedItems: null,
delay: 0,
lazy: false,
disabled: false,
loaderDisabled: false,
columns: null,
loading: false,
showSpacer: true,
showLoader: false,
loadingTemplate: null,
itemTemplate: null,
contentTemplate: null,
onScroll: null,
onScrollIndexChange: null,
onLazyLoad: null
});
function ownKeys$M(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$M(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$M(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$M(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createSuper$2d(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$2d(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$2d() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var AutoCompletePanelComponent = /*#__PURE__*/function (_Component) {
_inherits(AutoCompletePanelComponent, _Component);
var _super = _createSuper$2d(AutoCompletePanelComponent);
function AutoCompletePanelComponent() {
_classCallCheck(this, AutoCompletePanelComponent);
return _super.apply(this, arguments);
}
_createClass(AutoCompletePanelComponent, [{
key: "getOptionGroupRenderKey",
value: function getOptionGroupRenderKey(optionGroup) {
return ObjectUtils.resolveFieldData(optionGroup, this.props.optionGroupLabel);
}
}, {
key: "renderGroupChildren",
value: function renderGroupChildren(optionGroup, i) {
var _this = this;
var groupChildren = this.props.getOptionGroupChildren(optionGroup);
return groupChildren.map(function (item, j) {
var itemContent = _this.props.itemTemplate ? ObjectUtils.getJSXElement(_this.props.itemTemplate, item, j) : _this.props.field ? ObjectUtils.resolveFieldData(item, _this.props.field) : item;
return /*#__PURE__*/React__default["default"].createElement("li", {
key: j + '_item',
role: "option",
"aria-selected": _this.props.ariaSelected === item,
className: "p-autocomplete-item",
onClick: function onClick(e) {
return _this.props.onItemClick(e, item);
},
"data-group": i,
"data-index": j
}, itemContent, /*#__PURE__*/React__default["default"].createElement(Ripple, null));
});
}
}, {
key: "renderItem",
value: function renderItem(suggestion, index) {
var _this2 = this;
if (this.props.optionGroupLabel) {
var groupContent = this.props.optionGroupTemplate ? ObjectUtils.getJSXElement(this.props.optionGroupTemplate, suggestion, index) : this.props.getOptionGroupLabel(suggestion);
var groupChildrenContent = this.renderGroupChildren(suggestion, index);
var key = index + '_' + this.getOptionGroupRenderKey(suggestion);
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, {
key: key
}, /*#__PURE__*/React__default["default"].createElement("li", {
className: "p-autocomplete-item-group"
}, groupContent), groupChildrenContent);
} else {
var itemContent = this.props.itemTemplate ? ObjectUtils.getJSXElement(this.props.itemTemplate, suggestion, index) : this.props.field ? ObjectUtils.resolveFieldData(suggestion, this.props.field) : suggestion;
return /*#__PURE__*/React__default["default"].createElement("li", {
key: index + '_item',
role: "option",
"aria-selected": this.props.ariaSelected === suggestion,
className: "p-autocomplete-item",
onClick: function onClick(e) {
return _this2.props.onItemClick(e, suggestion);
}
}, itemContent, /*#__PURE__*/React__default["default"].createElement(Ripple, null));
}
}
}, {
key: "renderItems",
value: function renderItems() {
var _this3 = this;
if (this.props.suggestions) {
return this.props.suggestions.map(function (suggestion, index) {
return _this3.renderItem(suggestion, index);
});
}
return null;
}
}, {
key: "renderContent",
value: function renderContent() {
var _this4 = this;
if (this.props.virtualScrollerOptions) {
var virtualScrollerProps = _objectSpread$M(_objectSpread$M({}, this.props.virtualScrollerOptions), {
style: _objectSpread$M(_objectSpread$M({}, this.props.virtualScrollerOptions.style), {
height: this.props.scrollHeight
}),
items: this.props.suggestions,
itemTemplate: function itemTemplate(item, options) {
return item && _this4.renderItem(item, options.index);
},
contentTemplate: function contentTemplate(options) {
var className = classNames('p-autocomplete-items', options.className);
return /*#__PURE__*/React__default["default"].createElement("ul", {
ref: options.contentRef,
className: className,
role: "listbox",
id: _this4.props.listId
}, options.children);
}
});
return /*#__PURE__*/React__default["default"].createElement(VirtualScroller, _extends({
ref: this.props.virtualScrollerRef
}, virtualScrollerProps));
} else {
var items = this.renderItems();
return /*#__PURE__*/React__default["default"].createElement("ul", {
className: "p-autocomplete-items",
role: "listbox",
id: this.props.listId
}, items);
}
}
}, {
key: "renderElement",
value: function renderElement() {
var panelClassName = classNames('p-autocomplete-panel p-component', this.props.panelClassName);
var panelStyle = _objectSpread$M({
maxHeight: this.props.scrollHeight
}, this.props.panelStyle);
var content = this.renderContent();
return /*#__PURE__*/React__default["default"].createElement(CSSTransition, {
nodeRef: this.props.forwardRef,
classNames: "p-connected-overlay",
"in": this.props["in"],
timeout: {
enter: 120,
exit: 100
},
options: this.props.transitionOptions,
unmountOnExit: true,
onEnter: this.props.onEnter,
onEntering: this.props.onEntering,
onEntered: this.props.onEntered,
onExit: this.props.onExit,
onExited: this.props.onExited
}, /*#__PURE__*/React__default["default"].createElement("div", {
ref: this.props.forwardRef,
className: panelClassName,
style: panelStyle,
onClick: this.props.onClick
}, content));
}
}, {
key: "render",
value: function render() {
var element = this.renderElement();
return /*#__PURE__*/React__default["default"].createElement(Portal, {
element: element,
appendTo: this.props.appendTo
});
}
}]);
return AutoCompletePanelComponent;
}(React.Component);
var AutoCompletePanel = /*#__PURE__*/React__default["default"].forwardRef(function (props, ref) {
return /*#__PURE__*/React__default["default"].createElement(AutoCompletePanelComponent, _extends({
forwardRef: ref
}, props));
});
var OverlayService = EventBus();
function ownKeys$L(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$L(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$L(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$L(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createForOfIteratorHelper$g(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray$g(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it["return"] != null) it["return"](); } finally { if (didErr) throw err; } } }; }
function _unsupportedIterableToArray$g(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray$g(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray$g(o, minLen); }
function _arrayLikeToArray$g(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
function _createSuper$2c(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$2c(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$2c() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var AutoComplete = /*#__PURE__*/function (_Component) {
_inherits(AutoComplete, _Component);
var _super = _createSuper$2c(AutoComplete);
function AutoComplete(props) {
var _this;
_classCallCheck(this, AutoComplete);
_this = _super.call(this, props);
_this.state = {
id: _this.props.id,
searching: false,
focused: false,
overlayVisible: false
};
_this.onInputChange = _this.onInputChange.bind(_assertThisInitialized(_this));
_this.onInputFocus = _this.onInputFocus.bind(_assertThisInitialized(_this));
_this.onInputBlur = _this.onInputBlur.bind(_assertThisInitialized(_this));
_this.onInputKeyDown = _this.onInputKeyDown.bind(_assertThisInitialized(_this));
_this.onDropdownClick = _this.onDropdownClick.bind(_assertThisInitialized(_this));
_this.onMultiContainerClick = _this.onMultiContainerClick.bind(_assertThisInitialized(_this));
_this.onMultiInputFocus = _this.onMultiInputFocus.bind(_assertThisInitialized(_this));
_this.onMultiInputBlur = _this.onMultiInputBlur.bind(_assertThisInitialized(_this));
_this.selectItem = _this.selectItem.bind(_assertThisInitialized(_this));
_this.getOptionGroupLabel = _this.getOptionGroupLabel.bind(_assertThisInitialized(_this));
_this.getOptionGroupChildren = _this.getOptionGroupChildren.bind(_assertThisInitialized(_this));
_this.onOverlayEnter = _this.onOverlayEnter.bind(_assertThisInitialized(_this));
_this.onOverlayEntering = _this.onOverlayEntering.bind(_assertThisInitialized(_this));
_this.onOverlayEntered = _this.onOverlayEntered.bind(_assertThisInitialized(_this));
_this.onOverlayExit = _this.onOverlayExit.bind(_assertThisInitialized(_this));
_this.onOverlayExited = _this.onOverlayExited.bind(_assertThisInitialized(_this));
_this.onPanelClick = _this.onPanelClick.bind(_assertThisInitialized(_this));
_this.overlayRef = /*#__PURE__*/React.createRef();
_this.virtualScrollerRef = /*#__PURE__*/React.createRef();
_this.inputRef = /*#__PURE__*/React.createRef(_this.props.inputRef);
return _this;
}
_createClass(AutoComplete, [{
key: "onInputChange",
value: function onInputChange(event) {
var _this2 = this;
//Cancel the search request if user types within the timeout
if (this.timeout) {
clearTimeout(this.timeout);
}
var query = event.target.value;
if (!this.props.multiple) {
this.updateModel(event, query);
}
if (query.length === 0) {
this.hideOverlay();
if (this.props.onClear) {
this.props.onClear(event);
}
} else {
if (query.length >= this.props.minLength) {
this.timeout = setTimeout(function () {
_this2.search(event, query, 'input');
}, this.props.delay);
} else {
this.hideOverlay();
}
}
}
}, {
key: "search",
value: function search(event, query, source) {
//allow empty string but not undefined or null
if (query === undefined || query === null) {
return;
} //do not search blank values on input change
if (source === 'input' && query.trim().length === 0) {
return;
}
if (this.props.completeMethod) {
this.setState({
searching: true
});
this.props.completeMethod({
originalEvent: event,
query: query
});
}
}
}, {
key: "selectItem",
value: function selectItem(event, option, preventInputFocus) {
if (this.props.multiple) {
this.inputRef.current.value = '';
if (!this.isSelected(option)) {
var newValue = this.props.value ? [].concat(_toConsumableArray(this.props.value), [option]) : [option];
this.updateModel(event, newValue);
}
} else {
this.updateInputField(option);
this.updateModel(event, option);
}
if (this.props.onSelect) {
this.props.onSelect({
originalEvent: event,
value: option
});
}
if (!preventInputFocus) {
this.inputRef.current.focus();
this.hideOverlay();
}
}
}, {
key: "updateModel",
value: function updateModel(event, value) {
if (this.props.onChange) {
this.props.onChange({
originalEvent: event,
value: value,
stopPropagation: function stopPropagation() {},
preventDefault: function preventDefault() {},
target: {
name: this.props.name,
id: this.state.id,
value: value
}
});
}
this.ariaSelected = value;
}
}, {
key: "formatValue",
value: function formatValue(value) {
if (value) {
if (this.props.selectedItemTemplate && (this.props.multiple ? this.isSelected(value) : this.findOptionIndex(value) > -1)) {
var resolvedFieldData = ObjectUtils.getJSXElement(this.props.selectedItemTemplate, value);
return resolvedFieldData ? resolvedFieldData : value;
} else if (this.props.field) {
var _resolvedFieldData = ObjectUtils.resolveFieldData(value, this.props.field);
return _resolvedFieldData !== null && _resolvedFieldData !== undefined ? _resolvedFieldData : value;
} else return value;
} else return '';
}
}, {
key: "updateInputField",
value: function updateInputField(value) {
var formattedValue = this.formatValue(value);
this.inputRef.current.value = formattedValue;
}
}, {
key: "showOverlay",
value: function showOverlay() {
this.setState({
overlayVisible: true
});
}
}, {
key: "hideOverlay",
value: function hideOverlay() {
this.setState({
overlayVisible: false,
searching: false
});
}
}, {
key: "onOverlayEnter",
value: function onOverlayEnter() {
ZIndexUtils.set('overlay', this.overlayRef.current, PrimeReact.autoZIndex, PrimeReact.zIndex['overlay']);
this.alignOverlay();
}
}, {
key: "onOverlayEntering",
value: function onOverlayEntering() {
if (this.props.autoHighlight && this.props.suggestions && this.props.suggestions.length) {
DomHandler.addClass(this.overlayRef.current.firstChild.firstChild, 'p-highlight');
}
}
}, {
key: "onOverlayEntered",
value: function onOverlayEntered() {
this.bindDocumentClickListener();
this.bindScrollListener();
this.bindResizeListener();
this.props.onShow && this.props.onShow();
}
}, {
key: "onOverlayExit",
value: function onOverlayExit() {
this.unbindDocumentClickListener();
this.unbindScrollListener();
this.unbindResizeListener();
}
}, {
key: "onOverlayExited",
value: function onOverlayExited() {
ZIndexUtils.clear(this.overlayRef.current);
this.props.onHide && this.props.onHide();
}
}, {
key: "alignOverlay",
value: function alignOverlay() {
var target = this.props.multiple ? this.multiContainer : this.inputRef.current;
DomHandler.alignOverlay(this.overlayRef.current, target, this.props.appendTo || PrimeReact.appendTo);
}
}, {
key: "onPanelClick",
value: function onPanelClick(event) {
OverlayService.emit('overlay-click', {
originalEvent: event,
target: this.container
});
}
}, {
key: "onDropdownClick",
value: function onDropdownClick(event) {
this.inputRef.current.focus();
if (this.props.dropdownMode === 'blank') this.search(event, '', 'dropdown');else if (this.props.dropdownMode === 'current') this.search(event, this.inputRef.current.value, 'dropdown');
if (this.props.onDropdownClick) {
this.props.onDropdownClick({
originalEvent: event,
query: this.inputRef.current.value
});
}
}
}, {
key: "removeItem",
value: function removeItem(event, index) {
var removedValue = this.props.value[index];
var newValue = this.props.value.filter(function (val, i) {
return index !== i;
});
this.updateModel(event, newValue);
if (this.props.onUnselect) {
this.props.onUnselect({
originalEvent: event,
value: removedValue
});
}
}
}, {
key: "onInputKeyDown",
value: function onInputKeyDown(event) {
if (this.state.overlayVisible) {
var highlightItem = DomHandler.findSingle(this.overlayRef.current, 'li.p-highlight');
switch (event.which) {
//down
case 40:
if (highlightItem) {
var nextElement = this.findNextItem(highlightItem);
if (nextElement) {
DomHandler.addClass(nextElement, 'p-highlight');
DomHandler.removeClass(highlightItem, 'p-highlight');
DomHandler.scrollInView(this.overlayRef.current, nextElement);
}
} else {
highlightItem = DomHandler.findSingle(this.overlayRef.current, 'li');
if (DomHandler.hasClass(highlightItem, 'p-autocomplete-item-group')) {
highlightItem = this.findNextItem(highlightItem);
}
if (highlightItem) {
DomHandler.addClass(highlightItem, 'p-highlight');
}
}
event.preventDefault();
break;
//up
case 38:
if (highlightItem) {
var previousElement = this.findPrevItem(highlightItem);
if (previousElement) {
DomHandler.addClass(previousElement, 'p-highlight');
DomHandler.removeClass(highlightItem, 'p-highlight');
DomHandler.scrollInView(this.overlayRef.current, previousElement);
}
}
event.preventDefault();
break;
//enter
case 13:
if (highlightItem) {
this.selectHighlightItem(event, highlightItem);
this.hideOverlay();
}
event.preventDefault();
break;
//escape
case 27:
this.hideOverlay();
event.preventDefault();
break;
//tab
case 9:
if (highlightItem) {
this.selectHighlightItem(event, highlightItem);
}
this.hideOverlay();
break;
}
}
if (this.props.multiple) {
switch (event.which) {
//backspace
case 8:
if (this.props.value && this.props.value.length && !this.inputRef.current.value) {
var removedValue = this.props.value[this.props.value.length - 1];
var newValue = this.props.value.slice(0, -1);
this.updateModel(event, newValue);
if (this.props.onUnselect) {
this.props.onUnselect({
originalEvent: event,
value: removedValue
});
}
}
break;
}
}
}
}, {
key: "selectHighlightItem",
value: function selectHighlightItem(event, item) {
if (this.props.optionGroupLabel) {
var optionGroup = this.props.suggestions[item.dataset.group];
this.selectItem(event, this.getOptionGroupChildren(optionGroup)[item.dataset.index]);
} else {
this.selectItem(event, this.props.suggestions[DomHandler.index(item)]);
}
}
}, {
key: "findNextItem",
value: function findNextItem(item) {
var nextItem = item.nextElementSibling;
return nextItem ? DomHandler.hasClass(nextItem, 'p-autocomplete-item-group') ? this.findNextItem(nextItem) : nextItem : null;
}
}, {
key: "findPrevItem",
value: function findPrevItem(item) {
var prevItem = item.previousElementSibling;
return prevItem ? DomHandler.hasClass(prevItem, 'p-autocomplete-item-group') ? this.findPrevItem(prevItem) : prevItem : null;
}
}, {
key: "onInputFocus",
value: function onInputFocus(event) {
var _this3 = this;
event.persist();
this.setState({
focused: true
}, function () {
if (_this3.props.onFocus) {
_this3.props.onFocus(event);
}
});
}
}, {
key: "forceItemSelection",
value: function forceItemSelection(event) {
var valid = false;
var inputValue = event.target.value.trim();
if (this.props.suggestions) {
var _iterator = _createForOfIteratorHelper$g(this.props.suggestions),
_step;
try {
for (_iterator.s(); !(_step = _iterator.n()).done;) {
var item = _step.value;
var itemValue = this.props.field ? ObjectUtils.resolveFieldData(item, this.props.field) : item;
if (itemValue && inputValue === itemValue.trim()) {
valid = true;
this.selectItem(event, item, true);
break;
}
}
} catch (err) {
_iterator.e(err);
} finally {
_iterator.f();
}
}
if (!valid) {
this.inputRef.current.value = '';
this.updateModel(event, null);
if (this.props.onClear) {
this.props.onClear(event);
}
}
}
}, {
key: "onInputBlur",
value: function onInputBlur(event) {
var _this4 = this;
event.persist();
this.setState({
focused: false
}, function () {
if (_this4.props.forceSelection) {
_this4.forceItemSelection(event);
}
if (_this4.props.onBlur) {
_this4.props.onBlur(event);
}
});
}
}, {
key: "onMultiContainerClick",
value: function onMultiContainerClick(event) {
this.inputRef.current.focus();
if (this.props.onClick) {
this.props.onClick(event);
}
}
}, {
key: "onMultiInputFocus",
value: function onMultiInputFocus(event) {
this.onInputFocus(event);
DomHandler.addClass(this.multiContainer, 'p-focus');
}
}, {
key: "onMultiInputBlur",
value: function onMultiInputBlur(event) {
this.onInputBlur(event);
DomHandler.removeClass(this.multiContainer, 'p-focus');
}
}, {
key: "isSelected",
value: function isSelected(val) {
var selected = false;
if (this.props.value && this.props.value.length) {
for (var i = 0; i < this.props.value.length; i++) {
if (ObjectUtils.equals(this.props.value[i], val)) {
selected = true;
break;
}
}
}
return selected;
}
}, {
key: "findOptionIndex",
value: function findOptionIndex(option) {
var index = -1;
if (this.props.suggestions) {
for (var i = 0; i < this.props.suggestions.length; i++) {
if (ObjectUtils.equals(option, this.props.suggestions[i])) {
index = i;
break;
}
}
}
return index;
}
}, {
key: "getOptionGroupLabel",
value: function getOptionGroupLabel(optionGroup) {
return this.props.optionGroupLabel ? ObjectUtils.resolveFieldData(optionGroup, this.props.optionGroupLabel) : optionGroup;
}
}, {
key: "getOptionGroupChildren",
value: function getOptionGroupChildren(optionGroup) {
return ObjectUtils.resolveFieldData(optionGroup, this.props.optionGroupChildren);
}
}, {
key: "bindDocumentClickListener",
value: function bindDocumentClickListener() {
var _this5 = this;
if (!this.documentClickListener) {
this.documentClickListener = function (event) {
if (event.which === 3) {
// right click
return;
}
if (_this5.state.overlayVisible && _this5.isOutsideClicked(event)) {
_this5.hideOverlay();
}
};
document.addEventListener('click', this.documentClickListener);
}
}
}, {
key: "unbindDocumentClickListener",
value: function unbindDocumentClickListener() {
if (this.documentClickListener) {
document.removeEventListener('click', this.documentClickListener);
this.documentClickListener = null;
}
}
}, {
key: "bindScrollListener",
value: function bindScrollListener() {
var _this6 = this;
if (!this.scrollHandler) {
this.scrollHandler = new ConnectedOverlayScrollHandler(this.container, function () {
if (_this6.state.overlayVisible) {
_this6.hideOverlay();
}
});
}
this.scrollHandler.bindScrollListener();
}
}, {
key: "unbindScrollListener",
value: function unbindScrollListener() {
if (this.scrollHandler) {
this.scrollHandler.unbindScrollListener();
}
}
}, {
key: "bindResizeListener",
value: function bindResizeListener() {
var _this7 = this;
if (!this.resizeListener) {
this.resizeListener = function () {
if (_this7.state.overlayVisible && !DomHandler.isTouchDevice()) {
_this7.hideOverlay();
}
};
window.addEventListener('resize', this.resizeListener);
}
}
}, {
key: "unbindResizeListener",
value: function unbindResizeListener() {
if (this.resizeListener) {
window.removeEventListener('resize', this.resizeListener);
this.resizeListener = null;
}
}
}, {
key: "isOutsideClicked",
value: function isOutsideClicked(event) {
return this.container && this.overlayRef && this.overlayRef.current && !this.overlayRef.current.contains(event.target) && !this.isInputClicked(event);
}
}, {
key: "isInputClicked",
value: function isInputClicked(event) {
if (this.props.multiple) return event.target === this.multiContainer || this.multiContainer.contains(event.target);else return event.target === this.inputRef.current;
}
}, {
key: "updateInputRef",
value: function updateInputRef() {
var ref = this.props.inputRef;
if (ref) {
if (typeof ref === 'function') {
ref(this.inputRef.current);
} else {
ref.current = this.inputRef.current;
}
}
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
this.updateInputRef();
if (!this.state.id) {
this.setState({
id: UniqueComponentId()
});
}
if (this.props.autoFocus && this.inputRef && this.inputRef.current) {
this.inputRef.current.focus();
}
if (this.props.tooltip) {
this.renderTooltip();
}
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps) {
if (prevProps.suggestions !== this.props.suggestions && this.state.searching) {
if (this.props.suggestions && this.props.suggestions.length) {
this.showOverlay();
} else {
this.hideOverlay();
}
this.setState({
searching: false
});
}
if (this.inputRef && this.inputRef.current && !this.props.multiple) {
this.updateInputField(this.props.value);
}
if (prevProps.tooltip !== this.props.tooltip || prevProps.tooltipOptions !== this.props.tooltipOptions) {
if (this.tooltip) this.tooltip.update(_objectSpread$L({
content: this.props.tooltip
}, this.props.tooltipOptions || {}));else this.renderTooltip();
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
this.unbindDocumentClickListener();
this.unbindResizeListener();
if (this.scrollHandler) {
this.scrollHandler.destroy();
this.scrollHandler = null;
}
if (this.tooltip) {
this.tooltip.destroy();
this.tooltip = null;
}
if (this.timeout) {
clearTimeout(this.timeout);
}
ZIndexUtils.clear(this.overlayRef.current);
}
}, {
key: "renderTooltip",
value: function renderTooltip() {
this.tooltip = tip({
target: this.container,
content: this.props.tooltip,
options: this.props.tooltipOptions
});
}
}, {
key: "renderSimpleAutoComplete",
value: function renderSimpleAutoComplete() {
var inputClassName = classNames('p-autocomplete-input', this.props.inputClassName, {
'p-autocomplete-dd-input': this.props.dropdown
});
return /*#__PURE__*/React__default["default"].createElement(InputText, {
ref: this.inputRef,
id: this.props.inputId,
type: this.props.type,
name: this.props.name,
defaultValue: this.formatValue(this.props.value),
role: "searchbox",
"aria-autocomplete": "list",
"aria-controls": this.state.id + '_list',
"aria-labelledby": this.props.ariaLabelledBy,
className: inputClassName,
style: this.props.inputStyle,
autoComplete: "off",
readOnly: this.props.readOnly,
disabled: this.props.disabled,
placeholder: this.props.placeholder,
size: this.props.size,
maxLength: this.props.maxLength,
tabIndex: this.props.tabIndex,
onBlur: this.onInputBlur,
onFocus: this.onInputFocus,
onChange: this.onInputChange,
onMouseDown: this.props.onMouseDown,
onKeyUp: this.props.onKeyUp,
onKeyDown: this.onInputKeyDown,
onKeyPress: this.props.onKeyPress,
onContextMenu: this.props.onContextMenu,
onClick: this.props.onClick,
onDoubleClick: this.props.onDblClick
});
}
}, {
key: "renderChips",
value: function renderChips() {
var _this8 = this;
if (this.props.value && this.props.value.length) {
return this.props.value.map(function (val, index) {
return /*#__PURE__*/React__default["default"].createElement("li", {
key: index + 'multi-item',
className: "p-autocomplete-token p-highlight"
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-autocomplete-token-label"
}, _this8.formatValue(val)), !_this8.props.disabled && IconUtils.getJSXIcon(_this8.props.removeIcon, {
className: 'p-autocomplete-token-icon',
onClick: function onClick(e) {
return _this8.removeItem(e, index);
}
}, {
props: _this8.props
}));
});
}
return null;
}
}, {
key: "renderMultiInput",
value: function renderMultiInput() {
return /*#__PURE__*/React__default["default"].createElement("li", {
className: "p-autocomplete-input-token"
}, /*#__PURE__*/React__default["default"].createElement("input", {
ref: this.inputRef,
type: this.props.type,
disabled: this.props.disabled,
placeholder: this.props.placeholder,
role: "searchbox",
"aria-autocomplete": "list",
"aria-controls": this.state.id + '_list',
"aria-labelledby": this.props.ariaLabelledBy,
autoComplete: "off",
tabIndex: this.props.tabIndex,
onChange: this.onInputChange,
id: this.props.inputId,
name: this.props.name,
style: this.props.inputStyle,
className: this.props.inputClassName,
maxLength: this.props.maxLength,
onKeyUp: this.props.onKeyUp,
onKeyDown: this.onInputKeyDown,
onKeyPress: this.props.onKeyPress,
onFocus: this.onMultiInputFocus,
onBlur: this.onMultiInputBlur
}));
}
}, {
key: "renderMultipleAutoComplete",
value: function renderMultipleAutoComplete() {
var _this9 = this;
var multiContainerClass = classNames('p-autocomplete-multiple-container p-component p-inputtext', {
'p-disabled': this.props.disabled
});
var tokens = this.renderChips();
var input = this.renderMultiInput();
return /*#__PURE__*/React__default["default"].createElement("ul", {
ref: function ref(el) {
_this9.multiContainer = el;
},
className: multiContainerClass,
onContextMenu: this.props.onContextMenu,
onMouseDown: this.props.onMouseDown,
onClick: this.onMultiContainerClick,
onDoubleClick: this.props.onDblClick
}, tokens, input);
}
}, {
key: "renderDropdown",
value: function renderDropdown() {
var _this10 = this;
return /*#__PURE__*/React__default["default"].createElement(Button, {
ref: function ref(el) {
return _this10.dropdownButton = el;
},
type: "button",
icon: this.props.dropdownIcon,
className: "p-autocomplete-dropdown",
disabled: this.props.disabled,
onClick: this.onDropdownClick
});
}
}, {
key: "renderLoader",
value: function renderLoader() {
if (this.state.searching) {
return /*#__PURE__*/React__default["default"].createElement("i", {
className: "p-autocomplete-loader pi pi-spinner pi-spin"
});
}
return null;
}
}, {
key: "render",
value: function render() {
var _this11 = this;
var input, dropdown;
var className = classNames('p-autocomplete p-component p-inputwrapper', this.props.className, {
'p-autocomplete-dd': this.props.dropdown,
'p-autocomplete-multiple': this.props.multiple,
'p-inputwrapper-filled': this.props.value,
'p-inputwrapper-focus': this.state.focused
});
var loader = this.renderLoader();
if (this.props.multiple) input = this.renderMultipleAutoComplete();else input = this.renderSimpleAutoComplete();
if (this.props.dropdown) {
dropdown = this.renderDropdown();
}
return /*#__PURE__*/React__default["default"].createElement("span", {
ref: function ref(el) {
return _this11.container = el;
},
id: this.state.id,
style: this.props.style,
className: className,
"aria-haspopup": "listbox",
"aria-expanded": this.state.overlayVisible,
"aria-owns": this.state.id + '_list'
}, input, loader, dropdown, /*#__PURE__*/React__default["default"].createElement(AutoCompletePanel, _extends({
ref: this.overlayRef,
virtualScrollerRef: this.virtualScrollerRef
}, this.props, {
listId: this.state.id + '_list',
onItemClick: this.selectItem,
ariaSelected: this.ariaSelected,
onClick: this.onPanelClick,
getOptionGroupLabel: this.getOptionGroupLabel,
getOptionGroupChildren: this.getOptionGroupChildren,
"in": this.state.overlayVisible,
onEnter: this.onOverlayEnter,
onEntering: this.onOverlayEntering,
onEntered: this.onOverlayEntered,
onExit: this.onOverlayExit,
onExited: this.onOverlayExited
})));
}
}]);
return AutoComplete;
}(React.Component);
_defineProperty(AutoComplete, "defaultProps", {
id: null,
inputRef: null,
value: null,
name: null,
type: 'text',
suggestions: null,
field: null,
optionGroupLabel: null,
optionGroupChildren: null,
optionGroupTemplate: null,
forceSelection: false,
autoHighlight: false,
virtualScrollerOptions: null,
scrollHeight: '200px',
dropdown: false,
dropdownMode: 'blank',
multiple: false,
minLength: 1,
delay: 300,
style: null,
className: null,
inputId: null,
inputStyle: null,
inputClassName: null,
panelClassName: null,
panelStyle: null,
placeholder: null,
readOnly: false,
disabled: false,
maxLength: null,
size: null,
appendTo: null,
tabIndex: null,
autoFocus: false,
tooltip: null,
tooltipOptions: null,
ariaLabelledBy: null,
completeMethod: null,
itemTemplate: null,
selectedItemTemplate: null,
transitionOptions: null,
dropdownIcon: 'pi pi-chevron-down',
removeIcon: 'pi pi-times-circle',
onChange: null,
onFocus: null,
onBlur: null,
onSelect: null,
onUnselect: null,
onDropdownClick: null,
onClick: null,
onDblClick: null,
onMouseDown: null,
onKeyUp: null,
onKeyPress: null,
onContextMenu: null,
onClear: null,
onShow: null,
onHide: null
});
function _createSuper$2b(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$2b(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$2b() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var Avatar = /*#__PURE__*/function (_Component) {
_inherits(Avatar, _Component);
var _super = _createSuper$2b(Avatar);
function Avatar() {
_classCallCheck(this, Avatar);
return _super.apply(this, arguments);
}
_createClass(Avatar, [{
key: "renderContent",
value: function renderContent() {
var _this = this;
if (this.props.label) {
return /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-avatar-text"
}, this.props.label);
} else if (this.props.icon) {
return IconUtils.getJSXIcon(this.props.icon, {
className: 'p-avatar-icon'
}, {
props: this.props
});
} else if (this.props.image) {
var onError = function onError(e) {
if (_this.props.onImageError) {
_this.props.onImageError(e);
}
};
return /*#__PURE__*/React__default["default"].createElement("img", {
src: this.props.image,
alt: this.props.imageAlt,
onError: onError
});
}
return null;
}
}, {
key: "render",
value: function render() {
var containerClassName = classNames('p-avatar p-component', {
'p-avatar-image': this.props.image != null,
'p-avatar-circle': this.props.shape === 'circle',
'p-avatar-lg': this.props.size === 'large',
'p-avatar-xl': this.props.size === 'xlarge',
'p-avatar-clickable': !!this.props.onClick
}, this.props.className);
var content = this.props.template ? ObjectUtils.getJSXElement(this.props.template, this.props) : this.renderContent();
return /*#__PURE__*/React__default["default"].createElement("div", {
className: containerClassName,
style: this.props.style,
onClick: this.props.onClick
}, content, this.props.children);
}
}]);
return Avatar;
}(React.Component);
_defineProperty(Avatar, "defaultProps", {
label: null,
icon: null,
image: null,
size: 'normal',
shape: 'square',
style: null,
className: null,
template: null,
imageAlt: 'avatar',
onImageError: null,
onClick: null
});
function _createSuper$2a(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$2a(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$2a() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var AvatarGroup = /*#__PURE__*/function (_Component) {
_inherits(AvatarGroup, _Component);
var _super = _createSuper$2a(AvatarGroup);
function AvatarGroup() {
_classCallCheck(this, AvatarGroup);
return _super.apply(this, arguments);
}
_createClass(AvatarGroup, [{
key: "render",
value: function render() {
var containerClassName = classNames('p-avatar-group p-component', this.props.className);
return /*#__PURE__*/React__default["default"].createElement("div", {
className: containerClassName,
style: this.props.style
}, this.props.children);
}
}]);
return AvatarGroup;
}(React.Component);
_defineProperty(AvatarGroup, "defaultProps", {
style: null,
className: null
});
function _createSuper$29(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$29(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$29() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var Badge = /*#__PURE__*/function (_Component) {
_inherits(Badge, _Component);
var _super = _createSuper$29(Badge);
function Badge() {
_classCallCheck(this, Badge);
return _super.apply(this, arguments);
}
_createClass(Badge, [{
key: "render",
value: function render() {
var badgeClassName = classNames('p-badge p-component', {
'p-badge-no-gutter': this.props.value && String(this.props.value).length === 1,
'p-badge-dot': !this.props.value,
'p-badge-lg': this.props.size === 'large',
'p-badge-xl': this.props.size === 'xlarge',
'p-badge-info': this.props.severity === 'info',
'p-badge-success': this.props.severity === 'success',
'p-badge-warning': this.props.severity === 'warning',
'p-badge-danger': this.props.severity === 'danger'
}, this.props.className);
return /*#__PURE__*/React__default["default"].createElement("span", {
className: badgeClassName,
style: this.props.style
}, this.props.value);
}
}]);
return Badge;
}(React.Component);
_defineProperty(Badge, "defaultProps", {
value: null,
severity: null,
size: null,
style: null,
className: null
});
function _createSuper$28(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$28(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$28() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var BreadCrumb = /*#__PURE__*/function (_Component) {
_inherits(BreadCrumb, _Component);
var _super = _createSuper$28(BreadCrumb);
function BreadCrumb() {
_classCallCheck(this, BreadCrumb);
return _super.apply(this, arguments);
}
_createClass(BreadCrumb, [{
key: "itemClick",
value: function itemClick(event, item) {
if (item.disabled) {
event.preventDefault();
return;
}
if (!item.url) {
event.preventDefault();
}
if (item.command) {
item.command({
originalEvent: event,
item: item
});
}
}
}, {
key: "renderHome",
value: function renderHome() {
var _this = this;
if (this.props.home) {
var className = classNames('p-breadcrumb-home', {
'p-disabled': this.props.home.disabled
}, this.props.home.className);
var iconClassName = classNames('p-menuitem-icon', this.props.home.icon);
return /*#__PURE__*/React__default["default"].createElement("li", {
className: className,
style: this.props.home.style
}, /*#__PURE__*/React__default["default"].createElement("a", {
href: this.props.home.url || '#',
className: "p-menuitem-link",
"aria-disabled": this.props.home.disabled,
target: this.props.home.target,
onClick: function onClick(event) {
return _this.itemClick(event, _this.props.home);
}
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: iconClassName
})));
}
return null;
}
}, {
key: "renderSeparator",
value: function renderSeparator() {
return /*#__PURE__*/React__default["default"].createElement("li", {
className: "p-breadcrumb-chevron pi pi-chevron-right"
});
}
}, {
key: "renderMenuitem",
value: function renderMenuitem(item) {
var _this2 = this;
var className = classNames(item.className, {
'p-disabled': item.disabled
});
var label = item.label && /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-menuitem-text"
}, item.label);
var content = /*#__PURE__*/React__default["default"].createElement("a", {
href: item.url || '#',
className: "p-menuitem-link",
target: item.target,
onClick: function onClick(event) {
return _this2.itemClick(event, item);
},
"aria-disabled": item.disabled
}, label);
if (item.template) {
var defaultContentOptions = {
onClick: function onClick(event) {
return _this2.itemClick(event, item);
},
className: 'p-menuitem-link',
labelClassName: 'p-menuitem-text',
element: content,
props: this.props
};
content = ObjectUtils.getJSXElement(item.template, item, defaultContentOptions);
}
return /*#__PURE__*/React__default["default"].createElement("li", {
className: className,
style: item.style
}, content);
}
}, {
key: "renderMenuitems",
value: function renderMenuitems() {
var _this3 = this;
if (this.props.model) {
var items = this.props.model.map(function (item, index) {
var menuitem = _this3.renderMenuitem(item);
var separator = index === _this3.props.model.length - 1 ? null : _this3.renderSeparator();
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, {
key: item.label + '_' + index
}, menuitem, separator);
});
return items;
}
return null;
}
}, {
key: "render",
value: function render() {
var className = classNames('p-breadcrumb p-component', this.props.className);
var home = this.renderHome();
var items = this.renderMenuitems();
var separator = this.renderSeparator();
return /*#__PURE__*/React__default["default"].createElement("nav", {
id: this.props.id,
className: className,
style: this.props.style,
"aria-label": "Breadcrumb"
}, /*#__PURE__*/React__default["default"].createElement("ul", null, home, separator, items));
}
}]);
return BreadCrumb;
}(React.Component);
_defineProperty(BreadCrumb, "defaultProps", {
id: null,
model: null,
home: null,
style: null,
className: null
});
function _createSuper$27(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$27(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$27() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var CalendarPanelComponent = /*#__PURE__*/function (_Component) {
_inherits(CalendarPanelComponent, _Component);
var _super = _createSuper$27(CalendarPanelComponent);
function CalendarPanelComponent() {
_classCallCheck(this, CalendarPanelComponent);
return _super.apply(this, arguments);
}
_createClass(CalendarPanelComponent, [{
key: "renderElement",
value: function renderElement() {
return /*#__PURE__*/React__default["default"].createElement(CSSTransition, {
nodeRef: this.props.forwardRef,
classNames: "p-connected-overlay",
"in": this.props["in"],
timeout: {
enter: 120,
exit: 100
},
options: this.props.transitionOptions,
unmountOnExit: true,
onEnter: this.props.onEnter,
onEntered: this.props.onEntered,
onExit: this.props.onExit,
onExited: this.props.onExited
}, /*#__PURE__*/React__default["default"].createElement("div", {
ref: this.props.forwardRef,
className: this.props.className,
style: this.props.style,
onClick: this.props.onClick,
onMouseUp: this.props.onMouseUp
}, this.props.children));
}
}, {
key: "render",
value: function render() {
var element = this.renderElement();
return this.props.inline ? element : /*#__PURE__*/React__default["default"].createElement(Portal, {
element: element,
appendTo: this.props.appendTo
});
}
}]);
return CalendarPanelComponent;
}(React.Component);
_defineProperty(CalendarPanelComponent, "defaultProps", {
appendTo: null,
style: null,
className: null
});
var CalendarPanel = /*#__PURE__*/React__default["default"].forwardRef(function (props, ref) {
return /*#__PURE__*/React__default["default"].createElement(CalendarPanelComponent, _extends({
forwardRef: ref
}, props));
});
function _createForOfIteratorHelper$f(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray$f(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it["return"] != null) it["return"](); } finally { if (didErr) throw err; } } }; }
function _unsupportedIterableToArray$f(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray$f(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray$f(o, minLen); }
function _arrayLikeToArray$f(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
function ownKeys$K(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$K(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$K(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$K(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createSuper$26(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$26(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$26() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var Calendar = /*#__PURE__*/function (_Component) {
_inherits(Calendar, _Component);
var _super = _createSuper$26(Calendar);
function Calendar(props) {
var _this;
_classCallCheck(this, Calendar);
_this = _super.call(this, props);
_this.state = {
focused: false,
overlayVisible: false
};
if (!_this.props.onViewDateChange) {
var viewDate = _this.getViewDate(_this.props.viewDate);
_this.validateDate(viewDate);
_this.state = _objectSpread$K(_objectSpread$K({}, _this.state), {}, {
viewDate: viewDate
});
}
_this.navigation = null;
_this.onUserInput = _this.onUserInput.bind(_assertThisInitialized(_this));
_this.onInputFocus = _this.onInputFocus.bind(_assertThisInitialized(_this));
_this.onInputBlur = _this.onInputBlur.bind(_assertThisInitialized(_this));
_this.onInputKeyDown = _this.onInputKeyDown.bind(_assertThisInitialized(_this));
_this.onButtonClick = _this.onButtonClick.bind(_assertThisInitialized(_this));
_this.onPrevButtonClick = _this.onPrevButtonClick.bind(_assertThisInitialized(_this));
_this.onNextButtonClick = _this.onNextButtonClick.bind(_assertThisInitialized(_this));
_this.onMonthDropdownChange = _this.onMonthDropdownChange.bind(_assertThisInitialized(_this));
_this.onYearDropdownChange = _this.onYearDropdownChange.bind(_assertThisInitialized(_this));
_this.onTodayButtonClick = _this.onTodayButtonClick.bind(_assertThisInitialized(_this));
_this.onClearButtonClick = _this.onClearButtonClick.bind(_assertThisInitialized(_this));
_this.onPanelClick = _this.onPanelClick.bind(_assertThisInitialized(_this));
_this.onPanelMouseUp = _this.onPanelMouseUp.bind(_assertThisInitialized(_this));
_this.incrementHour = _this.incrementHour.bind(_assertThisInitialized(_this));
_this.decrementHour = _this.decrementHour.bind(_assertThisInitialized(_this));
_this.incrementMinute = _this.incrementMinute.bind(_assertThisInitialized(_this));
_this.decrementMinute = _this.decrementMinute.bind(_assertThisInitialized(_this));
_this.incrementSecond = _this.incrementSecond.bind(_assertThisInitialized(_this));
_this.decrementSecond = _this.decrementSecond.bind(_assertThisInitialized(_this));
_this.toggleAmPm = _this.toggleAmPm.bind(_assertThisInitialized(_this));
_this.onTimePickerElementMouseDown = _this.onTimePickerElementMouseDown.bind(_assertThisInitialized(_this));
_this.onTimePickerElementMouseUp = _this.onTimePickerElementMouseUp.bind(_assertThisInitialized(_this));
_this.onTimePickerElementMouseLeave = _this.onTimePickerElementMouseLeave.bind(_assertThisInitialized(_this));
_this.onOverlayEnter = _this.onOverlayEnter.bind(_assertThisInitialized(_this));
_this.onOverlayEntered = _this.onOverlayEntered.bind(_assertThisInitialized(_this));
_this.onOverlayExit = _this.onOverlayExit.bind(_assertThisInitialized(_this));
_this.onOverlayExited = _this.onOverlayExited.bind(_assertThisInitialized(_this));
_this.reFocusInputField = _this.reFocusInputField.bind(_assertThisInitialized(_this));
_this.overlayRef = /*#__PURE__*/React.createRef();
_this.inputRef = /*#__PURE__*/React.createRef(_this.props.inputRef);
return _this;
}
_createClass(Calendar, [{
key: "updateInputRef",
value: function updateInputRef() {
var ref = this.props.inputRef;
if (ref) {
if (typeof ref === 'function') {
ref(this.inputRef.current);
} else {
ref.current = this.inputRef.current;
}
}
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
var _this2 = this;
this.updateInputRef();
if (this.props.tooltip) {
this.renderTooltip();
}
if (this.props.inline) {
this.initFocusableCell();
} else if (this.props.mask) {
mask(this.inputRef.current, {
mask: this.props.mask,
readOnly: this.props.readOnlyInput || this.props.disabled,
onChange: function onChange(e) {
return _this2.updateValueOnInput(e.originalEvent, e.value);
}
});
}
if (this.props.value) {
this.updateInputfield(this.props.value);
}
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps) {
var _this3 = this;
if (prevProps.tooltip !== this.props.tooltip || prevProps.tooltipOptions !== this.props.tooltipOptions) {
if (this.tooltip) this.tooltip.update(_objectSpread$K({
content: this.props.tooltip
}, this.props.tooltipOptions || {}));else this.renderTooltip();
}
if (!this.props.onViewDateChange && !this.viewStateChanged) {
var propValue = this.props.value;
if (Array.isArray(propValue)) {
propValue = propValue[0];
}
var prevPropValue = prevProps.value;
if (Array.isArray(prevPropValue)) {
prevPropValue = prevPropValue[0];
}
if (!prevPropValue && propValue || propValue && propValue instanceof Date && propValue.getTime() !== prevPropValue.getTime()) {
var viewDate = this.props.viewDate && this.isValidDate(this.props.viewDate) ? this.props.viewDate : propValue && this.isValidDate(propValue) ? propValue : new Date();
this.validateDate(viewDate);
this.setState({
viewDate: viewDate
}, function () {
_this3.viewStateChanged = true;
});
}
}
if (this.overlayRef && this.overlayRef.current) {
this.updateFocus();
}
if (prevProps.value !== this.props.value && (!this.viewStateChanged || !this.isVisible()) || this.isOptionChanged(prevProps)) {
this.updateInputfield(this.props.value);
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
if (this.hideTimeout) {
clearTimeout(this.hideTimeout);
}
if (this.touchUIMask) {
this.disableModality();
this.touchUIMask = null;
}
if (this.tooltip) {
this.tooltip.destroy();
this.tooltip = null;
}
this.unbindDocumentClickListener();
this.unbindDocumentResizeListener();
if (this.scrollHandler) {
this.scrollHandler.destroy();
this.scrollHandler = null;
}
ZIndexUtils.clear(this.overlayRef.current);
}
}, {
key: "renderTooltip",
value: function renderTooltip() {
this.tooltip = tip({
target: this.inputRef.current,
content: this.props.tooltip,
options: this.props.tooltipOptions
});
}
}, {
key: "isVisible",
value: function isVisible() {
return this.props.onVisibleChange ? this.props.visible : this.state.overlayVisible;
}
}, {
key: "isOptionChanged",
value: function isOptionChanged(prevProps) {
var _this4 = this;
var optionProps = ['dateFormat', 'hourFormat', 'timeOnly', 'showSeconds', 'showMillisec'];
return optionProps.some(function (option) {
return prevProps[option] !== _this4.props[option];
});
}
}, {
key: "getDateFormat",
value: function getDateFormat() {
return this.props.dateFormat || localeOption('dateFormat', this.props.locale);
}
}, {
key: "onInputFocus",
value: function onInputFocus(event) {
var _this5 = this;
if (this.ignoreFocusFunctionality) {
this.setState({
focused: true
}, function () {
_this5.ignoreFocusFunctionality = false;
});
} else {
event.persist();
if (this.props.showOnFocus && !this.isVisible()) {
this.showOverlay();
}
this.setState({
focused: true
}, function () {
if (_this5.props.onFocus) {
_this5.props.onFocus(event);
}
});
}
}
}, {
key: "onInputBlur",
value: function onInputBlur(event) {
var _this6 = this;
event.persist();
this.setState({
focused: false
}, function () {
if (_this6.props.onBlur) {
_this6.props.onBlur(event);
}
if (!_this6.props.keepInvalid) {
_this6.updateInputfield(_this6.props.value);
}
});
}
}, {
key: "onInputKeyDown",
value: function onInputKeyDown(event) {
this.isKeydown = true;
switch (event.which) {
//escape
case 27:
{
this.hideOverlay();
break;
}
//tab
case 9:
{
if (this.isVisible()) {
this.trapFocus(event);
}
if (this.props.touchUI) {
this.disableModality();
}
break;
}
}
}
}, {
key: "onUserInput",
value: function onUserInput(event) {
// IE 11 Workaround for input placeholder
if (!this.isKeydown) {
return;
}
this.isKeydown = false;
this.updateValueOnInput(event, event.target.value);
if (this.props.onInput) {
this.props.onInput(event);
}
}
}, {
key: "updateValueOnInput",
value: function updateValueOnInput(event, rawValue) {
try {
var value = this.parseValueFromString(rawValue);
if (this.isValidSelection(value)) {
this.updateModel(event, value);
this.updateViewDate(event, value.length ? value[0] : value);
}
} catch (err) {
//invalid date
var _value = this.props.keepInvalid ? rawValue : null;
this.updateModel(event, _value);
}
}
}, {
key: "reFocusInputField",
value: function reFocusInputField() {
if (!this.props.inline && this.inputRef.current) {
this.ignoreFocusFunctionality = true;
this.inputRef.current.focus();
}
}
}, {
key: "isValidSelection",
value: function isValidSelection(value) {
var _this7 = this;
var isValid = true;
if (this.isSingleSelection()) {
if (!(this.isSelectable(value.getDate(), value.getMonth(), value.getFullYear(), false) && this.isSelectableTime(value))) {
isValid = false;
}
} else if (value.every(function (v) {
return _this7.isSelectable(v.getDate(), v.getMonth(), v.getFullYear(), false) && _this7.isSelectableTime(v);
})) {
if (this.isRangeSelection()) {
isValid = value.length > 1 && value[1] > value[0] ? true : false;
}
}
return isValid;
}
}, {
key: "onButtonClick",
value: function onButtonClick() {
if (this.isVisible()) {
this.hideOverlay();
} else {
this.showOverlay();
}
}
}, {
key: "onPrevButtonClick",
value: function onPrevButtonClick(event) {
this.navigation = {
backward: true,
button: true
};
this.navBackward(event);
}
}, {
key: "onNextButtonClick",
value: function onNextButtonClick(event) {
this.navigation = {
backward: false,
button: true
};
this.navForward(event);
}
}, {
key: "onContainerButtonKeydown",
value: function onContainerButtonKeydown(event) {
switch (event.which) {
//tab
case 9:
this.trapFocus(event);
break;
//escape
case 27:
this.hideOverlay(null, this.reFocusInputField);
event.preventDefault();
break;
}
}
}, {
key: "trapFocus",
value: function trapFocus(event) {
event.preventDefault();
var focusableElements = DomHandler.getFocusableElements(this.overlayRef.current);
if (focusableElements && focusableElements.length > 0) {
if (!document.activeElement) {
focusableElements[0].focus();
} else {
var focusedIndex = focusableElements.indexOf(document.activeElement);
if (event.shiftKey) {
if (focusedIndex === -1 || focusedIndex === 0) focusableElements[focusableElements.length - 1].focus();else focusableElements[focusedIndex - 1].focus();
} else {
if (focusedIndex === -1 || focusedIndex === focusableElements.length - 1) focusableElements[0].focus();else focusableElements[focusedIndex + 1].focus();
}
}
}
}
}, {
key: "updateFocus",
value: function updateFocus() {
var cell;
if (this.navigation) {
if (this.navigation.button) {
this.initFocusableCell();
if (this.navigation.backward) DomHandler.findSingle(this.overlayRef.current, '.p-datepicker-prev').focus();else DomHandler.findSingle(this.overlayRef.current, '.p-datepicker-next').focus();
} else {
if (this.navigation.backward) {
var cells = DomHandler.find(this.overlayRef.current, '.p-datepicker-calendar td span:not(.p-disabled)');
cell = cells[cells.length - 1];
} else {
cell = DomHandler.findSingle(this.overlayRef.current, '.p-datepicker-calendar td span:not(.p-disabled)');
}
if (cell) {
cell.tabIndex = '0';
cell.focus();
}
}
this.navigation = null;
} else {
this.initFocusableCell();
}
}
}, {
key: "initFocusableCell",
value: function initFocusableCell() {
var cell;
if (this.view === 'month') {
var cells = DomHandler.find(this.overlayRef.current, '.p-monthpicker .p-monthpicker-month');
var selectedCell = DomHandler.findSingle(this.overlayRef.current, '.p-monthpicker .p-monthpicker-month.p-highlight');
cells.forEach(function (cell) {
return cell.tabIndex = -1;
});
cell = selectedCell || cells[0];
} else {
cell = DomHandler.findSingle(this.overlayRef.current, 'span.p-highlight');
if (!cell) {
var todayCell = DomHandler.findSingle(this.overlayRef.current, 'td.p-datepicker-today span:not(.p-disabled)');
if (todayCell) cell = todayCell;else cell = DomHandler.findSingle(this.overlayRef.current, '.p-datepicker-calendar td span:not(.p-disabled)');
}
}
if (cell) {
cell.tabIndex = '0';
}
}
}, {
key: "navBackward",
value: function navBackward(event) {
if (this.props.disabled) {
event.preventDefault();
return;
}
var newViewDate = new Date(this.getViewDate().getTime());
newViewDate.setDate(1);
if (this.props.view === 'date') {
if (newViewDate.getMonth() === 0) {
newViewDate.setMonth(11);
newViewDate.setFullYear(newViewDate.getFullYear() - 1);
} else {
newViewDate.setMonth(newViewDate.getMonth() - 1);
}
} else if (this.props.view === 'month') {
var currentYear = newViewDate.getFullYear();
var newYear = currentYear - 1;
if (this.props.yearNavigator) {
var minYear = parseInt(this.props.yearRange.split(':')[0], 10);
if (newYear < minYear) {
newYear = minYear;
}
}
newViewDate.setFullYear(newYear);
}
this.updateViewDate(event, newViewDate);
event.preventDefault();
}
}, {
key: "navForward",
value: function navForward(event) {
if (this.props.disabled) {
event.preventDefault();
return;
}
var newViewDate = new Date(this.getViewDate().getTime());
newViewDate.setDate(1);
if (this.props.view === 'date') {
if (newViewDate.getMonth() === 11) {
newViewDate.setMonth(0);
newViewDate.setFullYear(newViewDate.getFullYear() + 1);
} else {
newViewDate.setMonth(newViewDate.getMonth() + 1);
}
} else if (this.props.view === 'month') {
var currentYear = newViewDate.getFullYear();
var newYear = currentYear + 1;
if (this.props.yearNavigator) {
var maxYear = parseInt(this.props.yearRange.split(':')[1], 10);
if (newYear > maxYear) {
newYear = maxYear;
}
}
newViewDate.setFullYear(newYear);
}
this.updateViewDate(event, newViewDate);
event.preventDefault();
}
}, {
key: "onMonthDropdownChange",
value: function onMonthDropdownChange(event, value) {
var currentViewDate = this.getViewDate();
var newViewDate = new Date(currentViewDate.getTime());
newViewDate.setMonth(parseInt(value, 10));
this.updateViewDate(event, newViewDate);
}
}, {
key: "onYearDropdownChange",
value: function onYearDropdownChange(event, value) {
var currentViewDate = this.getViewDate();
var newViewDate = new Date(currentViewDate.getTime());
newViewDate.setFullYear(parseInt(value, 10));
this.updateViewDate(event, newViewDate);
}
}, {
key: "onTodayButtonClick",
value: function onTodayButtonClick(event) {
var today = new Date();
var dateMeta = {
day: today.getDate(),
month: today.getMonth(),
year: today.getFullYear(),
today: true,
selectable: true
};
var timeMeta = {
hours: today.getHours(),
minutes: today.getMinutes(),
seconds: today.getSeconds(),
milliseconds: today.getMilliseconds()
};
this.updateViewDate(event, today);
this.onDateSelect(event, dateMeta, timeMeta);
if (this.props.onTodayButtonClick) {
this.props.onTodayButtonClick(event);
}
}
}, {
key: "onClearButtonClick",
value: function onClearButtonClick(event) {
this.updateModel(event, null);
this.updateInputfield(null);
this.hideOverlay(null, this.reFocusInputField);
if (this.props.onClearButtonClick) {
this.props.onClearButtonClick(event);
}
}
}, {
key: "onPanelClick",
value: function onPanelClick(event) {
if (!this.props.inline) {
OverlayService.emit('overlay-click', {
originalEvent: event,
target: this.container
});
}
}
}, {
key: "onPanelMouseUp",
value: function onPanelMouseUp(event) {
this.onPanelClick(event);
}
}, {
key: "onTimePickerElementMouseDown",
value: function onTimePickerElementMouseDown(event, type, direction) {
if (!this.props.disabled) {
this.repeat(event, null, type, direction);
event.preventDefault();
}
}
}, {
key: "onTimePickerElementMouseUp",
value: function onTimePickerElementMouseUp() {
if (!this.props.disabled) {
this.clearTimePickerTimer();
}
}
}, {
key: "onTimePickerElementMouseLeave",
value: function onTimePickerElementMouseLeave() {
if (!this.props.disabled) {
this.clearTimePickerTimer();
}
}
}, {
key: "repeat",
value: function repeat(event, interval, type, direction) {
var _this8 = this;
event.persist();
var i = interval || 500;
this.clearTimePickerTimer();
this.timePickerTimer = setTimeout(function () {
_this8.repeat(event, 100, type, direction);
}, i);
switch (type) {
case 0:
if (direction === 1) this.incrementHour(event);else this.decrementHour(event);
break;
case 1:
if (direction === 1) this.incrementMinute(event);else this.decrementMinute(event);
break;
case 2:
if (direction === 1) this.incrementSecond(event);else this.decrementSecond(event);
break;
case 3:
if (direction === 1) this.incrementMilliSecond(event);else this.decrementMilliSecond(event);
break;
}
}
}, {
key: "clearTimePickerTimer",
value: function clearTimePickerTimer() {
if (this.timePickerTimer) {
clearTimeout(this.timePickerTimer);
}
}
}, {
key: "incrementHour",
value: function incrementHour(event) {
var currentTime = this.getCurrentDateTime();
var currentHour = currentTime.getHours();
var newHour = currentHour + this.props.stepHour;
newHour = newHour >= 24 ? newHour - 24 : newHour;
if (this.validateHour(newHour, currentTime)) {
if (this.props.maxDate && this.props.maxDate.toDateString() === currentTime.toDateString() && this.props.maxDate.getHours() === newHour) {
if (this.props.maxDate.getMinutes() < currentTime.getMinutes()) {
if (this.props.maxDate.getSeconds() < currentTime.getSeconds()) {
if (this.props.maxDate.getMilliseconds() < currentTime.getMilliseconds()) {
this.updateTime(event, newHour, this.props.maxDate.getMinutes(), this.props.maxDate.getSeconds(), this.props.maxDate.getMilliseconds());
} else {
this.updateTime(event, newHour, this.props.maxDate.getMinutes(), this.props.maxDate.getSeconds(), currentTime.getMilliseconds());
}
} else {
this.updateTime(event, newHour, this.props.maxDate.getMinutes(), currentTime.getSeconds(), currentTime.getMilliseconds());
}
} else if (this.props.maxDate.getMinutes() === currentTime.getMinutes()) {
if (this.props.maxDate.getSeconds() < currentTime.getSeconds()) {
if (this.props.maxDate.getMilliseconds() < currentTime.getMilliseconds()) {
this.updateTime(event, newHour, this.props.maxDate.getMinutes(), this.props.maxDate.getSeconds(), this.props.maxDate.getMilliseconds());
} else {
this.updateTime(event, newHour, this.props.maxDate.getMinutes(), this.props.maxDate.getSeconds(), currentTime.getMilliseconds());
}
} else {
this.updateTime(event, newHour, this.props.maxDate.getMinutes(), currentTime.getSeconds(), currentTime.getMilliseconds());
}
} else {
this.updateTime(event, newHour, currentTime.getMinutes(), currentTime.getSeconds(), currentTime.getMilliseconds());
}
} else {
this.updateTime(event, newHour, currentTime.getMinutes(), currentTime.getSeconds(), currentTime.getMilliseconds());
}
}
event.preventDefault();
}
}, {
key: "decrementHour",
value: function decrementHour(event) {
var currentTime = this.getCurrentDateTime();
var currentHour = currentTime.getHours();
var newHour = currentHour - this.props.stepHour;
newHour = newHour < 0 ? newHour + 24 : newHour;
if (this.validateHour(newHour, currentTime)) {
if (this.props.minDate && this.props.minDate.toDateString() === currentTime.toDateString() && this.props.minDate.getHours() === newHour) {
if (this.props.minDate.getMinutes() > currentTime.getMinutes()) {
if (this.props.minDate.getSeconds() > currentTime.getSeconds()) {
if (this.props.minDate.getMilliseconds() > currentTime.getMilliseconds()) {
this.updateTime(event, newHour, this.props.minDate.getMinutes(), this.props.minDate.getSeconds(), this.props.minDate.getMilliseconds());
} else {
this.updateTime(event, newHour, this.props.minDate.getMinutes(), this.props.minDate.getSeconds(), currentTime.getMilliseconds());
}
} else {
this.updateTime(event, newHour, this.props.minDate.getMinutes(), currentTime.getSeconds(), currentTime.getMilliseconds());
}
} else if (this.props.minDate.getMinutes() === currentTime.getMinutes()) {
if (this.props.minDate.getSeconds() > currentTime.getSeconds()) {
if (this.props.minDate.getMilliseconds() > currentTime.getMilliseconds()) {
this.updateTime(event, newHour, this.props.minDate.getMinutes(), this.props.minDate.getSeconds(), this.props.minDate.getMilliseconds());
} else {
this.updateTime(event, newHour, this.props.minDate.getMinutes(), this.props.minDate.getSeconds(), currentTime.getMilliseconds());
}
} else {
this.updateTime(event, newHour, this.props.minDate.getMinutes(), currentTime.getSeconds(), currentTime.getMilliseconds());
}
} else {
this.updateTime(event, newHour, currentTime.getMinutes(), currentTime.getSeconds(), currentTime.getMilliseconds());
}
} else {
this.updateTime(event, newHour, currentTime.getMinutes(), currentTime.getSeconds(), currentTime.getMilliseconds());
}
}
event.preventDefault();
}
}, {
key: "doStepMinute",
value: function doStepMinute(currentMinute, step) {
if (this.props.stepMinute <= 1) {
return step ? currentMinute + step : currentMinute;
}
if (!step) {
step = this.props.stepMinute;
if (currentMinute % step === 0) {
return currentMinute;
}
}
var newMinute = currentMinute + step;
newMinute = Math.floor(newMinute / step) * step;
return newMinute;
}
}, {
key: "incrementMinute",
value: function incrementMinute(event) {
var currentTime = this.getCurrentDateTime();
var currentMinute = currentTime.getMinutes();
var newMinute = this.doStepMinute(currentMinute, this.props.stepMinute);
newMinute = newMinute > 59 ? newMinute - 60 : newMinute;
if (this.validateMinute(newMinute, currentTime)) {
if (this.props.maxDate && this.props.maxDate.toDateString() === currentTime.toDateString() && this.props.maxDate.getMinutes() === newMinute) {
if (this.props.maxDate.getSeconds() < currentTime.getSeconds()) {
if (this.props.maxDate.getMilliseconds() < currentTime.getMilliseconds()) {
this.updateTime(event, currentTime.getHours(), newMinute, this.props.maxDate.getSeconds(), this.props.maxDate.getMilliseconds());
} else {
this.updateTime(event, currentTime.getHours(), newMinute, this.props.maxDate.getSeconds(), currentTime.getMilliseconds());
}
} else {
this.updateTime(event, currentTime.getHours(), newMinute, currentTime.getSeconds(), currentTime.getMilliseconds());
}
} else {
this.updateTime(event, currentTime.getHours(), newMinute, currentTime.getSeconds(), currentTime.getMilliseconds());
}
}
event.preventDefault();
}
}, {
key: "decrementMinute",
value: function decrementMinute(event) {
var currentTime = this.getCurrentDateTime();
var currentMinute = currentTime.getMinutes();
var newMinute = this.doStepMinute(currentMinute, -this.props.stepMinute);
newMinute = newMinute < 0 ? newMinute + 60 : newMinute;
if (this.validateMinute(newMinute, currentTime)) {
if (this.props.minDate && this.props.minDate.toDateString() === currentTime.toDateString() && this.props.minDate.getMinutes() === newMinute) {
if (this.props.minDate.getSeconds() > currentTime.getSeconds()) {
if (this.props.minDate.getMilliseconds() > currentTime.getMilliseconds()) {
this.updateTime(event, currentTime.getHours(), newMinute, this.props.minDate.getSeconds(), this.props.minDate.getMilliseconds());
} else {
this.updateTime(event, currentTime.getHours(), newMinute, this.props.minDate.getSeconds(), currentTime.getMilliseconds());
}
} else {
this.updateTime(event, currentTime.getHours(), newMinute, currentTime.getSeconds(), currentTime.getMilliseconds());
}
} else {
this.updateTime(event, currentTime.getHours(), newMinute, currentTime.getSeconds(), currentTime.getMilliseconds());
}
}
event.preventDefault();
}
}, {
key: "incrementSecond",
value: function incrementSecond(event) {
var currentTime = this.getCurrentDateTime();
var currentSecond = currentTime.getSeconds();
var newSecond = currentSecond + this.props.stepSecond;
newSecond = newSecond > 59 ? newSecond - 60 : newSecond;
if (this.validateSecond(newSecond, currentTime)) {
if (this.props.maxDate && this.props.maxDate.toDateString() === currentTime.toDateString() && this.props.maxDate.getSeconds() === newSecond) {
if (this.props.maxDate.getMilliseconds() < currentTime.getMilliseconds()) {
this.updateTime(event, currentTime.getHours(), currentTime.getMinutes(), newSecond, this.props.maxDate.getMilliseconds());
} else {
this.updateTime(event, currentTime.getHours(), currentTime.getMinutes(), newSecond, currentTime.getMilliseconds());
}
} else {
this.updateTime(event, currentTime.getHours(), currentTime.getMinutes(), newSecond, currentTime.getMilliseconds());
}
}
event.preventDefault();
}
}, {
key: "decrementSecond",
value: function decrementSecond(event) {
var currentTime = this.getCurrentDateTime();
var currentSecond = currentTime.getSeconds();
var newSecond = currentSecond - this.props.stepSecond;
newSecond = newSecond < 0 ? newSecond + 60 : newSecond;
if (this.validateSecond(newSecond, currentTime)) {
if (this.props.minDate && this.props.minDate.toDateString() === currentTime.toDateString() && this.props.minDate.getSeconds() === newSecond) {
if (this.props.minDate.getMilliseconds() > currentTime.getMilliseconds()) {
this.updateTime(event, currentTime.getHours(), currentTime.getMinutes(), newSecond, this.props.minDate.getMilliseconds());
} else {
this.updateTime(event, currentTime.getHours(), currentTime.getMinutes(), newSecond, currentTime.getMilliseconds());
}
} else {
this.updateTime(event, currentTime.getHours(), currentTime.getMinutes(), newSecond, currentTime.getMilliseconds());
}
}
event.preventDefault();
}
}, {
key: "incrementMilliSecond",
value: function incrementMilliSecond(event) {
var currentTime = this.getCurrentDateTime();
var currentMillisecond = currentTime.getMilliseconds();
var newMillisecond = currentMillisecond + this.props.stepMillisec;
newMillisecond = newMillisecond > 999 ? newMillisecond - 1000 : newMillisecond;
if (this.validateMillisecond(newMillisecond, currentTime)) {
this.updateTime(event, currentTime.getHours(), currentTime.getMinutes(), currentTime.getSeconds(), newMillisecond);
}
event.preventDefault();
}
}, {
key: "decrementMilliSecond",
value: function decrementMilliSecond(event) {
var currentTime = this.getCurrentDateTime();
var currentMillisecond = currentTime.getMilliseconds();
var newMillisecond = currentMillisecond - this.props.stepMillisec;
newMillisecond = newMillisecond < 0 ? newMillisecond + 999 : newMillisecond;
if (this.validateMillisecond(newMillisecond, currentTime)) {
this.updateTime(event, currentTime.getHours(), currentTime.getMinutes(), currentTime.getSeconds(), newMillisecond);
}
event.preventDefault();
}
}, {
key: "toggleAmPm",
value: function toggleAmPm(event) {
var currentTime = this.getCurrentDateTime();
var currentHour = currentTime.getHours();
var newHour = currentHour >= 12 ? currentHour - 12 : currentHour + 12;
this.updateTime(event, newHour, currentTime.getMinutes(), currentTime.getSeconds(), currentTime.getMilliseconds());
event.preventDefault();
}
}, {
key: "getViewDate",
value: function getViewDate(date) {
var propValue = this.props.value;
var viewDate = date || (this.props.onViewDateChange ? this.props.viewDate : this.state.viewDate);
if (Array.isArray(propValue)) {
propValue = propValue[0];
}
return viewDate && this.isValidDate(viewDate) ? viewDate : propValue && this.isValidDate(propValue) ? propValue : new Date();
}
}, {
key: "getCurrentDateTime",
value: function getCurrentDateTime() {
if (this.isSingleSelection()) {
return this.props.value && this.props.value instanceof Date ? this.props.value : this.getViewDate();
} else if (this.isMultipleSelection()) {
if (this.props.value && this.props.value.length) {
return this.props.value[this.props.value.length - 1];
}
} else if (this.isRangeSelection()) {
if (this.props.value && this.props.value.length) {
var startDate = this.props.value[0];
var endDate = this.props.value[1];
return endDate || startDate;
}
}
return new Date();
}
}, {
key: "isValidDate",
value: function isValidDate(date) {
return date instanceof Date && !isNaN(date);
}
}, {
key: "validateHour",
value: function validateHour(hour, value) {
var valid = true;
var valueDateString = value ? value.toDateString() : null;
if (this.props.minDate && valueDateString && this.props.minDate.toDateString() === valueDateString) {
if (this.props.minDate.getHours() > hour) {
valid = false;
}
}
if (this.props.maxDate && valueDateString && this.props.maxDate.toDateString() === valueDateString) {
if (this.props.maxDate.getHours() < hour) {
valid = false;
}
}
return valid;
}
}, {
key: "validateMinute",
value: function validateMinute(minute, value) {
var valid = true;
var valueDateString = value ? value.toDateString() : null;
if (this.props.minDate && valueDateString && this.props.minDate.toDateString() === valueDateString) {
if (value.getHours() === this.props.minDate.getHours()) {
if (this.props.minDate.getMinutes() > minute) {
valid = false;
}
}
}
if (this.props.maxDate && valueDateString && this.props.maxDate.toDateString() === valueDateString) {
if (value.getHours() === this.props.maxDate.getHours()) {
if (this.props.maxDate.getMinutes() < minute) {
valid = false;
}
}
}
return valid;
}
}, {
key: "validateSecond",
value: function validateSecond(second, value) {
var valid = true;
var valueDateString = value ? value.toDateString() : null;
if (this.props.minDate && valueDateString && this.props.minDate.toDateString() === valueDateString) {
if (value.getHours() === this.props.minDate.getHours() && value.getMinutes() === this.props.minDate.getMinutes()) {
if (this.props.minDate.getSeconds() > second) {
valid = false;
}
}
}
if (this.props.maxDate && valueDateString && this.props.maxDate.toDateString() === valueDateString) {
if (value.getHours() === this.props.maxDate.getHours() && value.getMinutes() === this.props.maxDate.getMinutes()) {
if (this.props.maxDate.getSeconds() < second) {
valid = false;
}
}
}
return valid;
}
}, {
key: "validateMillisecond",
value: function validateMillisecond(millisecond, value) {
var valid = true;
var valueDateString = value ? value.toDateString() : null;
if (this.props.minDate && valueDateString && this.props.minDate.toDateString() === valueDateString) {
if (value.getHours() === this.props.minDate.getHours() && value.getSeconds() === this.props.minDate.getSeconds() && value.getMinutes() === this.props.minDate.getMinutes()) {
if (this.props.minDate.getMilliseconds() > millisecond) {
valid = false;
}
}
}
if (this.props.maxDate && valueDateString && this.props.maxDate.toDateString() === valueDateString) {
if (value.getHours() === this.props.maxDate.getHours() && value.getSeconds() === this.props.maxDate.getSeconds() && value.getMinutes() === this.props.maxDate.getMinutes()) {
if (this.props.maxDate.getMilliseconds() < millisecond) {
valid = false;
}
}
}
return valid;
}
}, {
key: "validateDate",
value: function validateDate(value) {
if (this.props.yearNavigator) {
var viewYear = value.getFullYear();
var minRangeYear = this.props.yearRange ? parseInt(this.props.yearRange.split(':')[0], 10) : null;
var maxRangeYear = this.props.yearRange ? parseInt(this.props.yearRange.split(':')[1], 10) : null;
var minYear = this.props.minDate && minRangeYear != null ? Math.max(this.props.minDate.getFullYear(), minRangeYear) : this.props.minDate || minRangeYear;
var maxYear = this.props.maxDate && maxRangeYear != null ? Math.min(this.props.maxDate.getFullYear(), maxRangeYear) : this.props.maxDate || maxRangeYear;
if (minYear && minYear > viewYear) {
viewYear = minYear;
}
if (maxYear && maxYear < viewYear) {
viewYear = maxYear;
}
value.setFullYear(viewYear);
}
if (this.props.monthNavigator && this.props.view !== 'month') {
var viewMonth = value.getMonth();
var viewMonthWithMinMax = parseInt(this.isInMinYear(value) && Math.max(this.props.minDate.getMonth(), viewMonth).toString() || this.isInMaxYear(value) && Math.min(this.props.maxDate.getMonth(), viewMonth).toString() || viewMonth);
value.setMonth(viewMonthWithMinMax);
}
}
}, {
key: "updateTime",
value: function updateTime(event, hour, minute, second, millisecond) {
var newDateTime = this.getCurrentDateTime();
newDateTime.setHours(hour);
newDateTime.setMinutes(minute);
newDateTime.setSeconds(second);
newDateTime.setMilliseconds(millisecond);
if (this.isMultipleSelection()) {
if (this.props.value && this.props.value.length) {
var value = _toConsumableArray(this.props.value);
value[value.length - 1] = newDateTime;
newDateTime = value;
} else {
newDateTime = [newDateTime];
}
} else if (this.isRangeSelection()) {
if (this.props.value && this.props.value.length) {
var startDate = this.props.value[0];
var endDate = this.props.value[1];
newDateTime = endDate ? [startDate, newDateTime] : [newDateTime, null];
} else {
newDateTime = [newDateTime, null];
}
}
this.updateModel(event, newDateTime);
if (this.props.onSelect) {
this.props.onSelect({
originalEvent: event,
value: newDateTime
});
}
this.updateInputfield(newDateTime);
}
}, {
key: "updateViewDate",
value: function updateViewDate(event, value) {
this.validateDate(value);
if (this.props.onViewDateChange) {
this.props.onViewDateChange({
originalEvent: event,
value: value
});
} else {
this.viewStateChanged = true;
this.setState({
viewDate: value
});
}
}
}, {
key: "onDateCellKeydown",
value: function onDateCellKeydown(event, date, groupIndex) {
var cellContent = event.currentTarget;
var cell = cellContent.parentElement;
switch (event.which) {
//down arrow
case 40:
{
cellContent.tabIndex = '-1';
var cellIndex = DomHandler.index(cell);
var nextRow = cell.parentElement.nextElementSibling;
if (nextRow) {
var focusCell = nextRow.children[cellIndex].children[0];
if (DomHandler.hasClass(focusCell, 'p-disabled')) {
this.navigation = {
backward: false
};
this.navForward(event);
} else {
nextRow.children[cellIndex].children[0].tabIndex = '0';
nextRow.children[cellIndex].children[0].focus();
}
} else {
this.navigation = {
backward: false
};
this.navForward(event);
}
event.preventDefault();
break;
}
//up arrow
case 38:
{
cellContent.tabIndex = '-1';
var _cellIndex = DomHandler.index(cell);
var prevRow = cell.parentElement.previousElementSibling;
if (prevRow) {
var _focusCell = prevRow.children[_cellIndex].children[0];
if (DomHandler.hasClass(_focusCell, 'p-disabled')) {
this.navigation = {
backward: true
};
this.navBackward(event);
} else {
_focusCell.tabIndex = '0';
_focusCell.focus();
}
} else {
this.navigation = {
backward: true
};
this.navBackward(event);
}
event.preventDefault();
break;
}
//left arrow
case 37:
{
cellContent.tabIndex = '-1';
var prevCell = cell.previousElementSibling;
if (prevCell) {
var _focusCell2 = prevCell.children[0];
if (DomHandler.hasClass(_focusCell2, 'p-disabled')) {
this.navigateToMonth(true, groupIndex, event);
} else {
_focusCell2.tabIndex = '0';
_focusCell2.focus();
}
} else {
this.navigateToMonth(true, groupIndex, event);
}
event.preventDefault();
break;
}
//right arrow
case 39:
{
cellContent.tabIndex = '-1';
var nextCell = cell.nextElementSibling;
if (nextCell) {
var _focusCell3 = nextCell.children[0];
if (DomHandler.hasClass(_focusCell3, 'p-disabled')) {
this.navigateToMonth(false, groupIndex, event);
} else {
_focusCell3.tabIndex = '0';
_focusCell3.focus();
}
} else {
this.navigateToMonth(false, groupIndex, event);
}
event.preventDefault();
break;
}
//enter
case 13:
{
this.onDateSelect(event, date);
event.preventDefault();
break;
}
//escape
case 27:
{
this.hideOverlay(null, this.reFocusInputField);
event.preventDefault();
break;
}
//tab
case 9:
{
this.trapFocus(event);
break;
}
}
}
}, {
key: "navigateToMonth",
value: function navigateToMonth(prev, groupIndex, event) {
if (prev) {
if (this.props.numberOfMonths === 1 || groupIndex === 0) {
this.navigation = {
backward: true
};
this.navBackward(event);
} else {
var prevMonthContainer = this.overlayRef.current.children[groupIndex - 1];
var cells = DomHandler.find(prevMonthContainer, '.p-datepicker-calendar td span:not(.p-disabled)');
var focusCell = cells[cells.length - 1];
focusCell.tabIndex = '0';
focusCell.focus();
}
} else {
if (this.props.numberOfMonths === 1 || groupIndex === this.props.numberOfMonths - 1) {
this.navigation = {
backward: false
};
this.navForward(event);
} else {
var nextMonthContainer = this.overlayRef.current.children[groupIndex + 1];
var _focusCell4 = DomHandler.findSingle(nextMonthContainer, '.p-datepicker-calendar td span:not(.p-disabled)');
_focusCell4.tabIndex = '0';
_focusCell4.focus();
}
}
}
}, {
key: "onMonthCellKeydown",
value: function onMonthCellKeydown(event, index) {
var cell = event.currentTarget;
switch (event.which) {
//arrows
case 38:
case 40:
{
cell.tabIndex = '-1';
var cells = cell.parentElement.children;
var cellIndex = DomHandler.index(cell);
var nextCell = cells[event.which === 40 ? cellIndex + 3 : cellIndex - 3];
if (nextCell) {
nextCell.tabIndex = '0';
nextCell.focus();
}
event.preventDefault();
break;
}
//left arrow
case 37:
{
cell.tabIndex = '-1';
var prevCell = cell.previousElementSibling;
if (prevCell) {
prevCell.tabIndex = '0';
prevCell.focus();
}
event.preventDefault();
break;
}
//right arrow
case 39:
{
cell.tabIndex = '-1';
var _nextCell = cell.nextElementSibling;
if (_nextCell) {
_nextCell.tabIndex = '0';
_nextCell.focus();
}
event.preventDefault();
break;
}
//enter
case 13:
{
this.onMonthSelect(event, index);
event.preventDefault();
break;
}
//escape
case 27:
{
this.hideOverlay(null, this.reFocusInputField);
event.preventDefault();
break;
}
//tab
case 9:
{
this.trapFocus(event);
break;
}
}
}
}, {
key: "onDateSelect",
value: function onDateSelect(event, dateMeta, timeMeta) {
var _this9 = this;
if (this.props.disabled || !dateMeta.selectable) {
event.preventDefault();
return;
}
DomHandler.find(this.overlayRef.current, '.p-datepicker-calendar td span:not(.p-disabled)').forEach(function (cell) {
return cell.tabIndex = -1;
});
event.currentTarget.focus();
if (this.isMultipleSelection()) {
if (this.isSelected(dateMeta)) {
var value = this.props.value.filter(function (date, i) {
return !_this9.isDateEquals(date, dateMeta);
});
this.updateModel(event, value);
this.updateInputfield(value);
} else if (!this.props.maxDateCount || !this.props.value || this.props.maxDateCount > this.props.value.length) {
this.selectDate(event, dateMeta, timeMeta);
}
} else {
this.selectDate(event, dateMeta, timeMeta);
}
if (!this.props.inline && this.isSingleSelection() && (!this.props.showTime || this.props.hideOnDateTimeSelect)) {
setTimeout(function () {
_this9.hideOverlay('dateselect');
}, 100);
if (this.touchUIMask) {
this.disableModality();
}
}
event.preventDefault();
}
}, {
key: "selectTime",
value: function selectTime(date, timeMeta) {
if (this.props.showTime) {
var hours, minutes, seconds, milliseconds;
if (timeMeta) {
hours = timeMeta.hours;
minutes = timeMeta.minutes;
seconds = timeMeta.seconds;
milliseconds = timeMeta.milliseconds;
} else {
var time = this.getCurrentDateTime();
var _ref = [time.getHours(), time.getMinutes(), time.getSeconds(), time.getMilliseconds()];
hours = _ref[0];
minutes = _ref[1];
seconds = _ref[2];
milliseconds = _ref[3];
}
date.setHours(hours);
date.setMinutes(minutes);
date.setSeconds(seconds);
date.setMilliseconds(milliseconds);
}
}
}, {
key: "selectDate",
value: function selectDate(event, dateMeta, timeMeta) {
var date = new Date(dateMeta.year, dateMeta.month, dateMeta.day);
this.selectTime(date, timeMeta);
if (this.props.minDate && this.props.minDate > date) {
date = this.props.minDate;
}
if (this.props.maxDate && this.props.maxDate < date) {
date = this.props.maxDate;
}
var selectedValues = date;
if (this.isSingleSelection()) {
this.updateModel(event, date);
} else if (this.isMultipleSelection()) {
selectedValues = this.props.value ? [].concat(_toConsumableArray(this.props.value), [date]) : [date];
this.updateModel(event, selectedValues);
} else if (this.isRangeSelection()) {
if (this.props.value && this.props.value.length) {
var startDate = this.props.value[0];
var endDate = this.props.value[1];
if (!endDate) {
if (date.getTime() >= startDate.getTime()) {
endDate = date;
} else {
endDate = startDate;
startDate = date;
}
} else {
startDate = date;
endDate = null;
}
selectedValues = [startDate, endDate];
this.updateModel(event, selectedValues);
} else {
selectedValues = [date, null];
this.updateModel(event, selectedValues);
}
}
if (this.props.onSelect) {
this.props.onSelect({
originalEvent: event,
value: date
});
}
this.updateInputfield(selectedValues);
}
}, {
key: "onMonthSelect",
value: function onMonthSelect(event, month) {
this.onDateSelect(event, {
year: this.getViewDate().getFullYear(),
month: month,
day: 1,
selectable: true
});
event.preventDefault();
}
}, {
key: "updateModel",
value: function updateModel(event, value) {
if (this.props.onChange) {
var newValue = value && value instanceof Date ? new Date(value.getTime()) : value;
this.viewStateChanged = true;
this.props.onChange({
originalEvent: event,
value: newValue,
stopPropagation: function stopPropagation() {},
preventDefault: function preventDefault() {},
target: {
name: this.props.name,
id: this.props.id,
value: newValue
}
});
}
}
}, {
key: "showOverlay",
value: function showOverlay(type) {
var _this10 = this;
if (this.props.onVisibleChange) {
this.props.onVisibleChange({
visible: true,
type: type
});
} else {
this.setState({
overlayVisible: true
}, function () {
_this10.overlayEventListener = function (e) {
if (!_this10.isOutsideClicked(e.target)) {
_this10.isOverlayClicked = true;
}
};
OverlayService.on('overlay-click', _this10.overlayEventListener);
});
}
}
}, {
key: "hideOverlay",
value: function hideOverlay(type, callback) {
var _this11 = this;
var _hideCallback = function _hideCallback() {
_this11.viewStateChanged = false;
_this11.ignoreFocusFunctionality = false;
_this11.isOverlayClicked = false;
if (callback) {
callback();
}
OverlayService.off('overlay-click', _this11.overlayEventListener);
_this11.overlayEventListener = null;
};
if (this.props.onVisibleChange) this.props.onVisibleChange({
visible: false,
type: type,
callback: _hideCallback
});else this.setState({
overlayVisible: false
}, _hideCallback);
}
}, {
key: "onOverlayEnter",
value: function onOverlayEnter() {
if (this.props.autoZIndex) {
var key = this.props.touchUI ? 'modal' : 'overlay';
ZIndexUtils.set(key, this.overlayRef.current, PrimeReact.autoZIndex, this.props.baseZIndex || PrimeReact.zIndex[key]);
}
this.alignOverlay();
}
}, {
key: "onOverlayEntered",
value: function onOverlayEntered() {
this.bindDocumentClickListener();
this.bindDocumentResizeListener();
this.bindScrollListener();
this.props.onShow && this.props.onShow();
}
}, {
key: "onOverlayExit",
value: function onOverlayExit() {
this.unbindDocumentClickListener();
this.unbindDocumentResizeListener();
this.unbindScrollListener();
}
}, {
key: "onOverlayExited",
value: function onOverlayExited() {
ZIndexUtils.clear(this.overlayRef.current);
this.props.onHide && this.props.onHide();
}
}, {
key: "bindDocumentClickListener",
value: function bindDocumentClickListener() {
var _this12 = this;
if (!this.documentClickListener) {
this.documentClickListener = function (event) {
if (!_this12.isOverlayClicked && _this12.isVisible() && _this12.isOutsideClicked(event.target)) {
_this12.hideOverlay('outside');
}
_this12.isOverlayClicked = false;
};
document.addEventListener('click', this.documentClickListener);
}
}
}, {
key: "unbindDocumentClickListener",
value: function unbindDocumentClickListener() {
if (this.documentClickListener) {
document.removeEventListener('click', this.documentClickListener);
this.documentClickListener = null;
}
}
}, {
key: "bindDocumentResizeListener",
value: function bindDocumentResizeListener() {
if (!this.documentResizeListener && !this.props.touchUI) {
this.documentResizeListener = this.onWindowResize.bind(this);
window.addEventListener('resize', this.documentResizeListener);
}
}
}, {
key: "unbindDocumentResizeListener",
value: function unbindDocumentResizeListener() {
if (this.documentResizeListener) {
window.removeEventListener('resize', this.documentResizeListener);
this.documentResizeListener = null;
}
}
}, {
key: "bindScrollListener",
value: function bindScrollListener() {
var _this13 = this;
if (!this.scrollHandler) {
this.scrollHandler = new ConnectedOverlayScrollHandler(this.container, function () {
if (_this13.isVisible()) {
_this13.hideOverlay();
}
});
}
this.scrollHandler.bindScrollListener();
}
}, {
key: "unbindScrollListener",
value: function unbindScrollListener() {
if (this.scrollHandler) {
this.scrollHandler.unbindScrollListener();
}
}
}, {
key: "isOutsideClicked",
value: function isOutsideClicked(target) {
return this.container && !(this.container.isSameNode(target) || this.isNavIconClicked(target) || this.container.contains(target) || this.overlayRef && this.overlayRef.current.contains(target));
}
}, {
key: "isNavIconClicked",
value: function isNavIconClicked(target) {
return DomHandler.hasClass(target, 'p-datepicker-prev') || DomHandler.hasClass(target, 'p-datepicker-prev-icon') || DomHandler.hasClass(target, 'p-datepicker-next') || DomHandler.hasClass(target, 'p-datepicker-next-icon');
}
}, {
key: "onWindowResize",
value: function onWindowResize() {
if (this.isVisible() && !DomHandler.isTouchDevice()) {
this.hideOverlay();
}
}
}, {
key: "alignOverlay",
value: function alignOverlay() {
if (this.props.touchUI) {
this.enableModality();
} else {
DomHandler.alignOverlay(this.overlayRef.current, this.inputRef.current.parentElement, this.props.appendTo || PrimeReact.appendTo);
}
}
}, {
key: "enableModality",
value: function enableModality() {
var _this14 = this;
if (!this.touchUIMask) {
this.touchUIMask = document.createElement('div');
this.touchUIMask.style.zIndex = String(ZIndexUtils.get(this.overlayRef.current) - 1);
DomHandler.addMultipleClasses(this.touchUIMask, 'p-component-overlay p-datepicker-mask p-datepicker-mask-scrollblocker p-component-overlay-enter');
this.touchUIMaskClickListener = function () {
_this14.disableModality();
};
this.touchUIMask.addEventListener('click', this.touchUIMaskClickListener);
document.body.appendChild(this.touchUIMask);
DomHandler.addClass(document.body, 'p-overflow-hidden');
}
}
}, {
key: "disableModality",
value: function disableModality() {
var _this15 = this;
if (this.touchUIMask) {
DomHandler.addClass(this.touchUIMask, 'p-component-overlay-leave');
this.touchUIMask.addEventListener('animationend', function () {
_this15.destroyMask();
});
}
}
}, {
key: "destroyMask",
value: function destroyMask() {
this.touchUIMask.removeEventListener('click', this.touchUIMaskClickListener);
this.touchUIMaskClickListener = null;
document.body.removeChild(this.touchUIMask);
this.touchUIMask = null;
var bodyChildren = document.body.children;
var hasBlockerMasks;
for (var i = 0; i < bodyChildren.length; i++) {
var bodyChild = bodyChildren[i];
if (DomHandler.hasClass(bodyChild, 'p-datepicker-mask-scrollblocker')) {
hasBlockerMasks = true;
break;
}
}
if (!hasBlockerMasks) {
DomHandler.removeClass(document.body, 'p-overflow-hidden');
}
}
}, {
key: "getFirstDayOfMonthIndex",
value: function getFirstDayOfMonthIndex(month, year) {
var day = new Date();
day.setDate(1);
day.setMonth(month);
day.setFullYear(year);
var dayIndex = day.getDay() + this.getSundayIndex();
return dayIndex >= 7 ? dayIndex - 7 : dayIndex;
}
}, {
key: "getDaysCountInMonth",
value: function getDaysCountInMonth(month, year) {
return 32 - this.daylightSavingAdjust(new Date(year, month, 32)).getDate();
}
}, {
key: "getDaysCountInPrevMonth",
value: function getDaysCountInPrevMonth(month, year) {
var prev = this.getPreviousMonthAndYear(month, year);
return this.getDaysCountInMonth(prev.month, prev.year);
}
}, {
key: "daylightSavingAdjust",
value: function daylightSavingAdjust(date) {
if (!date) {
return null;
}
date.setHours(date.getHours() > 12 ? date.getHours() + 2 : 0);
return date;
}
}, {
key: "getPreviousMonthAndYear",
value: function getPreviousMonthAndYear(month, year) {
var m, y;
if (month === 0) {
m = 11;
y = year - 1;
} else {
m = month - 1;
y = year;
}
return {
'month': m,
'year': y
};
}
}, {
key: "getNextMonthAndYear",
value: function getNextMonthAndYear(month, year) {
var m, y;
if (month === 11) {
m = 0;
y = year + 1;
} else {
m = month + 1;
y = year;
}
return {
'month': m,
'year': y
};
}
}, {
key: "getSundayIndex",
value: function getSundayIndex() {
var firstDayOfWeek = localeOption('firstDayOfWeek', this.props.locale);
return firstDayOfWeek > 0 ? 7 - firstDayOfWeek : 0;
}
}, {
key: "createWeekDays",
value: function createWeekDays() {
var weekDays = [];
var _localeOptions = localeOptions(this.props.locale),
dayIndex = _localeOptions.firstDayOfWeek,
dayNamesMin = _localeOptions.dayNamesMin;
for (var i = 0; i < 7; i++) {
weekDays.push(dayNamesMin[dayIndex]);
dayIndex = dayIndex === 6 ? 0 : ++dayIndex;
}
return weekDays;
}
}, {
key: "createMonths",
value: function createMonths(month, year) {
var months = [];
for (var i = 0; i < this.props.numberOfMonths; i++) {
var m = month + i;
var y = year;
if (m > 11) {
m = m % 11 - 1;
y = year + 1;
}
months.push(this.createMonth(m, y));
}
return months;
}
}, {
key: "createMonth",
value: function createMonth(month, year) {
var dates = [];
var firstDay = this.getFirstDayOfMonthIndex(month, year);
var daysLength = this.getDaysCountInMonth(month, year);
var prevMonthDaysLength = this.getDaysCountInPrevMonth(month, year);
var dayNo = 1;
var today = new Date();
var weekNumbers = [];
var monthRows = Math.ceil((daysLength + firstDay) / 7);
for (var i = 0; i < monthRows; i++) {
var week = [];
if (i === 0) {
for (var j = prevMonthDaysLength - firstDay + 1; j <= prevMonthDaysLength; j++) {
var prev = this.getPreviousMonthAndYear(month, year);
week.push({
day: j,
month: prev.month,
year: prev.year,
otherMonth: true,
today: this.isToday(today, j, prev.month, prev.year),
selectable: this.isSelectable(j, prev.month, prev.year, true)
});
}
var remainingDaysLength = 7 - week.length;
for (var _j = 0; _j < remainingDaysLength; _j++) {
week.push({
day: dayNo,
month: month,
year: year,
today: this.isToday(today, dayNo, month, year),
selectable: this.isSelectable(dayNo, month, year, false)
});
dayNo++;
}
} else {
for (var _j2 = 0; _j2 < 7; _j2++) {
if (dayNo > daysLength) {
var next = this.getNextMonthAndYear(month, year);
week.push({
day: dayNo - daysLength,
month: next.month,
year: next.year,
otherMonth: true,
today: this.isToday(today, dayNo - daysLength, next.month, next.year),
selectable: this.isSelectable(dayNo - daysLength, next.month, next.year, true)
});
} else {
week.push({
day: dayNo,
month: month,
year: year,
today: this.isToday(today, dayNo, month, year),
selectable: this.isSelectable(dayNo, month, year, false)
});
}
dayNo++;
}
}
if (this.props.showWeek) {
weekNumbers.push(this.getWeekNumber(new Date(week[0].year, week[0].month, week[0].day)));
}
dates.push(week);
}
return {
month: month,
year: year,
dates: dates,
weekNumbers: weekNumbers
};
}
}, {
key: "getWeekNumber",
value: function getWeekNumber(date) {
var checkDate = new Date(date.getTime());
checkDate.setDate(checkDate.getDate() + 4 - (checkDate.getDay() || 7));
var time = checkDate.getTime();
checkDate.setMonth(0);
checkDate.setDate(1);
return Math.floor(Math.round((time - checkDate.getTime()) / 86400000) / 7) + 1;
}
}, {
key: "isSelectable",
value: function isSelectable(day, month, year, otherMonth) {
var validMin = true;
var validMax = true;
var validDate = true;
var validDay = true;
var validMonth = true;
if (this.props.minDate) {
if (this.props.minDate.getFullYear() > year) {
validMin = false;
} else if (this.props.minDate.getFullYear() === year) {
if (this.props.minDate.getMonth() > month) {
validMin = false;
} else if (this.props.minDate.getMonth() === month) {
if (this.props.minDate.getDate() > day) {
validMin = false;
}
}
}
}
if (this.props.maxDate) {
if (this.props.maxDate.getFullYear() < year) {
validMax = false;
} else if (this.props.maxDate.getFullYear() === year) {
if (this.props.maxDate.getMonth() < month) {
validMax = false;
} else if (this.props.maxDate.getMonth() === month) {
if (this.props.maxDate.getDate() < day) {
validMax = false;
}
}
}
}
if (this.props.disabledDates) {
validDate = !this.isDateDisabled(day, month, year);
}
if (this.props.disabledDays) {
validDay = !this.isDayDisabled(day, month, year);
}
if (this.props.selectOtherMonths === false && otherMonth) {
validMonth = false;
}
return validMin && validMax && validDate && validDay && validMonth;
}
}, {
key: "isSelectableTime",
value: function isSelectableTime(value) {
var validMin = true;
var validMax = true;
if (this.props.minDate && this.props.minDate.toDateString() === value.toDateString()) {
if (this.props.minDate.getHours() > value.getHours()) {
validMin = false;
} else if (this.props.minDate.getHours() === value.getHours()) {
if (this.props.minDate.getMinutes() > value.getMinutes()) {
validMin = false;
} else if (this.props.minDate.getMinutes() === value.getMinutes()) {
if (this.props.minDate.getSeconds() > value.getSeconds()) {
validMin = false;
} else if (this.props.minDate.getSeconds() === value.getSeconds()) {
if (this.props.minDate.getMilliseconds() > value.getMilliseconds()) {
validMin = false;
}
}
}
}
}
if (this.props.maxDate && this.props.maxDate.toDateString() === value.toDateString()) {
if (this.props.maxDate.getHours() < value.getHours()) {
validMax = false;
} else if (this.props.maxDate.getHours() === value.getHours()) {
if (this.props.maxDate.getMinutes() < value.getMinutes()) {
validMax = false;
} else if (this.props.maxDate.getMinutes() === value.getMinutes()) {
if (this.props.maxDate.getSeconds() < value.getSeconds()) {
validMax = false;
} else if (this.props.maxDate.getSeconds() === value.getSeconds()) {
if (this.props.maxDate.getMilliseconds() < value.getMilliseconds()) {
validMax = false;
}
}
}
}
}
return validMin && validMax;
}
}, {
key: "isSelected",
value: function isSelected(dateMeta) {
if (this.props.value) {
if (this.isSingleSelection()) {
return this.isDateEquals(this.props.value, dateMeta);
} else if (this.isMultipleSelection()) {
var selected = false;
var _iterator = _createForOfIteratorHelper$f(this.props.value),
_step;
try {
for (_iterator.s(); !(_step = _iterator.n()).done;) {
var date = _step.value;
selected = this.isDateEquals(date, dateMeta);
if (selected) {
break;
}
}
} catch (err) {
_iterator.e(err);
} finally {
_iterator.f();
}
return selected;
} else if (this.isRangeSelection()) {
if (this.props.value[1]) return this.isDateEquals(this.props.value[0], dateMeta) || this.isDateEquals(this.props.value[1], dateMeta) || this.isDateBetween(this.props.value[0], this.props.value[1], dateMeta);else {
return this.isDateEquals(this.props.value[0], dateMeta);
}
}
} else {
return false;
}
}
}, {
key: "isMonthSelected",
value: function isMonthSelected(month) {
var viewDate = this.getViewDate();
if (this.props.value && this.props.value instanceof Date) return this.props.value.getDate() === 1 && this.props.value.getMonth() === month && this.props.value.getFullYear() === viewDate.getFullYear();else return false;
}
}, {
key: "isDateEquals",
value: function isDateEquals(value, dateMeta) {
if (value && value instanceof Date) return value.getDate() === dateMeta.day && value.getMonth() === dateMeta.month && value.getFullYear() === dateMeta.year;else return false;
}
}, {
key: "isDateBetween",
value: function isDateBetween(start, end, dateMeta) {
var between = false;
if (start && end) {
var date = new Date(dateMeta.year, dateMeta.month, dateMeta.day);
return start.getTime() <= date.getTime() && end.getTime() >= date.getTime();
}
return between;
}
}, {
key: "isSingleSelection",
value: function isSingleSelection() {
return this.props.selectionMode === 'single';
}
}, {
key: "isRangeSelection",
value: function isRangeSelection() {
return this.props.selectionMode === 'range';
}
}, {
key: "isMultipleSelection",
value: function isMultipleSelection() {
return this.props.selectionMode === 'multiple';
}
}, {
key: "isToday",
value: function isToday(today, day, month, year) {
return today.getDate() === day && today.getMonth() === month && today.getFullYear() === year;
}
}, {
key: "isDateDisabled",
value: function isDateDisabled(day, month, year) {
if (this.props.disabledDates) {
for (var i = 0; i < this.props.disabledDates.length; i++) {
var disabledDate = this.props.disabledDates[i];
if (disabledDate.getFullYear() === year && disabledDate.getMonth() === month && disabledDate.getDate() === day) {
return true;
}
}
}
return false;
}
}, {
key: "isDayDisabled",
value: function isDayDisabled(day, month, year) {
if (this.props.disabledDays) {
var weekday = new Date(year, month, day);
var weekdayNumber = weekday.getDay();
return this.props.disabledDays.indexOf(weekdayNumber) !== -1;
}
return false;
}
}, {
key: "updateInputfield",
value: function updateInputfield(value) {
if (!(this.inputRef && this.inputRef.current)) {
return;
}
var formattedValue = '';
if (value) {
try {
if (this.isSingleSelection()) {
formattedValue = this.isValidDate(value) ? this.formatDateTime(value) : '';
} else if (this.isMultipleSelection()) {
for (var i = 0; i < value.length; i++) {
var selectedValue = value[i];
var dateAsString = this.isValidDate(selectedValue) ? this.formatDateTime(selectedValue) : '';
formattedValue += dateAsString;
if (i !== value.length - 1) {
formattedValue += ', ';
}
}
} else if (this.isRangeSelection()) {
if (value && value.length) {
var startDate = value[0];
var endDate = value[1];
formattedValue = this.isValidDate(startDate) ? this.formatDateTime(startDate) : '';
if (endDate) {
formattedValue += this.isValidDate(endDate) ? ' - ' + this.formatDateTime(endDate) : '';
}
}
}
} catch (err) {
formattedValue = value;
}
}
this.inputRef.current.value = formattedValue;
}
}, {
key: "formatDateTime",
value: function formatDateTime(date) {
var formattedValue = null;
if (date) {
if (this.props.timeOnly) {
formattedValue = this.formatTime(date);
} else {
formattedValue = this.formatDate(date, this.getDateFormat());
if (this.props.showTime) {
formattedValue += ' ' + this.formatTime(date);
}
}
}
return formattedValue;
}
}, {
key: "formatDate",
value: function formatDate(date, format) {
if (!date) {
return '';
}
var iFormat;
var lookAhead = function lookAhead(match) {
var matches = iFormat + 1 < format.length && format.charAt(iFormat + 1) === match;
if (matches) {
iFormat++;
}
return matches;
},
formatNumber = function formatNumber(match, value, len) {
var num = '' + value;
if (lookAhead(match)) {
while (num.length < len) {
num = '0' + num;
}
}
return num;
},
formatName = function formatName(match, value, shortNames, longNames) {
return lookAhead(match) ? longNames[value] : shortNames[value];
};
var output = '';
var literal = false;
var _localeOptions2 = localeOptions(this.props.locale),
dayNamesShort = _localeOptions2.dayNamesShort,
dayNames = _localeOptions2.dayNames,
monthNamesShort = _localeOptions2.monthNamesShort,
monthNames = _localeOptions2.monthNames;
if (date) {
for (iFormat = 0; iFormat < format.length; iFormat++) {
if (literal) {
if (format.charAt(iFormat) === '\'' && !lookAhead('\'')) {
literal = false;
} else {
output += format.charAt(iFormat);
}
} else {
switch (format.charAt(iFormat)) {
case 'd':
output += formatNumber('d', date.getDate(), 2);
break;
case 'D':
output += formatName('D', date.getDay(), dayNamesShort, dayNames);
break;
case 'o':
output += formatNumber('o', Math.round((new Date(date.getFullYear(), date.getMonth(), date.getDate()).getTime() - new Date(date.getFullYear(), 0, 0).getTime()) / 86400000), 3);
break;
case 'm':
output += formatNumber('m', date.getMonth() + 1, 2);
break;
case 'M':
output += formatName('M', date.getMonth(), monthNamesShort, monthNames);
break;
case 'y':
output += lookAhead('y') ? date.getFullYear() : (date.getFullYear() % 100 < 10 ? '0' : '') + date.getFullYear() % 100;
break;
case '@':
output += date.getTime();
break;
case '!':
output += date.getTime() * 10000 + this.ticksTo1970;
break;
case '\'':
if (lookAhead('\'')) {
output += '\'';
} else {
literal = true;
}
break;
default:
output += format.charAt(iFormat);
}
}
}
}
return output;
}
}, {
key: "formatTime",
value: function formatTime(date) {
if (!date) {
return '';
}
var output = '';
var hours = date.getHours();
var minutes = date.getMinutes();
var seconds = date.getSeconds();
var milliseconds = date.getMilliseconds();
if (this.props.hourFormat === '12' && hours > 11 && hours !== 12) {
hours -= 12;
}
if (this.props.hourFormat === '12') {
output += hours === 0 ? 12 : hours < 10 ? '0' + hours : hours;
} else {
output += hours < 10 ? '0' + hours : hours;
}
output += ':';
output += minutes < 10 ? '0' + minutes : minutes;
if (this.props.showSeconds) {
output += ':';
output += seconds < 10 ? '0' + seconds : seconds;
}
if (this.props.showMillisec) {
output += '.';
output += milliseconds < 100 ? (milliseconds < 10 ? '00' : '0') + milliseconds : milliseconds;
}
if (this.props.hourFormat === '12') {
output += date.getHours() > 11 ? ' PM' : ' AM';
}
return output;
}
}, {
key: "parseValueFromString",
value: function parseValueFromString(text) {
if (!text || text.trim().length === 0) {
return null;
}
var value;
if (this.isSingleSelection()) {
value = this.parseDateTime(text);
} else if (this.isMultipleSelection()) {
var tokens = text.split(',');
value = [];
var _iterator2 = _createForOfIteratorHelper$f(tokens),
_step2;
try {
for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
var token = _step2.value;
value.push(this.parseDateTime(token.trim()));
}
} catch (err) {
_iterator2.e(err);
} finally {
_iterator2.f();
}
} else if (this.isRangeSelection()) {
var _tokens = text.split(' - ');
value = [];
for (var i = 0; i < _tokens.length; i++) {
value[i] = this.parseDateTime(_tokens[i].trim());
}
}
return value;
}
}, {
key: "parseDateTime",
value: function parseDateTime(text) {
var date;
var parts = text.split(' ');
if (this.props.timeOnly) {
date = new Date();
this.populateTime(date, parts[0], parts[1]);
} else {
if (this.props.showTime) {
date = this.parseDate(parts[0], this.getDateFormat());
this.populateTime(date, parts[1], parts[2]);
} else {
date = this.parseDate(text, this.getDateFormat());
}
}
return date;
}
}, {
key: "populateTime",
value: function populateTime(value, timeString, ampm) {
if (this.props.hourFormat === '12' && ampm !== 'PM' && ampm !== 'AM') {
throw new Error('Invalid Time');
}
var time = this.parseTime(timeString, ampm);
value.setHours(time.hour);
value.setMinutes(time.minute);
value.setSeconds(time.second);
value.setMilliseconds(time.millisecond);
}
}, {
key: "parseTime",
value: function parseTime(value, ampm) {
value = this.props.showMillisec ? value.replace('.', ':') : value;
var tokens = value.split(':');
var validTokenLength = this.props.showSeconds ? 3 : 2;
validTokenLength = this.props.showMillisec ? validTokenLength + 1 : validTokenLength;
if (tokens.length !== validTokenLength || tokens[0].length !== 2 || tokens[1].length !== 2 || this.props.showSeconds && tokens[2].length !== 2 || this.props.showMillisec && tokens[3].length !== 3) {
throw new Error('Invalid time');
}
var h = parseInt(tokens[0], 10);
var m = parseInt(tokens[1], 10);
var s = this.props.showSeconds ? parseInt(tokens[2], 10) : null;
var ms = this.props.showMillisec ? parseInt(tokens[3], 10) : null;
if (isNaN(h) || isNaN(m) || h > 23 || m > 59 || this.props.hourFormat === '12' && h > 12 || this.props.showSeconds && (isNaN(s) || s > 59) || this.props.showMillisec && (isNaN(s) || s > 1000)) {
throw new Error('Invalid time');
} else {
if (this.props.hourFormat === '12' && h !== 12 && ampm === 'PM') {
h += 12;
}
return {
hour: h,
minute: m,
second: s,
millisecond: ms
};
}
} // Ported from jquery-ui datepicker parseDate
}, {
key: "parseDate",
value: function parseDate(value, format) {
if (format == null || value == null) {
throw new Error('Invalid arguments');
}
value = _typeof(value) === "object" ? value.toString() : value + "";
if (value === "") {
return null;
}
var iFormat,
dim,
extra,
iValue = 0,
shortYearCutoff = typeof this.props.shortYearCutoff !== "string" ? this.props.shortYearCutoff : new Date().getFullYear() % 100 + parseInt(this.props.shortYearCutoff, 10),
year = -1,
month = -1,
day = -1,
doy = -1,
literal = false,
date,
lookAhead = function lookAhead(match) {
var matches = iFormat + 1 < format.length && format.charAt(iFormat + 1) === match;
if (matches) {
iFormat++;
}
return matches;
},
getNumber = function getNumber(match) {
var isDoubled = lookAhead(match),
size = match === "@" ? 14 : match === "!" ? 20 : match === "y" && isDoubled ? 4 : match === "o" ? 3 : 2,
minSize = match === "y" ? size : 1,
digits = new RegExp("^\\d{" + minSize + "," + size + "}"),
num = value.substring(iValue).match(digits);
if (!num) {
throw new Error('Missing number at position ' + iValue);
}
iValue += num[0].length;
return parseInt(num[0], 10);
},
getName = function getName(match, shortNames, longNames) {
var index = -1;
var arr = lookAhead(match) ? longNames : shortNames;
var names = [];
for (var i = 0; i < arr.length; i++) {
names.push([i, arr[i]]);
}
names.sort(function (a, b) {
return -(a[1].length - b[1].length);
});
for (var _i = 0; _i < names.length; _i++) {
var name = names[_i][1];
if (value.substr(iValue, name.length).toLowerCase() === name.toLowerCase()) {
index = names[_i][0];
iValue += name.length;
break;
}
}
if (index !== -1) {
return index + 1;
} else {
throw new Error('Unknown name at position ' + iValue);
}
},
checkLiteral = function checkLiteral() {
if (value.charAt(iValue) !== format.charAt(iFormat)) {
throw new Error('Unexpected literal at position ' + iValue);
}
iValue++;
};
if (this.props.view === 'month') {
day = 1;
}
var _localeOptions3 = localeOptions(this.props.locale),
dayNamesShort = _localeOptions3.dayNamesShort,
dayNames = _localeOptions3.dayNames,
monthNamesShort = _localeOptions3.monthNamesShort,
monthNames = _localeOptions3.monthNames;
for (iFormat = 0; iFormat < format.length; iFormat++) {
if (literal) {
if (format.charAt(iFormat) === "'" && !lookAhead("'")) {
literal = false;
} else {
checkLiteral();
}
} else {
switch (format.charAt(iFormat)) {
case "d":
day = getNumber("d");
break;
case "D":
getName("D", dayNamesShort, dayNames);
break;
case "o":
doy = getNumber("o");
break;
case "m":
month = getNumber("m");
break;
case "M":
month = getName("M", monthNamesShort, monthNames);
break;
case "y":
year = getNumber("y");
break;
case "@":
date = new Date(getNumber("@"));
year = date.getFullYear();
month = date.getMonth() + 1;
day = date.getDate();
break;
case "!":
date = new Date((getNumber("!") - this.ticksTo1970) / 10000);
year = date.getFullYear();
month = date.getMonth() + 1;
day = date.getDate();
break;
case "'":
if (lookAhead("'")) {
checkLiteral();
} else {
literal = true;
}
break;
default:
checkLiteral();
}
}
}
if (iValue < value.length) {
extra = value.substr(iValue);
if (!/^\s+/.test(extra)) {
throw new Error('Extra/unparsed characters found in date: ' + extra);
}
}
if (year === -1) {
year = new Date().getFullYear();
} else if (year < 100) {
year += new Date().getFullYear() - new Date().getFullYear() % 100 + (year <= shortYearCutoff ? 0 : -100);
}
if (doy > -1) {
month = 1;
day = doy;
do {
dim = this.getDaysCountInMonth(year, month - 1);
if (day <= dim) {
break;
}
month++;
day -= dim;
} while (true);
}
date = this.daylightSavingAdjust(new Date(year, month - 1, day));
if (date.getFullYear() !== year || date.getMonth() + 1 !== month || date.getDate() !== day) {
throw new Error('Invalid date'); // E.g. 31/02/00
}
return date;
}
}, {
key: "renderBackwardNavigator",
value: function renderBackwardNavigator(isVisible) {
var _this16 = this;
var navigatorProps = isVisible ? {
'onClick': this.onPrevButtonClick,
'onKeyDown': function onKeyDown(e) {
return _this16.onContainerButtonKeydown(e);
}
} : {
'style': {
visibility: 'hidden'
}
};
return /*#__PURE__*/React__default["default"].createElement("button", _extends({
type: "button",
className: "p-datepicker-prev p-link"
}, navigatorProps), /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-datepicker-prev-icon pi pi-chevron-left"
}), /*#__PURE__*/React__default["default"].createElement(Ripple, null));
}
}, {
key: "renderForwardNavigator",
value: function renderForwardNavigator(isVisible) {
var _this17 = this;
var navigatorProps = isVisible ? {
'onClick': this.onNextButtonClick,
'onKeyDown': function onKeyDown(e) {
return _this17.onContainerButtonKeydown(e);
}
} : {
'style': {
visibility: 'hidden'
}
};
return /*#__PURE__*/React__default["default"].createElement("button", _extends({
type: "button",
className: "p-datepicker-next p-link"
}, navigatorProps), /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-datepicker-next-icon pi pi-chevron-right"
}), /*#__PURE__*/React__default["default"].createElement(Ripple, null));
}
}, {
key: "isInMinYear",
value: function isInMinYear(viewDate) {
return this.props.minDate && this.props.minDate.getFullYear() === viewDate.getFullYear();
}
}, {
key: "isInMaxYear",
value: function isInMaxYear(viewDate) {
return this.props.maxDate && this.props.maxDate.getFullYear() === viewDate.getFullYear();
}
}, {
key: "renderTitleMonthElement",
value: function renderTitleMonthElement(month) {
var _this18 = this;
var monthNames = localeOption('monthNames', this.props.locale);
if (this.props.monthNavigator && this.props.view !== 'month') {
var viewDate = this.getViewDate();
var viewMonth = viewDate.getMonth();
var displayedMonthOptions = monthNames.map(function (month, index) {
return (!_this18.isInMinYear(viewDate) || index >= _this18.props.minDate.getMonth()) && (!_this18.isInMaxYear(viewDate) || index <= _this18.props.maxDate.getMonth()) ? {
label: month,
value: index,
index: index
} : null;
}).filter(function (option) {
return !!option;
});
var displayedMonthNames = displayedMonthOptions.map(function (option) {
return option.label;
});
var content = /*#__PURE__*/React__default["default"].createElement("select", {
className: "p-datepicker-month",
onChange: function onChange(e) {
return _this18.onMonthDropdownChange(e, e.target.value);
},
value: viewMonth
}, displayedMonthOptions.map(function (option) {
return /*#__PURE__*/React__default["default"].createElement("option", {
key: option.label,
value: option.value
}, option.label);
}));
if (this.props.monthNavigatorTemplate) {
var defaultContentOptions = {
onChange: this.onMonthDropdownChange,
className: 'p-datepicker-month',
value: viewMonth,
names: displayedMonthNames,
options: displayedMonthOptions,
element: content,
props: this.props
};
return ObjectUtils.getJSXElement(this.props.monthNavigatorTemplate, defaultContentOptions);
}
return content;
} else {
return /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-datepicker-month"
}, monthNames[month]);
}
}
}, {
key: "renderTitleYearElement",
value: function renderTitleYearElement(year) {
var _this19 = this;
if (this.props.yearNavigator) {
var yearOptions = [];
var years = this.props.yearRange.split(':');
var yearStart = parseInt(years[0], 10);
var yearEnd = parseInt(years[1], 10);
for (var i = yearStart; i <= yearEnd; i++) {
yearOptions.push(i);
}
var viewDate = this.getViewDate();
var viewYear = viewDate.getFullYear();
var displayedYearNames = yearOptions.filter(function (year) {
return !(_this19.props.minDate && _this19.props.minDate.getFullYear() > year) && !(_this19.props.maxDate && _this19.props.maxDate.getFullYear() < year);
});
var content = /*#__PURE__*/React__default["default"].createElement("select", {
className: "p-datepicker-year",
onChange: function onChange(e) {
return _this19.onYearDropdownChange(e, e.target.value);
},
value: viewYear
}, displayedYearNames.map(function (year) {
return /*#__PURE__*/React__default["default"].createElement("option", {
key: year,
value: year
}, year);
}));
if (this.props.yearNavigatorTemplate) {
var options = displayedYearNames.map(function (name, i) {
return {
label: name,
value: name,
index: i
};
});
var defaultContentOptions = {
onChange: this.onYearDropdownChange,
className: 'p-datepicker-year',
value: viewYear,
names: displayedYearNames,
options: options,
element: content,
props: this.props
};
return ObjectUtils.getJSXElement(this.props.yearNavigatorTemplate, defaultContentOptions);
}
return content;
} else {
return /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-datepicker-year"
}, year);
}
}
}, {
key: "renderTitle",
value: function renderTitle(monthMetaData) {
var month = this.renderTitleMonthElement(monthMetaData.month);
var year = this.renderTitleYearElement(monthMetaData.year);
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-datepicker-title"
}, month, year);
}
}, {
key: "renderDayNames",
value: function renderDayNames(weekDays) {
var dayNames = weekDays.map(function (weekDay, index) {
return /*#__PURE__*/React__default["default"].createElement("th", {
key: "".concat(weekDay, "-").concat(index),
scope: "col"
}, /*#__PURE__*/React__default["default"].createElement("span", null, weekDay));
});
if (this.props.showWeek) {
var weekHeader = /*#__PURE__*/React__default["default"].createElement("th", {
scope: "col",
key: 'wn',
className: "p-datepicker-weekheader p-disabled"
}, /*#__PURE__*/React__default["default"].createElement("span", null, localeOption('weekHeader', this.props.locale)));
return [weekHeader].concat(_toConsumableArray(dayNames));
} else {
return dayNames;
}
}
}, {
key: "renderDateCellContent",
value: function renderDateCellContent(date, className, groupIndex) {
var _this20 = this;
var content = this.props.dateTemplate ? this.props.dateTemplate(date) : date.day;
return /*#__PURE__*/React__default["default"].createElement("span", {
className: className,
onClick: function onClick(e) {
return _this20.onDateSelect(e, date);
},
onKeyDown: function onKeyDown(e) {
return _this20.onDateCellKeydown(e, date, groupIndex);
}
}, content, /*#__PURE__*/React__default["default"].createElement(Ripple, null));
}
}, {
key: "renderWeek",
value: function renderWeek(weekDates, weekNumber, groupIndex) {
var _this21 = this;
var week = weekDates.map(function (date) {
var selected = _this21.isSelected(date);
var cellClassName = classNames({
'p-datepicker-other-month': date.otherMonth,
'p-datepicker-today': date.today
});
var dateClassName = classNames({
'p-highlight': selected,
'p-disabled': !date.selectable
});
var content = date.otherMonth && !_this21.props.showOtherMonths ? null : _this21.renderDateCellContent(date, dateClassName, groupIndex);
return /*#__PURE__*/React__default["default"].createElement("td", {
key: date.day,
className: cellClassName
}, content);
});
if (this.props.showWeek) {
var weekNumberCell = /*#__PURE__*/React__default["default"].createElement("td", {
key: 'wn' + weekNumber,
className: "p-datepicker-weeknumber"
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-disabled"
}, weekNumber));
return [weekNumberCell].concat(_toConsumableArray(week));
} else {
return week;
}
}
}, {
key: "renderDates",
value: function renderDates(monthMetaData, groupIndex) {
var _this22 = this;
return monthMetaData.dates.map(function (weekDates, index) {
return /*#__PURE__*/React__default["default"].createElement("tr", {
key: index
}, _this22.renderWeek(weekDates, monthMetaData.weekNumbers[index], groupIndex));
});
}
}, {
key: "renderDateViewGrid",
value: function renderDateViewGrid(monthMetaData, weekDays, groupIndex) {
var dayNames = this.renderDayNames(weekDays);
var dates = this.renderDates(monthMetaData, groupIndex);
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-datepicker-calendar-container"
}, /*#__PURE__*/React__default["default"].createElement("table", {
className: "p-datepicker-calendar"
}, /*#__PURE__*/React__default["default"].createElement("thead", null, /*#__PURE__*/React__default["default"].createElement("tr", null, dayNames)), /*#__PURE__*/React__default["default"].createElement("tbody", null, dates)));
}
}, {
key: "renderMonth",
value: function renderMonth(monthMetaData, index) {
var weekDays = this.createWeekDays();
var backwardNavigator = this.renderBackwardNavigator(index === 0);
var forwardNavigator = this.renderForwardNavigator(this.props.numberOfMonths === 1 || index === this.props.numberOfMonths - 1);
var title = this.renderTitle(monthMetaData);
var dateViewGrid = this.renderDateViewGrid(monthMetaData, weekDays, index);
var header = this.props.headerTemplate ? this.props.headerTemplate() : null;
return /*#__PURE__*/React__default["default"].createElement("div", {
key: monthMetaData.month,
className: "p-datepicker-group"
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-datepicker-header"
}, header, backwardNavigator, title, forwardNavigator), dateViewGrid);
}
}, {
key: "renderMonths",
value: function renderMonths(monthsMetaData) {
var _this23 = this;
var groups = monthsMetaData.map(function (monthMetaData, index) {
return _this23.renderMonth(monthMetaData, index);
});
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-datepicker-group-container"
}, groups);
}
}, {
key: "renderDateView",
value: function renderDateView() {
var viewDate = this.getViewDate();
var monthsMetaData = this.createMonths(viewDate.getMonth(), viewDate.getFullYear());
var months = this.renderMonths(monthsMetaData);
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, months);
}
}, {
key: "renderMonthViewMonth",
value: function renderMonthViewMonth(index) {
var _this24 = this;
var className = classNames('p-monthpicker-month', {
'p-highlight': this.isMonthSelected(index)
});
var monthNamesShort = localeOption('monthNamesShort', this.props.locale);
var monthName = monthNamesShort[index];
return /*#__PURE__*/React__default["default"].createElement("span", {
key: monthName,
className: className,
onClick: function onClick(event) {
return _this24.onMonthSelect(event, index);
},
onKeyDown: function onKeyDown(event) {
return _this24.onMonthCellKeydown(event, index);
}
}, monthName, /*#__PURE__*/React__default["default"].createElement(Ripple, null));
}
}, {
key: "renderMonthViewMonths",
value: function renderMonthViewMonths() {
var months = [];
for (var i = 0; i <= 11; i++) {
months.push(this.renderMonthViewMonth(i));
}
return months;
}
}, {
key: "renderMonthView",
value: function renderMonthView() {
var backwardNavigator = this.renderBackwardNavigator(true);
var forwardNavigator = this.renderForwardNavigator(true);
var yearElement = this.renderTitleYearElement(this.getViewDate().getFullYear());
var months = this.renderMonthViewMonths();
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-datepicker-group-container"
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-datepicker-group"
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-datepicker-header"
}, backwardNavigator, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-datepicker-title"
}, yearElement), forwardNavigator))), /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-monthpicker"
}, months));
}
}, {
key: "renderDatePicker",
value: function renderDatePicker() {
if (!this.props.timeOnly) {
if (this.props.view === 'date') {
return this.renderDateView();
} else if (this.props.view === 'month') {
return this.renderMonthView();
} else {
return null;
}
}
}
}, {
key: "renderHourPicker",
value: function renderHourPicker() {
var _this25 = this;
var currentTime = this.getCurrentDateTime();
var hour = currentTime.getHours();
if (this.props.hourFormat === '12') {
if (hour === 0) hour = 12;else if (hour > 11 && hour !== 12) hour = hour - 12;
}
var hourDisplay = hour < 10 ? '0' + hour : hour;
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-hour-picker"
}, /*#__PURE__*/React__default["default"].createElement("button", {
type: "button",
className: "p-link",
onMouseDown: function onMouseDown(e) {
return _this25.onTimePickerElementMouseDown(e, 0, 1);
},
onMouseUp: this.onTimePickerElementMouseUp,
onMouseLeave: this.onTimePickerElementMouseLeave,
onKeyDown: function onKeyDown(e) {
return _this25.onContainerButtonKeydown(e);
}
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: "pi pi-chevron-up"
}), /*#__PURE__*/React__default["default"].createElement(Ripple, null)), /*#__PURE__*/React__default["default"].createElement("span", null, hourDisplay), /*#__PURE__*/React__default["default"].createElement("button", {
type: "button",
className: "p-link",
onMouseDown: function onMouseDown(e) {
return _this25.onTimePickerElementMouseDown(e, 0, -1);
},
onMouseUp: this.onTimePickerElementMouseUp,
onMouseLeave: this.onTimePickerElementMouseLeave,
onKeyDown: function onKeyDown(e) {
return _this25.onContainerButtonKeydown(e);
}
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: "pi pi-chevron-down"
}), /*#__PURE__*/React__default["default"].createElement(Ripple, null)));
}
}, {
key: "renderMinutePicker",
value: function renderMinutePicker() {
var _this26 = this;
var currentTime = this.getCurrentDateTime();
var minute = currentTime.getMinutes();
var minuteDisplay = minute < 10 ? '0' + minute : minute;
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-minute-picker"
}, /*#__PURE__*/React__default["default"].createElement("button", {
type: "button",
className: "p-link",
onMouseDown: function onMouseDown(e) {
return _this26.onTimePickerElementMouseDown(e, 1, 1);
},
onMouseUp: this.onTimePickerElementMouseUp,
onMouseLeave: this.onTimePickerElementMouseLeave,
onKeyDown: function onKeyDown(e) {
return _this26.onContainerButtonKeydown(e);
}
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: "pi pi-chevron-up"
}), /*#__PURE__*/React__default["default"].createElement(Ripple, null)), /*#__PURE__*/React__default["default"].createElement("span", null, minuteDisplay), /*#__PURE__*/React__default["default"].createElement("button", {
type: "button",
className: "p-link",
onMouseDown: function onMouseDown(e) {
return _this26.onTimePickerElementMouseDown(e, 1, -1);
},
onMouseUp: this.onTimePickerElementMouseUp,
onMouseLeave: this.onTimePickerElementMouseLeave,
onKeyDown: function onKeyDown(e) {
return _this26.onContainerButtonKeydown(e);
}
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: "pi pi-chevron-down"
}), /*#__PURE__*/React__default["default"].createElement(Ripple, null)));
}
}, {
key: "renderSecondPicker",
value: function renderSecondPicker() {
var _this27 = this;
if (this.props.showSeconds) {
var currentTime = this.getCurrentDateTime();
var second = currentTime.getSeconds();
var secondDisplay = second < 10 ? '0' + second : second;
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-second-picker"
}, /*#__PURE__*/React__default["default"].createElement("button", {
type: "button",
className: "p-link",
onMouseDown: function onMouseDown(e) {
return _this27.onTimePickerElementMouseDown(e, 2, 1);
},
onMouseUp: this.onTimePickerElementMouseUp,
onMouseLeave: this.onTimePickerElementMouseLeave,
onKeyDown: function onKeyDown(e) {
return _this27.onContainerButtonKeydown(e);
}
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: "pi pi-chevron-up"
}), /*#__PURE__*/React__default["default"].createElement(Ripple, null)), /*#__PURE__*/React__default["default"].createElement("span", null, secondDisplay), /*#__PURE__*/React__default["default"].createElement("button", {
type: "button",
className: "p-link",
onMouseDown: function onMouseDown(e) {
return _this27.onTimePickerElementMouseDown(e, 2, -1);
},
onMouseUp: this.onTimePickerElementMouseUp,
onMouseLeave: this.onTimePickerElementMouseLeave,
onKeyDown: function onKeyDown(e) {
return _this27.onContainerButtonKeydown(e);
}
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: "pi pi-chevron-down"
}), /*#__PURE__*/React__default["default"].createElement(Ripple, null)));
}
return null;
}
}, {
key: "renderMiliSecondPicker",
value: function renderMiliSecondPicker() {
var _this28 = this;
if (this.props.showMillisec) {
var currentTime = this.getCurrentDateTime();
var millisecond = currentTime.getMilliseconds();
var millisecondDisplay = millisecond < 100 ? (millisecond < 10 ? '00' : '0') + millisecond : millisecond;
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-millisecond-picker"
}, /*#__PURE__*/React__default["default"].createElement("button", {
type: "button",
className: "p-link",
onMouseDown: function onMouseDown(e) {
return _this28.onTimePickerElementMouseDown(e, 3, 1);
},
onMouseUp: this.onTimePickerElementMouseUp,
onMouseLeave: this.onTimePickerElementMouseLeave,
onKeyDown: function onKeyDown(e) {
return _this28.onContainerButtonKeydown(e);
}
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: "pi pi-chevron-up"
}), /*#__PURE__*/React__default["default"].createElement(Ripple, null)), /*#__PURE__*/React__default["default"].createElement("span", null, millisecondDisplay), /*#__PURE__*/React__default["default"].createElement("button", {
type: "button",
className: "p-link",
onMouseDown: function onMouseDown(e) {
return _this28.onTimePickerElementMouseDown(e, 3, -1);
},
onMouseUp: this.onTimePickerElementMouseUp,
onMouseLeave: this.onTimePickerElementMouseLeave,
onKeyDown: function onKeyDown(e) {
return _this28.onContainerButtonKeydown(e);
}
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: "pi pi-chevron-down"
}), /*#__PURE__*/React__default["default"].createElement(Ripple, null)));
}
return null;
}
}, {
key: "renderAmPmPicker",
value: function renderAmPmPicker() {
if (this.props.hourFormat === '12') {
var currentTime = this.getCurrentDateTime();
var hour = currentTime.getHours();
var display = hour > 11 ? 'PM' : 'AM';
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-ampm-picker"
}, /*#__PURE__*/React__default["default"].createElement("button", {
type: "button",
className: "p-link",
onClick: this.toggleAmPm
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: "pi pi-chevron-up"
}), /*#__PURE__*/React__default["default"].createElement(Ripple, null)), /*#__PURE__*/React__default["default"].createElement("span", null, display), /*#__PURE__*/React__default["default"].createElement("button", {
type: "button",
className: "p-link",
onClick: this.toggleAmPm
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: "pi pi-chevron-down"
}), /*#__PURE__*/React__default["default"].createElement(Ripple, null)));
}
return null;
}
}, {
key: "renderSeparator",
value: function renderSeparator(separator) {
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-separator"
}, /*#__PURE__*/React__default["default"].createElement("span", null, separator));
}
}, {
key: "renderTimePicker",
value: function renderTimePicker() {
if (this.props.showTime || this.props.timeOnly) {
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-timepicker"
}, this.renderHourPicker(), this.renderSeparator(':'), this.renderMinutePicker(), this.props.showSeconds && this.renderSeparator(':'), this.renderSecondPicker(), this.props.showMillisec && this.renderSeparator('.'), this.renderMiliSecondPicker(), this.props.hourFormat === '12' && this.renderSeparator(':'), this.renderAmPmPicker());
}
return null;
}
}, {
key: "renderInputElement",
value: function renderInputElement() {
if (!this.props.inline) {
return /*#__PURE__*/React__default["default"].createElement(InputText, {
ref: this.inputRef,
id: this.props.inputId,
name: this.props.name,
type: "text",
className: this.props.inputClassName,
style: this.props.inputStyle,
readOnly: this.props.readOnlyInput,
disabled: this.props.disabled,
required: this.props.required,
autoComplete: "off",
placeholder: this.props.placeholder,
tabIndex: this.props.tabIndex,
onInput: this.onUserInput,
onFocus: this.onInputFocus,
onBlur: this.onInputBlur,
onKeyDown: this.onInputKeyDown,
"aria-labelledby": this.props.ariaLabelledBy,
inputMode: this.props.inputMode
});
}
return null;
}
}, {
key: "renderButton",
value: function renderButton() {
if (this.props.showIcon) {
return /*#__PURE__*/React__default["default"].createElement(Button, {
type: "button",
icon: this.props.icon,
onClick: this.onButtonClick,
tabIndex: "-1",
disabled: this.props.disabled,
className: "p-datepicker-trigger"
});
}
return null;
}
}, {
key: "renderContent",
value: function renderContent() {
var input = this.renderInputElement();
var button = this.renderButton();
if (this.props.iconPos === 'left') {
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, button, input);
}
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, input, button);
}
}, {
key: "renderButtonBar",
value: function renderButtonBar() {
var _this29 = this;
if (this.props.showButtonBar) {
var todayClassName = classNames('p-button-text', this.props.todayButtonClassName);
var clearClassName = classNames('p-button-text', this.props.clearButtonClassName);
var _localeOptions4 = localeOptions(this.props.locale),
today = _localeOptions4.today,
clear = _localeOptions4.clear;
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-datepicker-buttonbar"
}, /*#__PURE__*/React__default["default"].createElement(Button, {
type: "button",
label: today,
onClick: this.onTodayButtonClick,
onKeyDown: function onKeyDown(e) {
return _this29.onContainerButtonKeydown(e);
},
className: todayClassName
}), /*#__PURE__*/React__default["default"].createElement(Button, {
type: "button",
label: clear,
onClick: this.onClearButtonClick,
onKeyDown: function onKeyDown(e) {
return _this29.onContainerButtonKeydown(e);
},
className: clearClassName
}));
}
return null;
}
}, {
key: "renderFooter",
value: function renderFooter() {
if (this.props.footerTemplate) {
var content = this.props.footerTemplate();
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-datepicker-footer"
}, content);
}
return null;
}
}, {
key: "render",
value: function render() {
var _classNames,
_this30 = this;
var className = classNames('p-calendar p-component p-inputwrapper', this.props.className, (_classNames = {}, _defineProperty(_classNames, "p-calendar-w-btn p-calendar-w-btn-".concat(this.props.iconPos), this.props.showIcon), _defineProperty(_classNames, 'p-calendar-disabled', this.props.disabled), _defineProperty(_classNames, 'p-calendar-timeonly', this.props.timeOnly), _defineProperty(_classNames, 'p-inputwrapper-filled', this.props.value || DomHandler.hasClass(this.inputRef.current, 'p-filled') && this.inputRef.current.value !== ''), _defineProperty(_classNames, 'p-inputwrapper-focus', this.state.focused), _classNames));
var panelClassName = classNames('p-datepicker p-component', this.props.panelClassName, {
'p-datepicker-inline': this.props.inline,
'p-disabled': this.props.disabled,
'p-datepicker-timeonly': this.props.timeOnly,
'p-datepicker-multiple-month': this.props.numberOfMonths > 1,
'p-datepicker-monthpicker': this.props.view === 'month',
'p-datepicker-touch-ui': this.props.touchUI
});
var content = this.renderContent();
var datePicker = this.renderDatePicker();
var timePicker = this.renderTimePicker();
var buttonBar = this.renderButtonBar();
var footer = this.renderFooter();
var isVisible = this.props.inline || this.isVisible();
return /*#__PURE__*/React__default["default"].createElement("span", {
ref: function ref(el) {
return _this30.container = el;
},
id: this.props.id,
className: className,
style: this.props.style
}, content, /*#__PURE__*/React__default["default"].createElement(CalendarPanel, {
ref: this.overlayRef,
className: panelClassName,
style: this.props.panelStyle,
appendTo: this.props.appendTo,
inline: this.props.inline,
onClick: this.onPanelClick,
onMouseUp: this.onPanelMouseUp,
"in": isVisible,
onEnter: this.onOverlayEnter,
onEntered: this.onOverlayEntered,
onExit: this.onOverlayExit,
onExited: this.onOverlayExited,
transitionOptions: this.props.transitionOptions
}, datePicker, timePicker, buttonBar, footer));
}
}]);
return Calendar;
}(React.Component);
_defineProperty(Calendar, "defaultProps", {
id: null,
inputRef: null,
name: null,
value: null,
visible: false,
viewDate: null,
style: null,
className: null,
inline: false,
selectionMode: 'single',
inputId: null,
inputStyle: null,
inputClassName: null,
inputMode: 'none',
required: false,
readOnlyInput: false,
keepInvalid: false,
mask: null,
disabled: false,
tabIndex: null,
placeholder: null,
showIcon: false,
icon: 'pi pi-calendar',
iconPos: 'right',
showOnFocus: true,
numberOfMonths: 1,
view: 'date',
touchUI: false,
showTime: false,
timeOnly: false,
showSeconds: false,
showMillisec: false,
hourFormat: '24',
stepHour: 1,
stepMinute: 1,
stepSecond: 1,
stepMillisec: 1,
shortYearCutoff: '+10',
hideOnDateTimeSelect: false,
showWeek: false,
locale: null,
dateFormat: null,
panelStyle: null,
panelClassName: null,
monthNavigator: false,
yearNavigator: false,
yearRange: null,
disabledDates: null,
disabledDays: null,
minDate: null,
maxDate: null,
maxDateCount: null,
showOtherMonths: true,
selectOtherMonths: false,
showButtonBar: false,
todayButtonClassName: 'p-button-secondary',
clearButtonClassName: 'p-button-secondary',
autoZIndex: true,
baseZIndex: 0,
appendTo: null,
tooltip: null,
tooltipOptions: null,
ariaLabelledBy: null,
dateTemplate: null,
headerTemplate: null,
footerTemplate: null,
monthNavigatorTemplate: null,
yearNavigatorTemplate: null,
transitionOptions: null,
onVisibleChange: null,
onFocus: null,
onBlur: null,
onInput: null,
onSelect: null,
onChange: null,
onViewDateChange: null,
onTodayButtonClick: null,
onClearButtonClick: null,
onShow: null,
onHide: null
});
function _createSuper$25(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$25(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$25() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var Captcha = /*#__PURE__*/function (_Component) {
_inherits(Captcha, _Component);
var _super = _createSuper$25(Captcha);
function Captcha() {
_classCallCheck(this, Captcha);
return _super.apply(this, arguments);
}
_createClass(Captcha, [{
key: "init",
value: function init() {
var _this = this;
this._instance = window.grecaptcha.render(this.targetEL, {
'sitekey': this.props.siteKey,
'theme': this.props.theme,
'type': this.props.type,
'size': this.props.size,
'tabindex': this.props.tabIndex,
'hl': this.props.language,
'callback': function callback(response) {
_this.recaptchaCallback(response);
},
'expired-callback': function expiredCallback() {
_this.recaptchaExpiredCallback();
}
});
}
}, {
key: "reset",
value: function reset() {
if (this._instance === null) return;
window.grecaptcha.reset(this._instance);
}
}, {
key: "getResponse",
value: function getResponse() {
if (this._instance === null) return null;
return window.grecaptcha.getResponse(this._instance);
}
}, {
key: "recaptchaCallback",
value: function recaptchaCallback(response) {
if (this.props.onResponse) {
this.props.onResponse({
response: response
});
}
}
}, {
key: "recaptchaExpiredCallback",
value: function recaptchaExpiredCallback() {
if (this.props.onExpire) {
this.props.onExpire();
}
}
}, {
key: "addRecaptchaScript",
value: function addRecaptchaScript() {
var _this2 = this;
this.recaptchaScript = null;
if (!window.grecaptcha) {
var head = document.head || document.getElementsByTagName('head')[0];
this.recaptchaScript = document.createElement('script');
this.recaptchaScript.src = "https://www.google.com/recaptcha/api.js?render=explicit";
this.recaptchaScript.async = true;
this.recaptchaScript.defer = true;
this.recaptchaScript.onload = function () {
if (!window.grecaptcha) {
console.warn("Recaptcha is not loaded");
return;
}
window.grecaptcha.ready(function () {
_this2.init();
});
};
head.appendChild(this.recaptchaScript);
}
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
this.addRecaptchaScript();
if (window.grecaptcha) {
this.init();
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
if (this.recaptchaScript) {
this.recaptchaScript.parentNode.removeChild(this.recaptchaScript);
}
}
}, {
key: "render",
value: function render() {
var _this3 = this;
return /*#__PURE__*/React__default["default"].createElement("div", {
id: this.props.id,
ref: function ref(el) {
return _this3.targetEL = el;
}
});
}
}]);
return Captcha;
}(React.Component);
_defineProperty(Captcha, "defaultProps", {
id: null,
siteKey: null,
theme: "light",
type: "image",
size: "normal",
tabIndex: 0,
language: "en",
onResponse: null,
onExpire: null
});
function _createSuper$24(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$24(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$24() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var Card = /*#__PURE__*/function (_Component) {
_inherits(Card, _Component);
var _super = _createSuper$24(Card);
function Card() {
_classCallCheck(this, Card);
return _super.apply(this, arguments);
}
_createClass(Card, [{
key: "renderHeader",
value: function renderHeader() {
if (this.props.header) {
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-card-header"
}, ObjectUtils.getJSXElement(this.props.header, this.props));
}
return null;
}
}, {
key: "renderBody",
value: function renderBody() {
var title = this.props.title && /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-card-title"
}, ObjectUtils.getJSXElement(this.props.title, this.props));
var subTitle = this.props.subTitle && /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-card-subtitle"
}, ObjectUtils.getJSXElement(this.props.subTitle, this.props));
var children = this.props.children && /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-card-content"
}, this.props.children);
var footer = this.props.footer && /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-card-footer"
}, ObjectUtils.getJSXElement(this.props.footer, this.props));
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-card-body"
}, title, subTitle, children, footer);
}
}, {
key: "render",
value: function render() {
var header = this.renderHeader();
var body = this.renderBody();
var className = classNames('p-card p-component', this.props.className);
return /*#__PURE__*/React__default["default"].createElement("div", {
className: className,
style: this.props.style,
id: this.props.id
}, header, body);
}
}]);
return Card;
}(React.Component);
_defineProperty(Card, "defaultProps", {
id: null,
header: null,
footer: null,
title: null,
subTitle: null,
style: null,
className: null
});
function ownKeys$J(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$J(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$J(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$J(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createSuper$23(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$23(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$23() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var CarouselItem = /*#__PURE__*/function (_Component) {
_inherits(CarouselItem, _Component);
var _super = _createSuper$23(CarouselItem);
function CarouselItem() {
_classCallCheck(this, CarouselItem);
return _super.apply(this, arguments);
}
_createClass(CarouselItem, [{
key: "render",
value: function render() {
var content = this.props.template(this.props.item);
var itemClassName = classNames(this.props.className, 'p-carousel-item', {
'p-carousel-item-active': this.props.active,
'p-carousel-item-start': this.props.start,
'p-carousel-item-end': this.props.end
});
return /*#__PURE__*/React__default["default"].createElement("div", {
className: itemClassName
}, content);
}
}]);
return CarouselItem;
}(React.Component);
_defineProperty(CarouselItem, "defaultProps", {
template: null,
item: null,
active: false,
start: false,
end: false,
className: null
});
var Carousel = /*#__PURE__*/function (_Component2) {
_inherits(Carousel, _Component2);
var _super2 = _createSuper$23(Carousel);
function Carousel(props) {
var _this;
_classCallCheck(this, Carousel);
_this = _super2.call(this, props);
_this.state = {
numVisible: props.numVisible,
numScroll: props.numScroll,
totalShiftedItems: props.page * props.numScroll * -1
};
if (!_this.props.onPageChange) {
_this.state = _objectSpread$J(_objectSpread$J({}, _this.state), {}, {
page: props.page
});
}
_this.navBackward = _this.navBackward.bind(_assertThisInitialized(_this));
_this.navForward = _this.navForward.bind(_assertThisInitialized(_this));
_this.onTransitionEnd = _this.onTransitionEnd.bind(_assertThisInitialized(_this));
_this.onTouchStart = _this.onTouchStart.bind(_assertThisInitialized(_this));
_this.onTouchMove = _this.onTouchMove.bind(_assertThisInitialized(_this));
_this.onTouchEnd = _this.onTouchEnd.bind(_assertThisInitialized(_this));
_this.totalIndicators = 0;
_this.remainingItems = 0;
_this.allowAutoplay = !!_this.props.autoplayInterval;
_this.circular = _this.props.circular || _this.allowAutoplay;
_this.attributeSelector = UniqueComponentId();
_this.swipeThreshold = 20;
return _this;
}
_createClass(Carousel, [{
key: "step",
value: function step(dir, page) {
var totalShiftedItems = this.state.totalShiftedItems;
var isCircular = this.isCircular();
if (page != null) {
totalShiftedItems = this.state.numScroll * page * -1;
if (isCircular) {
totalShiftedItems -= this.state.numVisible;
}
this.isRemainingItemsAdded = false;
} else {
totalShiftedItems += this.state.numScroll * dir;
if (this.isRemainingItemsAdded) {
totalShiftedItems += this.remainingItems - this.state.numScroll * dir;
this.isRemainingItemsAdded = false;
}
var originalShiftedItems = isCircular ? totalShiftedItems + this.state.numVisible : totalShiftedItems;
page = Math.abs(Math.floor(originalShiftedItems / this.state.numScroll));
}
if (isCircular && this.state.page === this.totalIndicators - 1 && dir === -1) {
totalShiftedItems = -1 * (this.props.value.length + this.state.numVisible);
page = 0;
} else if (isCircular && this.state.page === 0 && dir === 1) {
totalShiftedItems = 0;
page = this.totalIndicators - 1;
} else if (page === this.totalIndicators - 1 && this.remainingItems > 0) {
totalShiftedItems += this.remainingItems * -1 - this.state.numScroll * dir;
this.isRemainingItemsAdded = true;
}
if (this.itemsContainer) {
DomHandler.removeClass(this.itemsContainer, 'p-items-hidden');
this.changePosition(totalShiftedItems);
this.itemsContainer.style.transition = 'transform 500ms ease 0s';
}
if (this.props.onPageChange) {
this.setState({
totalShiftedItems: totalShiftedItems
});
this.props.onPageChange({
page: page
});
} else {
this.setState({
page: page,
totalShiftedItems: totalShiftedItems
});
}
}
}, {
key: "calculatePosition",
value: function calculatePosition() {
if (this.itemsContainer && this.responsiveOptions) {
var windowWidth = window.innerWidth;
var matchedResponsiveData = {
numVisible: this.props.numVisible,
numScroll: this.props.numScroll
};
for (var i = 0; i < this.responsiveOptions.length; i++) {
var res = this.responsiveOptions[i];
if (parseInt(res.breakpoint, 10) >= windowWidth) {
matchedResponsiveData = res;
}
}
var state = {};
if (this.state.numScroll !== matchedResponsiveData.numScroll) {
var page = this.getPage();
page = Math.floor(page * this.state.numScroll / matchedResponsiveData.numScroll);
var totalShiftedItems = matchedResponsiveData.numScroll * page * -1;
if (this.isCircular()) {
totalShiftedItems -= matchedResponsiveData.numVisible;
}
state = {
totalShiftedItems: totalShiftedItems,
numScroll: matchedResponsiveData.numScroll
};
if (this.props.onPageChange) {
this.props.onPageChange({
page: page
});
} else {
state = _objectSpread$J(_objectSpread$J({}, state), {}, {
page: page
});
}
}
if (this.state.numVisible !== matchedResponsiveData.numVisible) {
state = _objectSpread$J(_objectSpread$J({}, state), {}, {
numVisible: matchedResponsiveData.numVisible
});
}
if (Object.keys(state).length) {
this.setState(state);
}
}
}
}, {
key: "navBackward",
value: function navBackward(e, page) {
if (this.circular || this.getPage() !== 0) {
this.step(1, page);
}
this.allowAutoplay = false;
if (e.cancelable) {
e.preventDefault();
}
}
}, {
key: "navForward",
value: function navForward(e, page) {
if (this.circular || this.getPage() < this.totalIndicators - 1) {
this.step(-1, page);
}
this.allowAutoplay = false;
if (e.cancelable) {
e.preventDefault();
}
}
}, {
key: "onDotClick",
value: function onDotClick(e, page) {
var currentPage = this.getPage();
if (page > currentPage) {
this.navForward(e, page);
} else if (page < currentPage) {
this.navBackward(e, page);
}
}
}, {
key: "onTransitionEnd",
value: function onTransitionEnd(e) {
if (this.itemsContainer && e.propertyName === 'transform') {
DomHandler.addClass(this.itemsContainer, 'p-items-hidden');
this.itemsContainer.style.transition = '';
if ((this.state.page === 0 || this.state.page === this.totalIndicators - 1) && this.isCircular()) {
this.changePosition(this.state.totalShiftedItems);
}
}
}
}, {
key: "onTouchStart",
value: function onTouchStart(e) {
var touchobj = e.changedTouches[0];
this.startPos = {
x: touchobj.pageX,
y: touchobj.pageY
};
}
}, {
key: "onTouchMove",
value: function onTouchMove(e) {
if (e.cancelable) {
e.preventDefault();
}
}
}, {
key: "onTouchEnd",
value: function onTouchEnd(e) {
var touchobj = e.changedTouches[0];
if (this.isVertical()) {
this.changePageOnTouch(e, touchobj.pageY - this.startPos.y);
} else {
this.changePageOnTouch(e, touchobj.pageX - this.startPos.x);
}
}
}, {
key: "changePageOnTouch",
value: function changePageOnTouch(e, diff) {
if (Math.abs(diff) > this.swipeThreshold) {
if (diff < 0) {
// left
this.navForward(e);
} else {
// right
this.navBackward(e);
}
}
}
}, {
key: "bindDocumentListeners",
value: function bindDocumentListeners() {
var _this2 = this;
if (!this.documentResizeListener) {
this.documentResizeListener = function () {
_this2.calculatePosition();
};
window.addEventListener('resize', this.documentResizeListener);
}
}
}, {
key: "unbindDocumentListeners",
value: function unbindDocumentListeners() {
if (this.documentResizeListener) {
window.removeEventListener('resize', this.documentResizeListener);
this.documentResizeListener = null;
}
}
}, {
key: "isVertical",
value: function isVertical() {
return this.props.orientation === 'vertical';
}
}, {
key: "isCircular",
value: function isCircular() {
return this.circular && this.props.value.length >= this.state.numVisible;
}
}, {
key: "getPage",
value: function getPage() {
return this.props.onPageChange ? this.props.page : this.state.page;
}
}, {
key: "getTotalIndicators",
value: function getTotalIndicators() {
return this.props.value ? Math.ceil((this.props.value.length - this.state.numVisible) / this.state.numScroll) + 1 : 0;
}
}, {
key: "isAutoplay",
value: function isAutoplay() {
return this.props.autoplayInterval && this.allowAutoplay;
}
}, {
key: "startAutoplay",
value: function startAutoplay() {
var _this3 = this;
this.interval = setInterval(function () {
if (_this3.state.page === _this3.totalIndicators - 1) {
_this3.step(-1, 0);
} else {
_this3.step(-1, _this3.state.page + 1);
}
}, this.props.autoplayInterval);
}
}, {
key: "stopAutoplay",
value: function stopAutoplay() {
if (this.interval) {
clearInterval(this.interval);
}
}
}, {
key: "createStyle",
value: function createStyle() {
if (!this.carouselStyle) {
this.carouselStyle = DomHandler.createInlineStyle(PrimeReact.nonce);
}
var innerHTML = "\n .p-carousel[".concat(this.attributeSelector, "] .p-carousel-item {\n flex: 1 0 ").concat(100 / this.state.numVisible, "%\n }\n ");
if (this.props.responsiveOptions) {
this.responsiveOptions = _toConsumableArray(this.props.responsiveOptions);
this.responsiveOptions.sort(function (data1, data2) {
var value1 = data1.breakpoint;
var value2 = data2.breakpoint;
var result = null;
if (value1 == null && value2 != null) result = -1;else if (value1 != null && value2 == null) result = 1;else if (value1 == null && value2 == null) result = 0;else if (typeof value1 === 'string' && typeof value2 === 'string') result = value1.localeCompare(value2, undefined, {
numeric: true
});else result = value1 < value2 ? -1 : value1 > value2 ? 1 : 0;
return -1 * result;
});
for (var i = 0; i < this.responsiveOptions.length; i++) {
var res = this.responsiveOptions[i];
innerHTML += "\n @media screen and (max-width: ".concat(res.breakpoint, ") {\n .p-carousel[").concat(this.attributeSelector, "] .p-carousel-item {\n flex: 1 0 ").concat(100 / res.numVisible, "%\n }\n }\n ");
}
}
this.carouselStyle.innerHTML = innerHTML;
}
}, {
key: "changePosition",
value: function changePosition(totalShiftedItems) {
if (this.itemsContainer) {
this.itemsContainer.style.transform = this.isVertical() ? "translate3d(0, ".concat(totalShiftedItems * (100 / this.state.numVisible), "%, 0)") : "translate3d(".concat(totalShiftedItems * (100 / this.state.numVisible), "%, 0, 0)");
}
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
if (this.container) {
this.container.setAttribute(this.attributeSelector, '');
}
this.createStyle();
this.calculatePosition();
this.changePosition(this.state.totalShiftedItems);
if (this.props.responsiveOptions) {
this.bindDocumentListeners();
}
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps, prevState) {
var isCircular = this.isCircular();
var stateChanged = false;
var totalShiftedItems = this.state.totalShiftedItems;
if (this.props.autoplayInterval) {
this.stopAutoplay();
}
if (prevState.numScroll !== this.state.numScroll || prevState.numVisible !== this.state.numVisible || this.props.value && prevProps.value && prevProps.value.length !== this.props.value.length) {
this.remainingItems = (this.props.value.length - this.state.numVisible) % this.state.numScroll;
var page = this.getPage();
if (this.totalIndicators !== 0 && page >= this.totalIndicators) {
page = this.totalIndicators - 1;
if (this.props.onPageChange) {
this.props.onPageChange({
page: page
});
} else {
this.setState({
page: page
});
}
stateChanged = true;
}
totalShiftedItems = page * this.state.numScroll * -1;
if (isCircular) {
totalShiftedItems -= this.state.numVisible;
}
if (page === this.totalIndicators - 1 && this.remainingItems > 0) {
totalShiftedItems += -1 * this.remainingItems + this.state.numScroll;
this.isRemainingItemsAdded = true;
} else {
this.isRemainingItemsAdded = false;
}
if (totalShiftedItems !== this.state.totalShiftedItems) {
this.setState({
totalShiftedItems: totalShiftedItems
});
stateChanged = true;
}
this.changePosition(totalShiftedItems);
}
if (isCircular) {
if (this.state.page === 0) {
totalShiftedItems = -1 * this.state.numVisible;
} else if (totalShiftedItems === 0) {
totalShiftedItems = -1 * this.props.value.length;
if (this.remainingItems > 0) {
this.isRemainingItemsAdded = true;
}
}
if (totalShiftedItems !== this.state.totalShiftedItems) {
this.setState({
totalShiftedItems: totalShiftedItems
});
stateChanged = true;
}
}
if (prevProps.page !== this.props.page) {
if (this.props.page > prevProps.page && this.props.page <= this.totalIndicators - 1) {
this.step(-1, this.props.page);
} else if (this.props.page < prevProps.page) {
this.step(1, this.props.page);
}
}
if (!stateChanged && this.isAutoplay()) {
this.startAutoplay();
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
if (this.props.responsiveOptions) {
this.unbindDocumentListeners();
}
if (this.props.autoplayInterval) {
this.stopAutoplay();
}
}
}, {
key: "renderItems",
value: function renderItems() {
var _this4 = this;
if (this.props.value && this.props.value.length) {
var isCircular = this.isCircular();
var clonedItemsForStarting = null;
var clonedItemsForFinishing = null;
if (isCircular) {
var clonedElements = null;
clonedElements = this.props.value.slice(-1 * this.state.numVisible);
clonedItemsForStarting = clonedElements.map(function (item, index) {
var isActive = _this4.state.totalShiftedItems * -1 === _this4.props.value.length + _this4.state.numVisible,
start = index === 0,
end = index === clonedElements.length - 1;
return /*#__PURE__*/React__default["default"].createElement(CarouselItem, {
key: index + '_scloned',
className: "p-carousel-item-cloned",
template: _this4.props.itemTemplate,
item: item,
active: isActive,
start: start,
end: end
});
});
clonedElements = this.props.value.slice(0, this.state.numVisible);
clonedItemsForFinishing = clonedElements.map(function (item, index) {
var isActive = _this4.state.totalShiftedItems === 0,
start = index === 0,
end = index === clonedElements.length - 1;
return /*#__PURE__*/React__default["default"].createElement(CarouselItem, {
key: index + '_fcloned',
className: "p-carousel-item-cloned",
template: _this4.props.itemTemplate,
item: item,
active: isActive,
start: start,
end: end
});
});
}
var items = this.props.value.map(function (item, index) {
var firstIndex = isCircular ? -1 * (_this4.state.totalShiftedItems + _this4.state.numVisible) : _this4.state.totalShiftedItems * -1,
lastIndex = firstIndex + _this4.state.numVisible - 1,
isActive = firstIndex <= index && lastIndex >= index,
start = firstIndex === index,
end = lastIndex === index;
return /*#__PURE__*/React__default["default"].createElement(CarouselItem, {
key: index,
template: _this4.props.itemTemplate,
item: item,
active: isActive,
start: start,
end: end
});
});
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, clonedItemsForStarting, items, clonedItemsForFinishing);
}
}
}, {
key: "renderHeader",
value: function renderHeader() {
if (this.props.header) {
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-carousel-header"
}, this.props.header);
}
return null;
}
}, {
key: "renderFooter",
value: function renderFooter() {
if (this.props.footer) {
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-carousel-footer"
}, this.props.footer);
}
return null;
}
}, {
key: "renderContent",
value: function renderContent() {
var _this5 = this;
var items = this.renderItems();
var height = this.isVertical() ? this.props.verticalViewPortHeight : 'auto';
var backwardNavigator = this.renderBackwardNavigator();
var forwardNavigator = this.renderForwardNavigator();
var containerClassName = classNames('p-carousel-container', this.props.containerClassName);
return /*#__PURE__*/React__default["default"].createElement("div", {
className: containerClassName
}, backwardNavigator, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-carousel-items-content",
style: {
'height': height
},
onTouchStart: this.onTouchStart,
onTouchMove: this.onTouchMove,
onTouchEnd: this.onTouchEnd
}, /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this5.itemsContainer = el;
},
className: "p-carousel-items-container",
onTransitionEnd: this.onTransitionEnd
}, items)), forwardNavigator);
}
}, {
key: "renderBackwardNavigator",
value: function renderBackwardNavigator() {
var isDisabled = (!this.circular || this.props.value && this.props.value.length < this.state.numVisible) && this.getPage() === 0;
var buttonClassName = classNames('p-carousel-prev p-link', {
'p-disabled': isDisabled
}),
iconClassName = classNames('p-carousel-prev-icon pi', {
'pi-chevron-left': !this.isVertical(),
'pi-chevron-up': this.isVertical()
});
return /*#__PURE__*/React__default["default"].createElement("button", {
type: "button",
className: buttonClassName,
onClick: this.navBackward,
disabled: isDisabled
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: iconClassName
}), /*#__PURE__*/React__default["default"].createElement(Ripple, null));
}
}, {
key: "renderForwardNavigator",
value: function renderForwardNavigator() {
var isDisabled = (!this.circular || this.props.value && this.props.value.length < this.state.numVisible) && (this.getPage() === this.totalIndicators - 1 || this.totalIndicators === 0);
var buttonClassName = classNames('p-carousel-next p-link', {
'p-disabled': isDisabled
}),
iconClassName = classNames('p-carousel-next-icon pi', {
'pi-chevron-right': !this.isVertical(),
'pi-chevron-down': this.isVertical()
});
return /*#__PURE__*/React__default["default"].createElement("button", {
type: "button",
className: buttonClassName,
onClick: this.navForward,
disabled: isDisabled
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: iconClassName
}), /*#__PURE__*/React__default["default"].createElement(Ripple, null));
}
}, {
key: "renderIndicator",
value: function renderIndicator(index) {
var _this6 = this;
var isActive = this.getPage() === index,
indicatorItemClassName = classNames('p-carousel-indicator', {
'p-highlight': isActive
});
return /*#__PURE__*/React__default["default"].createElement("li", {
className: indicatorItemClassName,
key: 'p-carousel-indicator-' + index
}, /*#__PURE__*/React__default["default"].createElement("button", {
type: "button",
className: "p-link",
onClick: function onClick(e) {
return _this6.onDotClick(e, index);
}
}, /*#__PURE__*/React__default["default"].createElement(Ripple, null)));
}
}, {
key: "renderIndicators",
value: function renderIndicators() {
var indicatorsContentClassName = classNames('p-carousel-indicators p-reset', this.props.indicatorsContentClassName);
var indicators = [];
for (var i = 0; i < this.totalIndicators; i++) {
indicators.push(this.renderIndicator(i));
}
return /*#__PURE__*/React__default["default"].createElement("ul", {
className: indicatorsContentClassName
}, indicators);
}
}, {
key: "render",
value: function render() {
var _this7 = this;
var className = classNames('p-carousel p-component', {
'p-carousel-vertical': this.isVertical(),
'p-carousel-horizontal': !this.isVertical()
}, this.props.className);
var contentClassName = classNames('p-carousel-content', this.props.contentClassName);
this.totalIndicators = this.getTotalIndicators();
var content = this.renderContent();
var indicators = this.renderIndicators();
var header = this.renderHeader();
var footer = this.renderFooter();
return /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this7.container = el;
},
id: this.props.id,
className: className,
style: this.props.style
}, header, /*#__PURE__*/React__default["default"].createElement("div", {
className: contentClassName
}, content, indicators), footer);
}
}]);
return Carousel;
}(React.Component);
_defineProperty(Carousel, "defaultProps", {
id: null,
value: null,
page: 0,
header: null,
footer: null,
style: null,
className: null,
itemTemplate: null,
circular: false,
autoplayInterval: 0,
numVisible: 1,
numScroll: 1,
responsiveOptions: null,
orientation: "horizontal",
verticalViewPortHeight: "300px",
contentClassName: null,
containerClassName: null,
indicatorsContentClassName: null,
onPageChange: null
});
function _createForOfIteratorHelper$e(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray$e(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it["return"] != null) it["return"](); } finally { if (didErr) throw err; } } }; }
function _unsupportedIterableToArray$e(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray$e(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray$e(o, minLen); }
function _arrayLikeToArray$e(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
function _createSuper$22(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$22(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$22() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var CascadeSelectSub = /*#__PURE__*/function (_Component) {
_inherits(CascadeSelectSub, _Component);
var _super = _createSuper$22(CascadeSelectSub);
function CascadeSelectSub(props) {
var _this;
_classCallCheck(this, CascadeSelectSub);
_this = _super.call(this, props);
_this.state = {
activeOption: null
};
_this.onOptionSelect = _this.onOptionSelect.bind(_assertThisInitialized(_this));
_this.onOptionGroupSelect = _this.onOptionGroupSelect.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(CascadeSelectSub, [{
key: "componentDidMount",
value: function componentDidMount() {
if (this.props.selectionPath && this.props.options && !this.props.dirty) {
var _iterator = _createForOfIteratorHelper$e(this.props.options),
_step;
try {
for (_iterator.s(); !(_step = _iterator.n()).done;) {
var option = _step.value;
if (this.props.selectionPath.includes(option)) {
this.setState({
activeOption: option
});
break;
}
}
} catch (err) {
_iterator.e(err);
} finally {
_iterator.f();
}
}
if (!this.props.root) {
this.position();
}
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps) {
if (prevProps.parentActive !== this.props.parentActive) {
this.setState({
activeOption: null
});
}
}
}, {
key: "position",
value: function position() {
var parentItem = this.element.parentElement;
var containerOffset = DomHandler.getOffset(parentItem);
var viewport = DomHandler.getViewport();
var sublistWidth = this.element.offsetParent ? this.element.offsetWidth : DomHandler.getHiddenElementOuterWidth(this.element);
var itemOuterWidth = DomHandler.getOuterWidth(parentItem.children[0]);
if (parseInt(containerOffset.left, 10) + itemOuterWidth + sublistWidth > viewport.width - DomHandler.calculateScrollbarWidth()) {
this.element.style.left = '-100%';
}
}
}, {
key: "onOptionSelect",
value: function onOptionSelect(event) {
if (this.props.onOptionSelect) {
this.props.onOptionSelect(event);
}
}
}, {
key: "onKeyDown",
value: function onKeyDown(event, option) {
var listItem = event.currentTarget.parentElement;
switch (event.key) {
case 'Down':
case 'ArrowDown':
var nextItem = this.findNextItem(listItem);
if (nextItem) {
nextItem.children[0].focus();
}
break;
case 'Up':
case 'ArrowUp':
var prevItem = this.findPrevItem(listItem);
if (prevItem) {
prevItem.children[0].focus();
}
break;
case 'Right':
case 'ArrowRight':
if (this.isOptionGroup(option)) {
if (this.state.activeOption === option) {
listItem.children[1].children[0].children[0].focus();
} else {
this.setState({
activeOption: option
});
}
}
break;
case 'Left':
case 'ArrowLeft':
this.setState({
activeOption: null
});
var parentList = event.currentTarget.parentElement.parentElement.previousElementSibling;
if (parentList) {
parentList.focus();
}
break;
case 'Enter':
this.onOptionClick(event, option);
break;
case 'Tab':
case 'Escape':
if (this.props.onPanelHide) {
this.props.onPanelHide();
event.preventDefault();
}
break;
}
event.preventDefault();
}
}, {
key: "findNextItem",
value: function findNextItem(item) {
var nextItem = item.nextElementSibling;
if (nextItem) return DomHandler.hasClass(nextItem, 'p-disabled') || !DomHandler.hasClass(nextItem, 'p-cascadeselect-item') ? this.findNextItem(nextItem) : nextItem;else return null;
}
}, {
key: "findPrevItem",
value: function findPrevItem(item) {
var prevItem = item.previousElementSibling;
if (prevItem) return DomHandler.hasClass(prevItem, 'p-disabled') || !DomHandler.hasClass(prevItem, 'p-cascadeselect-item') ? this.findPrevItem(prevItem) : prevItem;else return null;
}
}, {
key: "onOptionClick",
value: function onOptionClick(event, option) {
if (this.isOptionGroup(option)) {
this.setState({
activeOption: this.state.activeOption === option ? null : option
});
if (this.props.onOptionGroupSelect) {
this.props.onOptionGroupSelect({
originalEvent: event,
value: option
});
}
} else {
if (this.props.onOptionSelect) {
this.props.onOptionSelect({
originalEvent: event,
value: this.getOptionValue(option)
});
}
}
}
}, {
key: "onOptionGroupSelect",
value: function onOptionGroupSelect(event) {
if (this.props.onOptionGroupSelect) {
this.props.onOptionGroupSelect(event);
}
}
}, {
key: "getOptionLabel",
value: function getOptionLabel(option) {
return this.props.optionLabel ? ObjectUtils.resolveFieldData(option, this.props.optionLabel) : option;
}
}, {
key: "getOptionValue",
value: function getOptionValue(option) {
return this.props.optionValue ? ObjectUtils.resolveFieldData(option, this.props.optionValue) : option;
}
}, {
key: "getOptionGroupLabel",
value: function getOptionGroupLabel(optionGroup) {
return this.props.optionGroupLabel ? ObjectUtils.resolveFieldData(optionGroup, this.props.optionGroupLabel) : null;
}
}, {
key: "getOptionGroupChildren",
value: function getOptionGroupChildren(optionGroup) {
return ObjectUtils.resolveFieldData(optionGroup, this.props.optionGroupChildren[this.props.level]);
}
}, {
key: "isOptionGroup",
value: function isOptionGroup(option) {
return Object.prototype.hasOwnProperty.call(option, this.props.optionGroupChildren[this.props.level]);
}
}, {
key: "getOptionLabelToRender",
value: function getOptionLabelToRender(option) {
return this.isOptionGroup(option) ? this.getOptionGroupLabel(option) : this.getOptionLabel(option);
}
}, {
key: "renderSubmenu",
value: function renderSubmenu(option) {
if (this.isOptionGroup(option) && this.state.activeOption === option) {
return /*#__PURE__*/React__default["default"].createElement(CascadeSelectSub, {
options: this.getOptionGroupChildren(option),
className: "p-cascadeselect-sublist",
selectionPath: this.props.selectionPath,
optionLabel: this.props.optionLabel,
optionValue: this.props.optionValue,
level: this.props.level + 1,
onOptionSelect: this.onOptionSelect,
onOptionGroupSelect: this.onOptionGroupSelect,
parentActive: this.state.activeOption === option,
optionGroupLabel: this.props.optionGroupLabel,
optionGroupChildren: this.props.optionGroupChildren,
dirty: this.props.dirty,
template: this.props.template,
onPanelHide: this.props.onPanelHide
});
}
return null;
}
}, {
key: "renderOption",
value: function renderOption(option, index) {
var _this2 = this;
var className = classNames('p-cascadeselect-item', {
'p-cascadeselect-item-group': this.isOptionGroup(option),
'p-cascadeselect-item-active p-highlight': this.state.activeOption === option
}, option.className);
var submenu = this.renderSubmenu(option);
var content = this.props.template ? ObjectUtils.getJSXElement(this.props.template, this.getOptionValue(option)) : /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-cascadeselect-item-text"
}, this.getOptionLabelToRender(option));
var optionGroup = this.isOptionGroup(option) && /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-cascadeselect-group-icon pi pi-angle-right"
});
return /*#__PURE__*/React__default["default"].createElement("li", {
key: this.getOptionLabelToRender(option) + '_' + index,
className: className,
style: option.style,
role: "none"
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-cascadeselect-item-content",
onClick: function onClick(event) {
return _this2.onOptionClick(event, option);
},
tabIndex: 0,
onKeyDown: function onKeyDown(event) {
return _this2.onKeyDown(event, option);
}
}, content, optionGroup, /*#__PURE__*/React__default["default"].createElement(Ripple, null)), submenu);
}
}, {
key: "renderMenu",
value: function renderMenu() {
var _this3 = this;
if (this.props.options) {
return this.props.options.map(function (option, index) {
return _this3.renderOption(option, index);
});
}
return null;
}
}, {
key: "render",
value: function render() {
var _this4 = this;
var className = classNames('p-cascadeselect-panel p-cascadeselect-items', this.props.className);
var submenu = this.renderMenu();
return /*#__PURE__*/React__default["default"].createElement("ul", {
ref: function ref(el) {
return _this4.element = el;
},
className: className,
role: "listbox",
"aria-orientation": "horizontal"
}, submenu);
}
}]);
return CascadeSelectSub;
}(React.Component);
_defineProperty(CascadeSelectSub, "defaultProps", {
options: null,
selectionPath: false,
className: null,
optionLabel: null,
optionValue: null,
level: null,
optionGroupLabel: null,
optionGroupChildren: null,
parentActive: null,
dirty: null,
root: null,
template: null,
onOptionSelect: null,
onOptionGroupSelect: null
});
function _createForOfIteratorHelper$d(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray$d(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it["return"] != null) it["return"](); } finally { if (didErr) throw err; } } }; }
function _unsupportedIterableToArray$d(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray$d(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray$d(o, minLen); }
function _arrayLikeToArray$d(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
function _createSuper$21(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$21(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$21() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var CascadeSelect = /*#__PURE__*/function (_Component) {
_inherits(CascadeSelect, _Component);
var _super = _createSuper$21(CascadeSelect);
function CascadeSelect(props) {
var _this;
_classCallCheck(this, CascadeSelect);
_this = _super.call(this, props);
_this.state = {
focused: false,
overlayVisible: false
};
_this.dirty = false;
_this.selectionPath = null;
_this.overlayRef = /*#__PURE__*/React.createRef();
_this.inputRef = /*#__PURE__*/React.createRef(_this.props.inputRef);
_this.hide = _this.hide.bind(_assertThisInitialized(_this));
_this.onClick = _this.onClick.bind(_assertThisInitialized(_this));
_this.onInputFocus = _this.onInputFocus.bind(_assertThisInitialized(_this));
_this.onInputBlur = _this.onInputBlur.bind(_assertThisInitialized(_this));
_this.onInputKeyDown = _this.onInputKeyDown.bind(_assertThisInitialized(_this));
_this.onOverlayEnter = _this.onOverlayEnter.bind(_assertThisInitialized(_this));
_this.onOverlayEntered = _this.onOverlayEntered.bind(_assertThisInitialized(_this));
_this.onOverlayExit = _this.onOverlayExit.bind(_assertThisInitialized(_this));
_this.onOverlayExited = _this.onOverlayExited.bind(_assertThisInitialized(_this));
_this.onOptionSelect = _this.onOptionSelect.bind(_assertThisInitialized(_this));
_this.onOptionGroupSelect = _this.onOptionGroupSelect.bind(_assertThisInitialized(_this));
_this.onPanelClick = _this.onPanelClick.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(CascadeSelect, [{
key: "onOptionSelect",
value: function onOptionSelect(event) {
if (this.props.onChange) {
this.props.onChange({
originalEvent: event,
value: event.value
});
}
this.updateSelectionPath();
this.hide();
this.inputRef.current.focus();
}
}, {
key: "onOptionGroupSelect",
value: function onOptionGroupSelect(event) {
this.dirty = true;
if (this.props.onGroupChange) {
this.props.onGroupChange(event);
}
}
}, {
key: "getOptionLabel",
value: function getOptionLabel(option) {
return this.props.optionLabel ? ObjectUtils.resolveFieldData(option, this.props.optionLabel) : option;
}
}, {
key: "getOptionValue",
value: function getOptionValue(option) {
return this.props.optionValue ? ObjectUtils.resolveFieldData(option, this.props.optionValue) : option;
}
}, {
key: "getOptionGroupChildren",
value: function getOptionGroupChildren(optionGroup, level) {
return ObjectUtils.resolveFieldData(optionGroup, this.props.optionGroupChildren[level]);
}
}, {
key: "isOptionGroup",
value: function isOptionGroup(option, level) {
return Object.prototype.hasOwnProperty.call(option, this.props.optionGroupChildren[level]);
}
}, {
key: "updateSelectionPath",
value: function updateSelectionPath() {
var path;
if (this.props.value != null && this.props.options) {
var _iterator = _createForOfIteratorHelper$d(this.props.options),
_step;
try {
for (_iterator.s(); !(_step = _iterator.n()).done;) {
var option = _step.value;
path = this.findModelOptionInGroup(option, 0);
if (path) {
break;
}
}
} catch (err) {
_iterator.e(err);
} finally {
_iterator.f();
}
}
this.selectionPath = path;
}
}, {
key: "findModelOptionInGroup",
value: function findModelOptionInGroup(option, level) {
if (this.isOptionGroup(option, level)) {
var selectedOption;
var _iterator2 = _createForOfIteratorHelper$d(this.getOptionGroupChildren(option, level)),
_step2;
try {
for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
var childOption = _step2.value;
selectedOption = this.findModelOptionInGroup(childOption, level + 1);
if (selectedOption) {
selectedOption.unshift(option);
return selectedOption;
}
}
} catch (err) {
_iterator2.e(err);
} finally {
_iterator2.f();
}
} else if (ObjectUtils.equals(this.props.value, this.getOptionValue(option), this.props.dataKey)) {
return [option];
}
return null;
}
}, {
key: "onClick",
value: function onClick(event) {
if (this.props.disabled) {
return;
}
var overlay = this.overlayRef ? this.overlayRef.current : null;
if (!overlay || !overlay.contains(event.target)) {
this.inputRef.current.focus();
if (this.state.overlayVisible) {
this.hide();
} else {
this.show();
}
}
}
}, {
key: "onInputFocus",
value: function onInputFocus() {
this.setState({
focused: true
});
}
}, {
key: "onInputBlur",
value: function onInputBlur() {
this.setState({
focused: false
});
}
}, {
key: "onInputKeyDown",
value: function onInputKeyDown(event) {
switch (event.which) {
//down
case 40:
if (this.state.overlayVisible) {
DomHandler.findSingle(this.overlayRef.current, '.p-cascadeselect-item').children[0].focus();
} else if (event.altKey && this.props.options && this.props.options.length) {
this.show();
}
event.preventDefault();
break;
//space
case 32:
if (this.state.overlayVisible) this.hide();else this.show();
event.preventDefault();
break;
//tab
case 9:
this.hide();
break;
}
}
}, {
key: "onPanelClick",
value: function onPanelClick(event) {
OverlayService.emit('overlay-click', {
originalEvent: event,
target: this.container
});
}
}, {
key: "show",
value: function show() {
if (this.props.onBeforeShow) {
this.props.onBeforeShow();
}
this.setState({
overlayVisible: true
});
}
}, {
key: "hide",
value: function hide() {
var _this2 = this;
if (this.props.onBeforeHide) {
this.props.onBeforeHide();
}
this.setState({
overlayVisible: false
}, function () {
_this2.inputRef.current.focus();
});
}
}, {
key: "onOverlayEnter",
value: function onOverlayEnter() {
ZIndexUtils.set('overlay', this.overlayRef.current, PrimeReact.autoZIndex, PrimeReact.zIndex['overlay']);
this.alignOverlay();
}
}, {
key: "onOverlayEntered",
value: function onOverlayEntered() {
this.bindOutsideClickListener();
this.bindScrollListener();
this.bindResizeListener();
this.props.onShow && this.props.onShow();
}
}, {
key: "onOverlayExit",
value: function onOverlayExit() {
this.unbindOutsideClickListener();
this.unbindScrollListener();
this.unbindResizeListener();
this.dirty = false;
}
}, {
key: "onOverlayExited",
value: function onOverlayExited() {
ZIndexUtils.clear(this.overlayRef.current);
this.props.onHide && this.props.onHide();
}
}, {
key: "alignOverlay",
value: function alignOverlay() {
DomHandler.alignOverlay(this.overlayRef.current, this.label.parentElement, this.props.appendTo || PrimeReact.appendTo);
}
}, {
key: "bindOutsideClickListener",
value: function bindOutsideClickListener() {
var _this3 = this;
if (!this.outsideClickListener) {
this.outsideClickListener = function (event) {
if (_this3.state.overlayVisible && _this3.isOutsideClicked(event)) {
_this3.hide();
}
};
document.addEventListener('click', this.outsideClickListener);
}
}
}, {
key: "unbindOutsideClickListener",
value: function unbindOutsideClickListener() {
if (this.outsideClickListener) {
document.removeEventListener('click', this.outsideClickListener);
this.outsideClickListener = null;
}
}
}, {
key: "bindScrollListener",
value: function bindScrollListener() {
var _this4 = this;
if (!this.scrollHandler) {
this.scrollHandler = new ConnectedOverlayScrollHandler(this.container, function () {
if (_this4.state.overlayVisible) {
_this4.hide();
}
});
}
this.scrollHandler.bindScrollListener();
}
}, {
key: "unbindScrollListener",
value: function unbindScrollListener() {
if (this.scrollHandler) {
this.scrollHandler.unbindScrollListener();
}
}
}, {
key: "bindResizeListener",
value: function bindResizeListener() {
var _this5 = this;
if (!this.resizeListener) {
this.resizeListener = function () {
if (_this5.state.overlayVisible && !DomHandler.isTouchDevice()) {
_this5.hide();
}
};
window.addEventListener('resize', this.resizeListener);
}
}
}, {
key: "unbindResizeListener",
value: function unbindResizeListener() {
if (this.resizeListener) {
window.removeEventListener('resize', this.resizeListener);
this.resizeListener = null;
}
}
}, {
key: "isOutsideClicked",
value: function isOutsideClicked(event) {
return this.container && !(this.container.isSameNode(event.target) || this.container.contains(event.target) || this.overlayRef && this.overlayRef.current.contains(event.target));
}
}, {
key: "updateInputRef",
value: function updateInputRef() {
var ref = this.props.inputRef;
if (ref) {
if (typeof ref === 'function') {
ref(this.inputRef.current);
} else {
ref.current = this.inputRef.current;
}
}
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
this.updateInputRef();
this.updateSelectionPath();
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
this.unbindOutsideClickListener();
this.unbindResizeListener();
if (this.scrollHandler) {
this.scrollHandler.destroy();
this.scrollHandler = null;
}
ZIndexUtils.clear(this.overlayRef.current);
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps) {
if (prevProps.value !== this.props.value) {
this.updateSelectionPath();
}
}
}, {
key: "renderKeyboardHelper",
value: function renderKeyboardHelper() {
var value = this.props.value ? this.getOptionLabel(this.props.value) : null;
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-hidden-accessible"
}, /*#__PURE__*/React__default["default"].createElement("input", {
ref: this.inputRef,
type: "text",
id: this.props.inputId,
name: this.props.name,
defaultValue: value,
readOnly: true,
disabled: this.props.disabled,
onFocus: this.onInputFocus,
onBlur: this.onInputBlur,
onKeyDown: this.onInputKeyDown,
tabIndex: this.props.tabIndex,
"aria-haspopup": "listbox",
"aria-labelledby": this.props.ariaLabelledBy
}));
}
}, {
key: "renderLabel",
value: function renderLabel() {
var _this6 = this;
var label = this.props.value ? this.getOptionLabel(this.props.value) : this.props.placeholder || 'p-emptylabel';
var labelClassName = classNames('p-cascadeselect-label ', {
'p-placeholder': label === this.props.placeholder,
'p-cascadeselect-label-empty': !this.props.value && label === 'p-emptylabel'
});
return /*#__PURE__*/React__default["default"].createElement("span", {
ref: function ref(el) {
return _this6.label = el;
},
className: labelClassName
}, label);
}
}, {
key: "renderDropdownIcon",
value: function renderDropdownIcon() {
var iconClassName = classNames('p-cascadeselect-trigger-icon', this.props.dropdownIcon);
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-cascadeselect-trigger",
role: "button",
"aria-haspopup": "listbox",
"aria-expanded": this.state.overlayVisible
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: iconClassName
}));
}
}, {
key: "renderOverlay",
value: function renderOverlay() {
var overlay = /*#__PURE__*/React__default["default"].createElement(CSSTransition, {
nodeRef: this.overlayRef,
classNames: "p-connected-overlay",
"in": this.state.overlayVisible,
timeout: {
enter: 120,
exit: 100
},
options: this.props.transitionOptions,
unmountOnExit: true,
onEnter: this.onOverlayEnter,
onEntered: this.onOverlayEntered,
onExit: this.onOverlayExit,
onExited: this.onOverlayExited
}, /*#__PURE__*/React__default["default"].createElement("div", {
ref: this.overlayRef,
className: "p-cascadeselect-panel p-component",
onClick: this.onPanelClick
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-cascadeselect-items-wrapper"
}, /*#__PURE__*/React__default["default"].createElement(CascadeSelectSub, {
options: this.props.options,
selectionPath: this.selectionPath,
className: "p-cascadeselect-items",
optionLabel: this.props.optionLabel,
optionValue: this.props.optionValue,
level: 0,
optionGroupLabel: this.props.optionGroupLabel,
optionGroupChildren: this.props.optionGroupChildren,
onOptionSelect: this.onOptionSelect,
onOptionGroupSelect: this.onOptionGroupSelect,
root: true,
template: this.props.itemTemplate,
onPanelHide: this.hide
}))));
return /*#__PURE__*/React__default["default"].createElement(Portal, {
element: overlay,
appendTo: this.props.appendTo
});
}
}, {
key: "renderElement",
value: function renderElement() {
var _this7 = this;
var className = classNames('p-cascadeselect p-component p-inputwrapper', this.props.className, {
'p-disabled': this.props.disabled,
'p-focus': this.state.focused,
'p-inputwrapper-filled': this.props.value,
'p-inputwrapper-focus': this.state.focused || this.state.overlayVisible
});
var keyboardHelper = this.renderKeyboardHelper();
var labelElement = this.renderLabel();
var dropdownIcon = this.renderDropdownIcon();
var overlay = this.renderOverlay();
return /*#__PURE__*/React__default["default"].createElement("div", {
id: this.props.id,
ref: function ref(el) {
return _this7.container = el;
},
className: className,
style: this.props.style,
onClick: this.onClick
}, keyboardHelper, labelElement, dropdownIcon, overlay);
}
}, {
key: "render",
value: function render() {
var element = this.renderElement();
return element;
}
}]);
return CascadeSelect;
}(React.Component);
_defineProperty(CascadeSelect, "defaultProps", {
id: null,
inputRef: null,
style: null,
className: null,
value: null,
name: null,
options: null,
optionLabel: null,
optionValue: null,
optionGroupLabel: null,
optionGroupChildren: null,
placeholder: null,
itemTemplate: null,
disabled: false,
dataKey: null,
inputId: null,
tabIndex: null,
ariaLabelledBy: null,
appendTo: null,
transitionOptions: null,
dropdownIcon: 'pi pi-chevron-down',
onChange: null,
onGroupChange: null,
onBeforeShow: null,
onBeforeHide: null,
onShow: null,
onHide: null
});
function _createSuper$20(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$20(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$20() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var Chart = /*#__PURE__*/function (_Component) {
_inherits(Chart, _Component);
var _super = _createSuper$20(Chart);
function Chart() {
_classCallCheck(this, Chart);
return _super.apply(this, arguments);
}
_createClass(Chart, [{
key: "initChart",
value: function initChart() {
var _this = this;
Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require('chart.js/auto')); }).then(function (module) {
if (_this.chart) {
_this.chart.destroy();
_this.chart = null;
}
if (module && module["default"]) {
_this.chart = new module["default"](_this.canvas, {
type: _this.props.type,
data: _this.props.data,
options: _this.props.options,
plugins: _this.props.plugins
});
}
});
}
}, {
key: "getCanvas",
value: function getCanvas() {
return this.canvas;
}
}, {
key: "getChart",
value: function getChart() {
return this.chart;
}
}, {
key: "getBase64Image",
value: function getBase64Image() {
return this.chart.toBase64Image();
}
}, {
key: "generateLegend",
value: function generateLegend() {
if (this.chart) {
this.chart.generateLegend();
}
}
}, {
key: "refresh",
value: function refresh() {
if (this.chart) {
this.chart.update();
}
}
}, {
key: "reinit",
value: function reinit() {
this.initChart();
}
}, {
key: "shouldComponentUpdate",
value: function shouldComponentUpdate(nextProps) {
if (nextProps.data === this.props.data && nextProps.options === this.props.options && nextProps.type === this.props.type) {
return false;
}
return true;
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
this.initChart();
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate() {
this.reinit();
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
if (this.chart) {
this.chart.destroy();
this.chart = null;
}
}
}, {
key: "render",
value: function render() {
var _this2 = this;
var className = classNames('p-chart', this.props.className),
style = Object.assign({
width: this.props.width,
height: this.props.height
}, this.props.style);
return /*#__PURE__*/React__default["default"].createElement("div", {
id: this.props.id,
style: style,
className: className
}, /*#__PURE__*/React__default["default"].createElement("canvas", {
ref: function ref(el) {
_this2.canvas = el;
},
width: this.props.width,
height: this.props.height
}));
}
}]);
return Chart;
}(React.Component);
_defineProperty(Chart, "defaultProps", {
id: null,
type: null,
data: null,
options: null,
plugins: null,
width: null,
height: null,
style: null,
className: null
});
function ownKeys$I(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$I(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$I(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$I(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createSuper$1$(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1$(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1$() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var Checkbox = /*#__PURE__*/function (_Component) {
_inherits(Checkbox, _Component);
var _super = _createSuper$1$(Checkbox);
function Checkbox(props) {
var _this;
_classCallCheck(this, Checkbox);
_this = _super.call(this, props);
_this.state = {
focused: false
};
_this.onClick = _this.onClick.bind(_assertThisInitialized(_this));
_this.onFocus = _this.onFocus.bind(_assertThisInitialized(_this));
_this.onBlur = _this.onBlur.bind(_assertThisInitialized(_this));
_this.onKeyDown = _this.onKeyDown.bind(_assertThisInitialized(_this));
_this.inputRef = /*#__PURE__*/React.createRef(_this.props.inputRef);
return _this;
}
_createClass(Checkbox, [{
key: "onClick",
value: function onClick(e) {
if (!this.props.disabled && !this.props.readOnly && this.props.onChange) {
var value = this.isChecked() ? this.props.falseValue : this.props.trueValue;
this.props.onChange({
originalEvent: e,
value: this.props.value,
checked: value,
stopPropagation: function stopPropagation() {},
preventDefault: function preventDefault() {},
target: {
type: 'checkbox',
name: this.props.name,
id: this.props.id,
value: this.props.value,
checked: value
}
});
this.inputRef.current.checked = !this.isChecked();
this.inputRef.current.focus();
e.preventDefault();
}
}
}, {
key: "updateInputRef",
value: function updateInputRef() {
var ref = this.props.inputRef;
if (ref) {
if (typeof ref === 'function') {
ref(this.inputRef.current);
} else {
ref.current = this.inputRef.current;
}
}
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
this.updateInputRef();
if (this.props.tooltip) {
this.renderTooltip();
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
if (this.tooltip) {
this.tooltip.destroy();
this.tooltip = null;
}
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps) {
this.inputRef.current.checked = this.isChecked();
if (prevProps.tooltip !== this.props.tooltip || prevProps.tooltipOptions !== this.props.tooltipOptions) {
if (this.tooltip) this.tooltip.update(_objectSpread$I({
content: this.props.tooltip
}, this.props.tooltipOptions || {}));else this.renderTooltip();
}
}
}, {
key: "onFocus",
value: function onFocus() {
this.setState({
focused: true
});
}
}, {
key: "onBlur",
value: function onBlur() {
this.setState({
focused: false
});
}
}, {
key: "onKeyDown",
value: function onKeyDown(event) {
if (event.key === 'Enter') {
this.onClick(event);
event.preventDefault();
}
}
}, {
key: "renderTooltip",
value: function renderTooltip() {
this.tooltip = tip({
target: this.element,
content: this.props.tooltip,
options: this.props.tooltipOptions
});
}
}, {
key: "isChecked",
value: function isChecked() {
return this.props.checked === this.props.trueValue;
}
}, {
key: "render",
value: function render() {
var _this2 = this;
var checked = this.isChecked();
var containerClass = classNames('p-checkbox p-component', {
'p-checkbox-checked': checked,
'p-checkbox-disabled': this.props.disabled,
'p-checkbox-focused': this.state.focused
}, this.props.className);
var boxClass = classNames('p-checkbox-box', {
'p-highlight': checked,
'p-disabled': this.props.disabled,
'p-focus': this.state.focused
});
var icon = checked && this.props.icon;
return /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this2.element = el;
},
id: this.props.id,
className: containerClass,
style: this.props.style,
onClick: this.onClick,
onContextMenu: this.props.onContextMenu,
onMouseDown: this.props.onMouseDown
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-hidden-accessible"
}, /*#__PURE__*/React__default["default"].createElement("input", {
ref: this.inputRef,
type: "checkbox",
"aria-labelledby": this.props.ariaLabelledBy,
id: this.props.inputId,
name: this.props.name,
tabIndex: this.props.tabIndex,
defaultChecked: checked,
onKeyDown: this.onKeyDown,
onFocus: this.onFocus,
onBlur: this.onBlur,
disabled: this.props.disabled,
readOnly: this.props.readOnly,
required: this.props.required
})), /*#__PURE__*/React__default["default"].createElement("div", {
className: boxClass,
ref: function ref(el) {
return _this2.box = el;
},
role: "checkbox",
"aria-checked": checked
}, IconUtils.getJSXIcon(icon, {
className: 'p-checkbox-icon p-c'
}, {
props: this.props,
checked: checked
})));
}
}]);
return Checkbox;
}(React.Component);
_defineProperty(Checkbox, "defaultProps", {
id: null,
inputRef: null,
inputId: null,
value: null,
name: null,
checked: false,
trueValue: true,
falseValue: false,
style: null,
className: null,
disabled: false,
required: false,
readOnly: false,
tabIndex: null,
icon: 'pi pi-check',
tooltip: null,
tooltipOptions: null,
ariaLabelledBy: null,
onChange: null,
onMouseDown: null,
onContextMenu: null
});
function _createSuper$1_(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1_(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1_() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var Chip = /*#__PURE__*/function (_Component) {
_inherits(Chip, _Component);
var _super = _createSuper$1_(Chip);
function Chip(props) {
var _this;
_classCallCheck(this, Chip);
_this = _super.call(this, props);
_this.state = {
visible: true
};
_this.close = _this.close.bind(_assertThisInitialized(_this));
_this.onKeyDown = _this.onKeyDown.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(Chip, [{
key: "onKeyDown",
value: function onKeyDown(event) {
if (event.keyCode === 13) {
// enter
this.close(event);
}
}
}, {
key: "close",
value: function close(event) {
var _this2 = this;
event.persist();
this.setState({
visible: false
}, function () {
if (_this2.props.onRemove) {
_this2.props.onRemove(event);
}
});
}
}, {
key: "renderContent",
value: function renderContent() {
var _this3 = this;
var content = [];
if (this.props.image) {
var onError = function onError(e) {
if (_this3.props.onImageError) {
_this3.props.onImageError(e);
}
};
content.push( /*#__PURE__*/React__default["default"].createElement("img", {
key: "image",
src: this.props.image,
alt: this.props.imageAlt,
onError: onError
}));
} else if (this.props.icon) {
content.push(IconUtils.getJSXIcon(this.props.icon, {
key: 'icon',
className: 'p-chip-icon'
}, {
props: this.props
}));
}
if (this.props.label) {
content.push( /*#__PURE__*/React__default["default"].createElement("span", {
key: "label",
className: "p-chip-text"
}, this.props.label));
}
if (this.props.removable) {
content.push(IconUtils.getJSXIcon(this.props.removeIcon, {
key: 'removeIcon',
tabIndex: 0,
className: 'p-chip-remove-icon',
onClick: this.close,
onKeyDown: this.onKeyDown
}, {
props: this.props
}));
}
return content;
}
}, {
key: "renderElement",
value: function renderElement() {
var containerClassName = classNames('p-chip p-component', {
'p-chip-image': this.props.image != null
}, this.props.className);
var content = this.props.template ? ObjectUtils.getJSXElement(this.props.template, this.props) : this.renderContent();
return /*#__PURE__*/React__default["default"].createElement("div", {
className: containerClassName,
style: this.props.style
}, content);
}
}, {
key: "render",
value: function render() {
return this.state.visible && this.renderElement();
}
}]);
return Chip;
}(React.Component);
_defineProperty(Chip, "defaultProps", {
label: null,
icon: null,
image: null,
removable: false,
removeIcon: 'pi pi-times-circle',
className: null,
style: null,
template: null,
imageAlt: 'chip',
onImageError: null,
onRemove: null
});
function ownKeys$H(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$H(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$H(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$H(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createSuper$1Z(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1Z(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1Z() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var Chips = /*#__PURE__*/function (_Component) {
_inherits(Chips, _Component);
var _super = _createSuper$1Z(Chips);
function Chips(props) {
var _this;
_classCallCheck(this, Chips);
_this = _super.call(this, props);
_this.state = {
focused: false
};
_this.onWrapperClick = _this.onWrapperClick.bind(_assertThisInitialized(_this));
_this.onKeyDown = _this.onKeyDown.bind(_assertThisInitialized(_this));
_this.onPaste = _this.onPaste.bind(_assertThisInitialized(_this));
_this.onFocus = _this.onFocus.bind(_assertThisInitialized(_this));
_this.onBlur = _this.onBlur.bind(_assertThisInitialized(_this));
_this.inputRef = /*#__PURE__*/React.createRef(_this.props.inputRef);
return _this;
}
_createClass(Chips, [{
key: "removeItem",
value: function removeItem(event, index) {
if (this.props.disabled && this.props.readOnly) {
return;
}
var values = _toConsumableArray(this.props.value);
var removedItem = values.splice(index, 1);
if (!this.isRemovable(removedItem, index)) {
return;
}
if (this.props.onRemove) {
this.props.onRemove({
originalEvent: event,
value: removedItem
});
}
if (this.props.onChange) {
this.props.onChange({
originalEvent: event,
value: values,
stopPropagation: function stopPropagation() {},
preventDefault: function preventDefault() {},
target: {
name: this.props.name,
id: this.props.id,
value: values
}
});
}
}
}, {
key: "addItem",
value: function addItem(event, item, preventDefault) {
if (item && item.trim().length) {
var values = this.props.value ? _toConsumableArray(this.props.value) : [];
if (this.props.allowDuplicate || values.indexOf(item) === -1) {
values.push(item);
if (this.props.onAdd) {
this.props.onAdd({
originalEvent: event,
value: item
});
}
}
this.updateInput(event, values, preventDefault);
}
}
}, {
key: "onWrapperClick",
value: function onWrapperClick() {
this.inputRef.current.focus();
}
}, {
key: "onKeyDown",
value: function onKeyDown(event) {
var inputValue = event.target.value;
var values = this.props.value || [];
switch (event.which) {
//backspace
case 8:
if (this.inputRef.current.value.length === 0 && values.length > 0) {
this.removeItem(event, values.length - 1);
}
break;
//enter
case 13:
if (inputValue && inputValue.trim().length && (!this.props.max || this.props.max > values.length)) {
this.addItem(event, inputValue, true);
}
break;
default:
if (this.isMaxedOut()) {
event.preventDefault();
} else if (this.props.separator) {
if (this.props.separator === ',' && event.which === 188) {
this.addItem(event, inputValue, true);
}
}
break;
}
}
}, {
key: "updateInput",
value: function updateInput(event, items, preventDefault) {
if (this.props.onChange) {
this.props.onChange({
originalEvent: event,
value: items,
stopPropagation: function stopPropagation() {},
preventDefault: function preventDefault() {},
target: {
name: this.props.name,
id: this.props.id,
value: items
}
});
}
this.inputRef.current.value = '';
if (preventDefault) {
event.preventDefault();
}
}
}, {
key: "onPaste",
value: function onPaste(event) {
var _this2 = this;
if (this.props.separator) {
var pastedData = (event.clipboardData || window['clipboardData']).getData('Text');
if (pastedData) {
var values = this.props.value || [];
var pastedValues = pastedData.split(this.props.separator);
pastedValues = pastedValues.filter(function (val) {
return (_this2.props.allowDuplicate || values.indexOf(val) === -1) && val.trim().length;
});
values = [].concat(_toConsumableArray(values), _toConsumableArray(pastedValues));
this.updateInput(event, values, true);
}
}
}
}, {
key: "onFocus",
value: function onFocus(event) {
var _this3 = this;
event.persist();
this.setState({
focused: true
}, function () {
if (_this3.props.onFocus) {
_this3.props.onFocus(event);
}
});
}
}, {
key: "onBlur",
value: function onBlur(event) {
var _this4 = this;
event.persist();
this.setState({
focused: false
}, function () {
if (_this4.props.onBlur) {
_this4.props.onBlur(event);
}
});
}
}, {
key: "isMaxedOut",
value: function isMaxedOut() {
return this.props.max && this.props.value && this.props.max === this.props.value.length;
}
}, {
key: "isFilled",
value: function isFilled() {
return this.props.value && this.props.value.length || this.inputRef && this.inputRef.current && this.inputRef.current.value && this.inputRef.current.value.length;
}
}, {
key: "isRemovable",
value: function isRemovable(value, index) {
return ObjectUtils.getPropValue(this.props.removable, {
value: value,
index: index,
props: this.props
});
}
}, {
key: "updateInputRef",
value: function updateInputRef() {
var ref = this.props.inputRef;
if (ref) {
if (typeof ref === 'function') {
ref(this.inputRef.current);
} else {
ref.current = this.inputRef.current;
}
}
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
this.updateInputRef();
if (this.props.tooltip) {
this.renderTooltip();
}
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps) {
var isValueSame = this.props.value && prevProps.value && prevProps.value.length === this.props.value.length;
if (this.props.tooltip) {
if (prevProps.tooltip !== this.props.tooltip || prevProps.tooltipOptions !== this.props.tooltipOptions) {
if (this.tooltip) this.tooltip.update(_objectSpread$H({
content: this.props.tooltip
}, this.props.tooltipOptions || {}));else this.renderTooltip();
} else if (!isValueSame && this.tooltip) {
this.tooltip.deactivate();
this.tooltip.activate();
}
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
if (this.tooltip) {
this.tooltip.destroy();
this.tooltip = null;
}
}
}, {
key: "renderTooltip",
value: function renderTooltip() {
this.tooltip = tip({
target: this.inputRef.current,
targetContainer: this.listElement,
content: this.props.tooltip,
options: this.props.tooltipOptions
});
}
}, {
key: "renderRemoveIcon",
value: function renderRemoveIcon(value, index) {
var _this5 = this;
if (!this.props.disabled && !this.props.readOnly && this.isRemovable(value, index)) {
return /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-chips-token-icon pi pi-times-circle",
onClick: function onClick(event) {
return _this5.removeItem(event, index);
}
});
}
return null;
}
}, {
key: "renderItem",
value: function renderItem(value, index) {
var content = this.props.itemTemplate ? this.props.itemTemplate(value) : value;
var icon = this.renderRemoveIcon(value, index);
return /*#__PURE__*/React__default["default"].createElement("li", {
key: index,
className: "p-chips-token p-highlight"
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-chips-token-label"
}, content), icon);
}
}, {
key: "renderInputElement",
value: function renderInputElement() {
return /*#__PURE__*/React__default["default"].createElement("li", {
className: "p-chips-input-token"
}, /*#__PURE__*/React__default["default"].createElement("input", {
ref: this.inputRef,
placeholder: this.props.placeholder,
type: "text",
name: this.props.name,
disabled: this.props.disabled || this.isMaxedOut(),
onKeyDown: this.onKeyDown,
onPaste: this.onPaste,
onFocus: this.onFocus,
onBlur: this.onBlur,
"aria-labelledby": this.props.ariaLabelledBy,
readOnly: this.props.readOnly
}));
}
}, {
key: "renderItems",
value: function renderItems() {
var _this6 = this;
if (this.props.value) {
return this.props.value.map(function (value, index) {
return _this6.renderItem(value, index);
});
}
return null;
}
}, {
key: "renderList",
value: function renderList() {
var _this7 = this;
var className = classNames('p-inputtext p-chips-multiple-container', {
'p-disabled': this.props.disabled,
'p-focus': this.state.focused
});
var items = this.renderItems();
var inputElement = this.renderInputElement();
return /*#__PURE__*/React__default["default"].createElement("ul", {
ref: function ref(el) {
return _this7.listElement = el;
},
className: className,
onClick: this.onWrapperClick
}, items, inputElement);
}
}, {
key: "render",
value: function render() {
var _this8 = this;
var className = classNames('p-chips p-component p-inputwrapper', this.props.className, {
'p-inputwrapper-filled': this.isFilled(),
'p-inputwrapper-focus': this.state.focused
});
var list = this.renderList();
return /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this8.element = el;
},
id: this.props.id,
className: className,
style: this.props.style
}, list);
}
}]);
return Chips;
}(React.Component);
_defineProperty(Chips, "defaultProps", {
id: null,
inputRef: null,
name: null,
placeholder: null,
value: null,
max: null,
disabled: null,
readOnly: false,
removable: true,
style: null,
className: null,
tooltip: null,
tooltipOptions: null,
ariaLabelledBy: null,
separator: null,
allowDuplicate: true,
itemTemplate: null,
onAdd: null,
onRemove: null,
onChange: null,
onFocus: null,
onBlur: null
});
function _createSuper$1Y(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1Y(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1Y() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var ColorPickerPanelComponent = /*#__PURE__*/function (_Component) {
_inherits(ColorPickerPanelComponent, _Component);
var _super = _createSuper$1Y(ColorPickerPanelComponent);
function ColorPickerPanelComponent() {
_classCallCheck(this, ColorPickerPanelComponent);
return _super.apply(this, arguments);
}
_createClass(ColorPickerPanelComponent, [{
key: "renderElement",
value: function renderElement() {
var className = classNames('p-colorpicker-panel', {
'p-colorpicker-overlay-panel': !this.props.inline,
'p-disabled': this.props.disabled
});
return /*#__PURE__*/React__default["default"].createElement(CSSTransition, {
nodeRef: this.props.forwardRef,
classNames: "p-connected-overlay",
"in": this.props["in"],
timeout: {
enter: 120,
exit: 100
},
options: this.props.transitionOptions,
unmountOnExit: true,
onEnter: this.props.onEnter,
onEntered: this.props.onEntered,
onExit: this.props.onExit,
onExited: this.props.onExited
}, /*#__PURE__*/React__default["default"].createElement("div", {
ref: this.props.forwardRef,
className: className,
onClick: this.props.onClick
}, this.props.children));
}
}, {
key: "render",
value: function render() {
var element = this.renderElement();
return this.props.inline ? element : /*#__PURE__*/React__default["default"].createElement(Portal, {
element: element,
appendTo: this.props.appendTo
});
}
}]);
return ColorPickerPanelComponent;
}(React.Component);
_defineProperty(ColorPickerPanelComponent, "defaultProps", {
appendTo: null,
inline: false,
disabled: false,
onClick: null
});
var ColorPickerPanel = /*#__PURE__*/React__default["default"].forwardRef(function (props, ref) {
return /*#__PURE__*/React__default["default"].createElement(ColorPickerPanelComponent, _extends({
forwardRef: ref
}, props));
});
function ownKeys$G(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$G(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$G(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$G(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createSuper$1X(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1X(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1X() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var ColorPicker = /*#__PURE__*/function (_Component) {
_inherits(ColorPicker, _Component);
var _super = _createSuper$1X(ColorPicker);
function ColorPicker(props) {
var _this;
_classCallCheck(this, ColorPicker);
_this = _super.call(this, props);
_this.state = {
overlayVisible: false
};
_this.onInputClick = _this.onInputClick.bind(_assertThisInitialized(_this));
_this.onInputKeydown = _this.onInputKeydown.bind(_assertThisInitialized(_this));
_this.onOverlayEnter = _this.onOverlayEnter.bind(_assertThisInitialized(_this));
_this.onOverlayEntered = _this.onOverlayEntered.bind(_assertThisInitialized(_this));
_this.onOverlayExit = _this.onOverlayExit.bind(_assertThisInitialized(_this));
_this.onOverlayExited = _this.onOverlayExited.bind(_assertThisInitialized(_this));
_this.onPanelClick = _this.onPanelClick.bind(_assertThisInitialized(_this));
_this.onColorMousedown = _this.onColorMousedown.bind(_assertThisInitialized(_this));
_this.onHueMousedown = _this.onHueMousedown.bind(_assertThisInitialized(_this));
_this.onColorDragStart = _this.onColorDragStart.bind(_assertThisInitialized(_this));
_this.onHueDragStart = _this.onHueDragStart.bind(_assertThisInitialized(_this));
_this.onDrag = _this.onDrag.bind(_assertThisInitialized(_this));
_this.onDragEnd = _this.onDragEnd.bind(_assertThisInitialized(_this));
_this.overlayRef = /*#__PURE__*/React.createRef();
_this.inputRef = /*#__PURE__*/React.createRef(_this.props.inputRef);
return _this;
}
_createClass(ColorPicker, [{
key: "onPanelClick",
value: function onPanelClick(event) {
if (!this.props.inline) {
OverlayService.emit('overlay-click', {
originalEvent: event,
target: this.container
});
}
}
}, {
key: "onHueMousedown",
value: function onHueMousedown(event) {
if (this.props.disabled) {
return;
}
this.bindDragListeners();
this.onHueDragStart(event);
}
}, {
key: "onHueDragStart",
value: function onHueDragStart(event) {
if (this.props.disabled) {
return;
}
this.hueDragging = true;
this.pickHue(event);
DomHandler.addClass(this.container, 'p-colorpicker-dragging');
}
}, {
key: "pickHue",
value: function pickHue(event) {
var top = this.hueView.getBoundingClientRect().top + (window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0);
this.hsbValue = this.validateHSB({
h: Math.floor(360 * (150 - Math.max(0, Math.min(150, (event.pageY || event.changedTouches[0].pageY) - top))) / 150),
s: 100,
b: 100
});
this.updateColorSelector();
this.updateHue();
this.updateModel();
}
}, {
key: "onColorMousedown",
value: function onColorMousedown(event) {
if (this.props.disabled) {
return;
}
this.bindDragListeners();
this.onColorDragStart(event);
}
}, {
key: "onColorDragStart",
value: function onColorDragStart(event) {
if (this.props.disabled) {
return;
}
this.colorDragging = true;
this.pickColor(event);
DomHandler.addClass(this.container, 'p-colorpicker-dragging');
event.preventDefault();
}
}, {
key: "onDrag",
value: function onDrag(event) {
if (this.colorDragging) {
this.pickColor(event);
event.preventDefault();
}
if (this.hueDragging) {
this.pickHue(event);
event.preventDefault();
}
}
}, {
key: "onDragEnd",
value: function onDragEnd() {
this.colorDragging = false;
this.hueDragging = false;
DomHandler.removeClass(this.container, 'p-colorpicker-dragging');
this.unbindDragListeners();
}
}, {
key: "bindDragListeners",
value: function bindDragListeners() {
this.bindDocumentMouseMoveListener();
this.bindDocumentMouseUpListener();
}
}, {
key: "unbindDragListeners",
value: function unbindDragListeners() {
this.unbindDocumentMouseMoveListener();
this.unbindDocumentMouseUpListener();
}
}, {
key: "pickColor",
value: function pickColor(event) {
var rect = this.colorSelector.getBoundingClientRect();
var top = rect.top + (window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0);
var left = rect.left + document.body.scrollLeft;
var saturation = Math.floor(100 * Math.max(0, Math.min(150, (event.pageX || event.changedTouches[0].pageX) - left)) / 150);
var brightness = Math.floor(100 * (150 - Math.max(0, Math.min(150, (event.pageY || event.changedTouches[0].pageY) - top))) / 150);
this.hsbValue = this.validateHSB({
h: this.hsbValue.h,
s: saturation,
b: brightness
});
this.updateColorHandle();
this.updateInput();
this.updateModel();
}
}, {
key: "updateModel",
value: function updateModel() {
switch (this.props.format) {
case 'hex':
this.onChange(this.HSBtoHEX(this.hsbValue));
break;
case 'rgb':
this.onChange(this.HSBtoRGB(this.hsbValue));
break;
case 'hsb':
this.onChange(this.hsbValue);
break;
}
}
}, {
key: "toHSB",
value: function toHSB(value) {
var hsb;
if (value) {
switch (this.props.format) {
case 'hex':
hsb = this.HEXtoHSB(value);
break;
case 'rgb':
hsb = this.RGBtoHSB(value);
break;
case 'hsb':
hsb = value;
break;
}
} else {
hsb = this.HEXtoHSB(this.props.defaultColor);
}
return hsb;
}
}, {
key: "updateHSBValue",
value: function updateHSBValue(value) {
this.hsbValue = this.toHSB(value);
}
}, {
key: "areHSBEqual",
value: function areHSBEqual(val1, val2) {
return val1.h === val2.h && val1.s === val2.s && val1.b === val2.b;
}
}, {
key: "onChange",
value: function onChange(value) {
if (this.props.onChange) {
this.props.onChange({
value: value,
stopPropagation: function stopPropagation() {},
preventDefault: function preventDefault() {},
target: {
name: this.props.name,
id: this.props.id,
value: value
}
});
}
}
}, {
key: "updateColorSelector",
value: function updateColorSelector() {
if (this.colorSelector) {
var hsbValue = this.validateHSB({
h: this.hsbValue.h,
s: 100,
b: 100
});
this.colorSelector.style.backgroundColor = '#' + this.HSBtoHEX(hsbValue);
}
}
}, {
key: "updateColorHandle",
value: function updateColorHandle() {
if (this.colorHandle) {
this.colorHandle.style.left = Math.floor(150 * this.hsbValue.s / 100) + 'px';
this.colorHandle.style.top = Math.floor(150 * (100 - this.hsbValue.b) / 100) + 'px';
}
}
}, {
key: "updateHue",
value: function updateHue() {
if (this.hueHandle) {
this.hueHandle.style.top = Math.floor(150 - 150 * this.hsbValue.h / 360) + 'px';
}
}
}, {
key: "updateInput",
value: function updateInput() {
if (this.inputRef && this.inputRef.current) {
this.inputRef.current.style.backgroundColor = '#' + this.HSBtoHEX(this.hsbValue);
}
}
}, {
key: "show",
value: function show() {
this.setState({
overlayVisible: true
});
}
}, {
key: "hide",
value: function hide() {
this.setState({
overlayVisible: false
});
}
}, {
key: "onOverlayEnter",
value: function onOverlayEnter() {
ZIndexUtils.set('overlay', this.overlayRef.current, PrimeReact.autoZIndex, PrimeReact.zIndex['overlay']);
this.alignOverlay();
}
}, {
key: "onOverlayEntered",
value: function onOverlayEntered() {
this.bindDocumentClickListener();
this.bindScrollListener();
this.bindResizeListener();
this.props.onShow && this.props.onShow();
}
}, {
key: "onOverlayExit",
value: function onOverlayExit() {
this.unbindDocumentClickListener();
this.unbindScrollListener();
this.unbindResizeListener();
}
}, {
key: "onOverlayExited",
value: function onOverlayExited() {
ZIndexUtils.clear(this.overlayRef.current);
this.props.onHide && this.props.onHide();
}
}, {
key: "onInputClick",
value: function onInputClick() {
this.togglePanel();
}
}, {
key: "togglePanel",
value: function togglePanel() {
if (this.state.overlayVisible) this.hide();else this.show();
}
}, {
key: "onInputKeydown",
value: function onInputKeydown(event) {
switch (event.which) {
//space
case 32:
this.togglePanel();
event.preventDefault();
break;
//escape and tab
case 27:
case 9:
this.hide();
break;
}
}
}, {
key: "bindDocumentClickListener",
value: function bindDocumentClickListener() {
var _this2 = this;
if (!this.documentClickListener) {
this.documentClickListener = function (event) {
if (_this2.state.overlayVisible && _this2.isOutsideClicked(event)) {
_this2.hide();
}
};
document.addEventListener('click', this.documentClickListener);
}
}
}, {
key: "unbindDocumentClickListener",
value: function unbindDocumentClickListener() {
if (this.documentClickListener) {
document.removeEventListener('click', this.documentClickListener);
this.documentClickListener = null;
}
}
}, {
key: "bindScrollListener",
value: function bindScrollListener() {
var _this3 = this;
if (!this.scrollHandler) {
this.scrollHandler = new ConnectedOverlayScrollHandler(this.container, function () {
if (_this3.state.overlayVisible) {
_this3.hide();
}
});
}
this.scrollHandler.bindScrollListener();
}
}, {
key: "unbindScrollListener",
value: function unbindScrollListener() {
if (this.scrollHandler) {
this.scrollHandler.unbindScrollListener();
}
}
}, {
key: "bindResizeListener",
value: function bindResizeListener() {
var _this4 = this;
if (!this.resizeListener) {
this.resizeListener = function () {
if (_this4.state.overlayVisible && !DomHandler.isTouchDevice()) {
_this4.hide();
}
};
window.addEventListener('resize', this.resizeListener);
}
}
}, {
key: "unbindResizeListener",
value: function unbindResizeListener() {
if (this.resizeListener) {
window.removeEventListener('resize', this.resizeListener);
this.resizeListener = null;
}
}
}, {
key: "isOutsideClicked",
value: function isOutsideClicked(event) {
return this.container && !(this.container.isSameNode(event.target) || this.container.contains(event.target) || this.overlayRef && this.overlayRef.current.contains(event.target));
}
}, {
key: "bindDocumentMouseMoveListener",
value: function bindDocumentMouseMoveListener() {
if (!this.documentMouseMoveListener) {
this.documentMouseMoveListener = this.onDocumentMouseMove.bind(this);
document.addEventListener('mousemove', this.documentMouseMoveListener);
}
}
}, {
key: "onDocumentMouseMove",
value: function onDocumentMouseMove(event) {
if (this.colorDragging) {
this.pickColor(event);
}
if (this.hueDragging) {
this.pickHue(event);
}
}
}, {
key: "unbindDocumentMouseMoveListener",
value: function unbindDocumentMouseMoveListener() {
if (this.documentMouseMoveListener) {
document.removeEventListener('mousemove', this.documentMouseMoveListener);
this.documentMouseMoveListener = null;
}
}
}, {
key: "bindDocumentMouseUpListener",
value: function bindDocumentMouseUpListener() {
if (!this.documentMouseUpListener) {
this.documentMouseUpListener = this.onDocumentMouseUp.bind(this);
document.addEventListener('mouseup', this.documentMouseUpListener);
}
}
}, {
key: "onDocumentMouseUp",
value: function onDocumentMouseUp() {
this.colorDragging = false;
this.hueDragging = false;
DomHandler.removeClass(this.container, 'p-colorpicker-dragging');
this.unbindDocumentMouseMoveListener();
this.unbindDocumentMouseUpListener();
}
}, {
key: "unbindDocumentMouseUpListener",
value: function unbindDocumentMouseUpListener() {
if (this.documentMouseUpListener) {
document.removeEventListener('mouseup', this.documentMouseUpListener);
this.documentMouseUpListener = null;
}
}
}, {
key: "validateHSB",
value: function validateHSB(hsb) {
return {
h: Math.min(360, Math.max(0, hsb.h)),
s: Math.min(100, Math.max(0, hsb.s)),
b: Math.min(100, Math.max(0, hsb.b))
};
}
}, {
key: "validateRGB",
value: function validateRGB(rgb) {
return {
r: Math.min(255, Math.max(0, rgb.r)),
g: Math.min(255, Math.max(0, rgb.g)),
b: Math.min(255, Math.max(0, rgb.b))
};
}
}, {
key: "validateHEX",
value: function validateHEX(hex) {
var len = 6 - hex.length;
if (len > 0) {
var o = [];
for (var i = 0; i < len; i++) {
o.push('0');
}
o.push(hex);
hex = o.join('');
}
return hex;
}
}, {
key: "HEXtoRGB",
value: function HEXtoRGB(hex) {
var hexValue = parseInt(hex.indexOf('#') > -1 ? hex.substring(1) : hex, 16);
return {
r: hexValue >> 16,
g: (hexValue & 0x00FF00) >> 8,
b: hexValue & 0x0000FF
};
}
}, {
key: "HEXtoHSB",
value: function HEXtoHSB(hex) {
return this.RGBtoHSB(this.HEXtoRGB(hex));
}
}, {
key: "RGBtoHSB",
value: function RGBtoHSB(rgb) {
var hsb = {
h: 0,
s: 0,
b: 0
};
var min = Math.min(rgb.r, rgb.g, rgb.b);
var max = Math.max(rgb.r, rgb.g, rgb.b);
var delta = max - min;
hsb.b = max;
hsb.s = max !== 0 ? 255 * delta / max : 0;
if (hsb.s !== 0) {
if (rgb.r === max) {
hsb.h = (rgb.g - rgb.b) / delta;
} else if (rgb.g === max) {
hsb.h = 2 + (rgb.b - rgb.r) / delta;
} else {
hsb.h = 4 + (rgb.r - rgb.g) / delta;
}
} else {
hsb.h = -1;
}
hsb.h *= 60;
if (hsb.h < 0) {
hsb.h += 360;
}
hsb.s *= 100 / 255;
hsb.b *= 100 / 255;
return hsb;
}
}, {
key: "HSBtoRGB",
value: function HSBtoRGB(hsb) {
var rgb = {
r: null,
g: null,
b: null
};
var h = Math.round(hsb.h);
var s = Math.round(hsb.s * 255 / 100);
var v = Math.round(hsb.b * 255 / 100);
if (s === 0) {
rgb = {
r: v,
g: v,
b: v
};
} else {
var t1 = v;
var t2 = (255 - s) * v / 255;
var t3 = (t1 - t2) * (h % 60) / 60;
if (h === 360) h = 0;
if (h < 60) {
rgb.r = t1;
rgb.b = t2;
rgb.g = t2 + t3;
} else if (h < 120) {
rgb.g = t1;
rgb.b = t2;
rgb.r = t1 - t3;
} else if (h < 180) {
rgb.g = t1;
rgb.r = t2;
rgb.b = t2 + t3;
} else if (h < 240) {
rgb.b = t1;
rgb.r = t2;
rgb.g = t1 - t3;
} else if (h < 300) {
rgb.b = t1;
rgb.g = t2;
rgb.r = t2 + t3;
} else if (h < 360) {
rgb.r = t1;
rgb.g = t2;
rgb.b = t1 - t3;
} else {
rgb.r = 0;
rgb.g = 0;
rgb.b = 0;
}
}
return {
r: Math.round(rgb.r),
g: Math.round(rgb.g),
b: Math.round(rgb.b)
};
}
}, {
key: "RGBtoHEX",
value: function RGBtoHEX(rgb) {
var hex = [rgb.r.toString(16), rgb.g.toString(16), rgb.b.toString(16)];
for (var key in hex) {
if (hex[key].length === 1) {
hex[key] = '0' + hex[key];
}
}
return hex.join('');
}
}, {
key: "HSBtoHEX",
value: function HSBtoHEX(hsb) {
return this.RGBtoHEX(this.HSBtoRGB(hsb));
}
}, {
key: "updateInputRef",
value: function updateInputRef() {
var ref = this.props.inputRef;
if (ref) {
if (typeof ref === 'function') {
ref(this.inputRef.current);
} else {
ref.current = this.inputRef.current;
}
}
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
this.updateInputRef();
this.updateHSBValue(this.props.value);
this.updateUI();
if (this.props.tooltip) {
this.renderTooltip();
}
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps) {
if (!this.colorDragging && !this.hueDragging && this.props.value !== prevProps.value) {
this.updateHSBValue(this.props.value);
}
this.updateUI();
if (prevProps.tooltip !== this.props.tooltip || prevProps.tooltipOptions !== this.props.tooltipOptions) {
if (this.tooltip) this.tooltip.update(_objectSpread$G({
content: this.props.tooltip
}, this.props.tooltipOptions || {}));else this.renderTooltip();
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
this.unbindDocumentClickListener();
this.unbindDocumentMouseMoveListener();
this.unbindDocumentMouseUpListener();
this.unbindResizeListener();
if (this.scrollHandler) {
this.scrollHandler.destroy();
this.scrollHandler = null;
}
if (this.tooltip) {
this.tooltip.destroy();
this.tooltip = null;
}
ZIndexUtils.clear(this.overlayRef.current);
}
}, {
key: "updateUI",
value: function updateUI() {
this.updateHue();
this.updateColorHandle();
this.updateInput();
this.updateColorSelector();
}
}, {
key: "alignOverlay",
value: function alignOverlay() {
if (this.inputRef && this.inputRef.current) {
DomHandler.alignOverlay(this.overlayRef.current, this.inputRef.current.parentElement, this.props.appendTo || PrimeReact.appendTo);
}
}
}, {
key: "renderTooltip",
value: function renderTooltip() {
this.tooltip = tip({
target: this.container,
content: this.props.tooltip,
options: this.props.tooltipOptions
});
}
}, {
key: "renderColorSelector",
value: function renderColorSelector() {
var _this5 = this;
return /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this5.colorSelector = el;
},
className: "p-colorpicker-color-selector",
onMouseDown: this.onColorMousedown,
onTouchStart: this.onColorDragStart,
onTouchMove: this.onDrag,
onTouchEnd: this.onDragEnd
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-colorpicker-color"
}, /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this5.colorHandle = el;
},
className: "p-colorpicker-color-handle"
})));
}
}, {
key: "renderHue",
value: function renderHue() {
var _this6 = this;
return /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this6.hueView = el;
},
className: "p-colorpicker-hue",
onMouseDown: this.onHueMousedown,
onTouchStart: this.onHueDragStart,
onTouchMove: this.onDrag,
onTouchEnd: this.onDragEnd
}, /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this6.hueHandle = el;
},
className: "p-colorpicker-hue-handle"
}));
}
}, {
key: "renderContent",
value: function renderContent() {
var colorSelector = this.renderColorSelector();
var hue = this.renderHue();
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-colorpicker-content"
}, colorSelector, hue);
}
}, {
key: "renderInput",
value: function renderInput() {
if (!this.props.inline) {
var inputClassName = classNames('p-colorpicker-preview p-inputtext', {
'p-disabled': this.props.disabled
});
var inputProps = ObjectUtils.findDiffKeys(this.props, ColorPicker.defaultProps);
return /*#__PURE__*/React__default["default"].createElement("input", _extends({
ref: this.inputRef,
type: "text",
className: inputClassName,
readOnly: true,
id: this.props.inputId,
tabIndex: this.props.tabIndex,
disabled: this.props.disabled,
onClick: this.onInputClick,
onKeyDown: this.onInputKeydown
}, inputProps));
}
return null;
}
}, {
key: "render",
value: function render() {
var _this7 = this;
var containerClassName = classNames('p-colorpicker p-component', {
'p-colorpicker-overlay': !this.props.inline
}, this.props.className);
var content = this.renderContent();
var input = this.renderInput();
return /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this7.container = el;
},
id: this.props.id,
style: this.props.style,
className: containerClassName
}, input, /*#__PURE__*/React__default["default"].createElement(ColorPickerPanel, {
ref: this.overlayRef,
appendTo: this.props.appendTo,
inline: this.props.inline,
disabled: this.props.disabled,
onClick: this.onPanelClick,
"in": this.props.inline || this.state.overlayVisible,
onEnter: this.onOverlayEnter,
onEntered: this.onOverlayEntered,
onExit: this.onOverlayExit,
onExited: this.onOverlayExited,
transitionOptions: this.props.transitionOptions
}, content));
}
}]);
return ColorPicker;
}(React.Component);
_defineProperty(ColorPicker, "defaultProps", {
id: null,
inputRef: null,
value: null,
style: null,
className: null,
defaultColor: 'ff0000',
inline: false,
format: 'hex',
appendTo: null,
disabled: false,
tabIndex: null,
inputId: null,
tooltip: null,
tooltipOptions: null,
transitionOptions: null,
onChange: null,
onShow: null,
onHide: null
});
function _createSuper$1W(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1W(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1W() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var Column = /*#__PURE__*/function (_Component) {
_inherits(Column, _Component);
var _super = _createSuper$1W(Column);
function Column() {
_classCallCheck(this, Column);
return _super.apply(this, arguments);
}
return _createClass(Column);
}(React.Component);
_defineProperty(Column, "defaultProps", {
columnKey: null,
field: null,
sortField: null,
filterField: null,
exportField: null,
header: null,
body: null,
footer: null,
sortable: false,
sortableDisabled: false,
sortFunction: null,
dataType: 'text',
filter: false,
filterMatchMode: null,
filterPlaceholder: null,
filterType: 'text',
filterMaxLength: null,
filterElement: null,
filterFunction: null,
filterHeaderStyle: null,
filterHeaderClassName: null,
showFilterMenu: true,
showFilterOperator: true,
showClearButton: true,
showApplyButton: true,
showFilterMatchModes: true,
showFilterMenuOptions: true,
showAddButton: true,
filterMatchModeOptions: null,
maxConstraints: 2,
filterMenuClassName: null,
filterMenuStyle: null,
align: null,
alignHeader: null,
alignFrozen: 'left',
hidden: false,
onFilterClear: null,
onFilterApplyClick: null,
onFilterMatchModeChange: null,
onFilterOperatorChange: null,
onFilterConstraintAdd: null,
onFilterConstraintRemove: null,
filterClear: null,
filterApply: null,
filterHeader: null,
filterFooter: null,
style: null,
className: null,
headerStyle: null,
headerClassName: null,
bodyStyle: null,
bodyClassName: null,
footerStyle: null,
footerClassName: null,
expander: false,
frozen: false,
selectionMode: null,
colSpan: null,
rowSpan: null,
editor: null,
cellEditValidator: null,
cellEditValidatorEvent: 'click',
onBeforeCellEditHide: null,
onBeforeCellEditShow: null,
onCellEditInit: null,
onCellEditComplete: null,
onCellEditCancel: null,
excludeGlobalFilter: false,
rowReorder: false,
rowReorderIcon: 'pi pi-bars',
rowEditor: false,
exportable: true,
reorderable: true
});
function _createSuper$1V(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1V(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1V() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var ColumnGroup = /*#__PURE__*/function (_Component) {
_inherits(ColumnGroup, _Component);
var _super = _createSuper$1V(ColumnGroup);
function ColumnGroup() {
_classCallCheck(this, ColumnGroup);
return _super.apply(this, arguments);
}
return _createClass(ColumnGroup);
}(React.Component);
function _createSuper$1U(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1U(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1U() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var Dialog = /*#__PURE__*/function (_Component) {
_inherits(Dialog, _Component);
var _super = _createSuper$1U(Dialog);
function Dialog(props) {
var _this;
_classCallCheck(this, Dialog);
_this = _super.call(this, props);
_this.state = {
id: props.id,
maskVisible: false,
visible: false
};
if (!_this.props.onMaximize) {
_this.state.maximized = props.maximized;
}
_this.onClose = _this.onClose.bind(_assertThisInitialized(_this));
_this.toggleMaximize = _this.toggleMaximize.bind(_assertThisInitialized(_this));
_this.onDragStart = _this.onDragStart.bind(_assertThisInitialized(_this));
_this.onResizeStart = _this.onResizeStart.bind(_assertThisInitialized(_this));
_this.onMaskClick = _this.onMaskClick.bind(_assertThisInitialized(_this));
_this.onEnter = _this.onEnter.bind(_assertThisInitialized(_this));
_this.onEntered = _this.onEntered.bind(_assertThisInitialized(_this));
_this.onExiting = _this.onExiting.bind(_assertThisInitialized(_this));
_this.onExited = _this.onExited.bind(_assertThisInitialized(_this));
_this.attributeSelector = UniqueComponentId();
_this.dialogRef = /*#__PURE__*/React__default["default"].createRef();
return _this;
}
_createClass(Dialog, [{
key: "onClose",
value: function onClose(event) {
this.props.onHide();
event.preventDefault();
}
}, {
key: "focus",
value: function focus() {
var activeElement = document.activeElement;
var isActiveElementInDialog = activeElement && this.dialogRef && this.dialogRef.current.contains(activeElement);
if (!isActiveElementInDialog && this.props.closable && this.props.showHeader) {
this.closeElement.focus();
}
}
}, {
key: "onMaskClick",
value: function onMaskClick(event) {
if (this.props.dismissableMask && this.props.modal && this.mask === event.target) {
this.onClose(event);
}
this.props.onMaskClick && this.props.onMaskClick(event);
}
}, {
key: "toggleMaximize",
value: function toggleMaximize(event) {
var maximized = !this.maximized;
if (this.props.onMaximize) {
this.props.onMaximize({
originalEvent: event,
maximized: maximized
});
} else {
this.setState({
maximized: maximized
}, this.changeScrollOnMaximizable);
}
event.preventDefault();
}
}, {
key: "onDragStart",
value: function onDragStart(event) {
if (DomHandler.hasClass(event.target, 'p-dialog-header-icon') || DomHandler.hasClass(event.target.parentElement, 'p-dialog-header-icon')) {
return;
}
if (this.props.draggable) {
this.dragging = true;
this.lastPageX = event.pageX;
this.lastPageY = event.pageY;
this.dialogEl.style.margin = '0';
DomHandler.addClass(document.body, 'p-unselectable-text');
if (this.props.onDragStart) {
this.props.onDragStart(event);
}
}
}
}, {
key: "onDrag",
value: function onDrag(event) {
if (this.dragging) {
var width = DomHandler.getOuterWidth(this.dialogEl);
var height = DomHandler.getOuterHeight(this.dialogEl);
var deltaX = event.pageX - this.lastPageX;
var deltaY = event.pageY - this.lastPageY;
var offset = this.dialogEl.getBoundingClientRect();
var leftPos = offset.left + deltaX;
var topPos = offset.top + deltaY;
var viewport = DomHandler.getViewport();
this.dialogEl.style.position = 'fixed';
if (this.props.keepInViewport) {
if (leftPos >= this.props.minX && leftPos + width < viewport.width) {
this.lastPageX = event.pageX;
this.dialogEl.style.left = leftPos + 'px';
}
if (topPos >= this.props.minY && topPos + height < viewport.height) {
this.lastPageY = event.pageY;
this.dialogEl.style.top = topPos + 'px';
}
} else {
this.lastPageX = event.pageX;
this.dialogEl.style.left = leftPos + 'px';
this.lastPageY = event.pageY;
this.dialogEl.style.top = topPos + 'px';
}
if (this.props.onDrag) {
this.props.onDrag(event);
}
}
}
}, {
key: "onDragEnd",
value: function onDragEnd(event) {
if (this.dragging) {
this.dragging = false;
DomHandler.removeClass(document.body, 'p-unselectable-text');
if (this.props.onDragEnd) {
this.props.onDragEnd(event);
}
}
}
}, {
key: "onResizeStart",
value: function onResizeStart(event) {
if (this.props.resizable) {
this.resizing = true;
this.lastPageX = event.pageX;
this.lastPageY = event.pageY;
DomHandler.addClass(document.body, 'p-unselectable-text');
if (this.props.onResizeStart) {
this.props.onResizeStart(event);
}
}
}
}, {
key: "convertToPx",
value: function convertToPx(value, property, viewport) {
!viewport && (viewport = DomHandler.getViewport());
var val = parseInt(value);
if (/^(\d+|(\.\d+))(\.\d+)?%$/.test(value)) {
return val * (viewport[property] / 100);
}
return val;
}
}, {
key: "onResize",
value: function onResize(event) {
if (this.resizing) {
var deltaX = event.pageX - this.lastPageX;
var deltaY = event.pageY - this.lastPageY;
var width = DomHandler.getOuterWidth(this.dialogEl);
var height = DomHandler.getOuterHeight(this.dialogEl);
var offset = this.dialogEl.getBoundingClientRect();
var viewport = DomHandler.getViewport();
var newWidth = width + deltaX;
var newHeight = height + deltaY;
var minWidth = this.convertToPx(this.dialogEl.style.minWidth, 'width', viewport);
var minHeight = this.convertToPx(this.dialogEl.style.minHeight, 'height', viewport);
var hasBeenDragged = !parseInt(this.dialogEl.style.top) || !parseInt(this.dialogEl.style.left);
if (hasBeenDragged) {
newWidth += deltaX;
newHeight += deltaY;
}
if ((!minWidth || newWidth > minWidth) && offset.left + newWidth < viewport.width) {
this.dialogEl.style.width = newWidth + 'px';
}
if ((!minHeight || newHeight > minHeight) && offset.top + newHeight < viewport.height) {
this.dialogEl.style.height = newHeight + 'px';
}
this.lastPageX = event.pageX;
this.lastPageY = event.pageY;
if (this.props.onResize) {
this.props.onResize(event);
}
}
}
}, {
key: "onResizeEnd",
value: function onResizeEnd(event) {
if (this.resizing) {
this.resizing = false;
DomHandler.removeClass(document.body, 'p-unselectable-text');
if (this.props.onResizeEnd) {
this.props.onResizeEnd(event);
}
}
}
}, {
key: "resetPosition",
value: function resetPosition() {
this.dialogEl.style.position = '';
this.dialogEl.style.left = '';
this.dialogEl.style.top = '';
this.dialogEl.style.margin = '';
}
}, {
key: "getPositionClass",
value: function getPositionClass() {
var _this2 = this;
var positions = ['center', 'left', 'right', 'top', 'top-left', 'top-right', 'bottom', 'bottom-left', 'bottom-right'];
var pos = positions.find(function (item) {
return item === _this2.props.position || item.replace('-', '') === _this2.props.position;
});
return pos ? "p-dialog-".concat(pos) : '';
}
}, {
key: "maximized",
get: function get() {
return this.props.onMaximize ? this.props.maximized : this.state.maximized;
}
}, {
key: "dialogEl",
get: function get() {
return this.dialogRef.current;
}
}, {
key: "onEnter",
value: function onEnter() {
this.dialogEl.setAttribute(this.attributeSelector, '');
}
}, {
key: "onEntered",
value: function onEntered() {
if (this.props.onShow) {
this.props.onShow();
}
if (this.props.focusOnShow) {
this.focus();
}
this.enableDocumentSettings();
}
}, {
key: "onExiting",
value: function onExiting() {
if (this.props.modal) {
DomHandler.addClass(this.mask, 'p-component-overlay-leave');
}
}
}, {
key: "onExited",
value: function onExited() {
this.dragging = false;
ZIndexUtils.clear(this.mask);
this.setState({
maskVisible: false
});
this.disableDocumentSettings();
}
}, {
key: "enableDocumentSettings",
value: function enableDocumentSettings() {
this.bindGlobalListeners();
if (this.props.blockScroll || this.props.maximizable && this.maximized) {
DomHandler.addClass(document.body, 'p-overflow-hidden');
}
}
}, {
key: "disableDocumentSettings",
value: function disableDocumentSettings() {
this.unbindGlobalListeners();
if (this.props.modal) {
var hasBlockScroll = document.primeDialogParams && document.primeDialogParams.some(function (param) {
return param.hasBlockScroll;
});
if (!hasBlockScroll) {
DomHandler.removeClass(document.body, 'p-overflow-hidden');
}
} else if (this.props.blockScroll || this.props.maximizable && this.maximized) {
DomHandler.removeClass(document.body, 'p-overflow-hidden');
}
}
}, {
key: "bindGlobalListeners",
value: function bindGlobalListeners() {
if (this.props.draggable) {
this.bindDocumentDragListener();
}
if (this.props.resizable) {
this.bindDocumentResizeListeners();
}
if (this.props.closable) {
this.bindDocumentKeyDownListener();
}
}
}, {
key: "unbindGlobalListeners",
value: function unbindGlobalListeners() {
this.unbindDocumentDragListener();
this.unbindDocumentResizeListeners();
this.unbindDocumentKeyDownListener();
}
}, {
key: "bindDocumentDragListener",
value: function bindDocumentDragListener() {
this.documentDragListener = this.onDrag.bind(this);
this.documentDragEndListener = this.onDragEnd.bind(this);
window.document.addEventListener('mousemove', this.documentDragListener);
window.document.addEventListener('mouseup', this.documentDragEndListener);
}
}, {
key: "unbindDocumentDragListener",
value: function unbindDocumentDragListener() {
if (this.documentDragListener && this.documentDragEndListener) {
window.document.removeEventListener('mousemove', this.documentDragListener);
window.document.removeEventListener('mouseup', this.documentDragEndListener);
this.documentDragListener = null;
this.documentDragEndListener = null;
}
}
}, {
key: "bindDocumentResizeListeners",
value: function bindDocumentResizeListeners() {
this.documentResizeListener = this.onResize.bind(this);
this.documentResizeEndListener = this.onResizeEnd.bind(this);
window.document.addEventListener('mousemove', this.documentResizeListener);
window.document.addEventListener('mouseup', this.documentResizeEndListener);
}
}, {
key: "unbindDocumentResizeListeners",
value: function unbindDocumentResizeListeners() {
if (this.documentResizeListener && this.documentResizeEndListener) {
window.document.removeEventListener('mousemove', this.documentResizeListener);
window.document.removeEventListener('mouseup', this.documentResizeEndListener);
this.documentResizeListener = null;
this.documentResizeEndListener = null;
}
}
}, {
key: "bindDocumentKeyDownListener",
value: function bindDocumentKeyDownListener() {
var _this3 = this;
this.documentKeyDownListener = function (event) {
var currentTarget = event.currentTarget;
if (currentTarget && currentTarget.primeDialogParams) {
var params = currentTarget.primeDialogParams;
var paramLength = params.length;
var dialogId = params[paramLength - 1] ? params[paramLength - 1].id : undefined;
if (dialogId === _this3.state.id && _this3.props.closeOnEscape) {
var dialog = document.getElementById(dialogId);
if (event.which === 27) {
_this3.onClose(event);
event.stopImmediatePropagation();
params.splice(paramLength - 1, 1);
} else if (event.which === 9) {
event.preventDefault();
var focusableElements = DomHandler.getFocusableElements(dialog);
if (focusableElements && focusableElements.length > 0) {
if (!document.activeElement) {
focusableElements[0].focus();
} else {
var focusedIndex = focusableElements.indexOf(document.activeElement);
if (event.shiftKey) {
if (focusedIndex === -1 || focusedIndex === 0) focusableElements[focusableElements.length - 1].focus();else focusableElements[focusedIndex - 1].focus();
} else {
if (focusedIndex === -1 || focusedIndex === focusableElements.length - 1) focusableElements[0].focus();else focusableElements[focusedIndex + 1].focus();
}
}
}
}
}
}
};
var newParam = {
id: this.state.id,
hasBlockScroll: this.props.blockScroll
};
document.primeDialogParams = document.primeDialogParams ? [].concat(_toConsumableArray(document.primeDialogParams), [newParam]) : [newParam];
document.addEventListener('keydown', this.documentKeyDownListener);
}
}, {
key: "unbindDocumentKeyDownListener",
value: function unbindDocumentKeyDownListener() {
var _this4 = this;
if (this.documentKeyDownListener) {
document.removeEventListener('keydown', this.documentKeyDownListener);
document.primeDialogParams = document.primeDialogParams && document.primeDialogParams.filter(function (param) {
return param.id !== _this4.state.id;
});
this.documentKeyDownListener = null;
}
}
}, {
key: "createStyle",
value: function createStyle() {
if (!this.styleElement) {
this.styleElement = DomHandler.createInlineStyle(PrimeReact.nonce);
var innerHTML = '';
for (var breakpoint in this.props.breakpoints) {
innerHTML += "\n @media screen and (max-width: ".concat(breakpoint, ") {\n .p-dialog[").concat(this.attributeSelector, "] {\n width: ").concat(this.props.breakpoints[breakpoint], " !important;\n }\n }\n ");
}
this.styleElement.innerHTML = innerHTML;
}
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
var _this5 = this;
if (!this.state.id) {
this.setState({
id: UniqueComponentId()
});
}
if (this.props.visible) {
this.setState({
maskVisible: true
}, function () {
ZIndexUtils.set('modal', _this5.mask, PrimeReact.autoZIndex, _this5.props.baseZIndex || PrimeReact.zIndex['modal']);
_this5.setState({
visible: true
});
});
}
if (this.props.breakpoints) {
this.createStyle();
}
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps) {
var _this6 = this;
if (this.props.visible && !this.state.maskVisible) {
this.setState({
maskVisible: true
}, function () {
ZIndexUtils.set('modal', _this6.mask, PrimeReact.autoZIndex, _this6.props.baseZIndex || PrimeReact.zIndex['modal']);
});
}
if (this.props.visible !== this.state.visible && this.state.maskVisible) {
this.setState({
visible: this.props.visible
});
}
if (prevProps.maximized !== this.props.maximized && this.props.onMaximize) {
this.changeScrollOnMaximizable();
}
}
}, {
key: "changeScrollOnMaximizable",
value: function changeScrollOnMaximizable() {
if (!this.props.blockScroll) {
var funcName = this.maximized ? 'addClass' : 'removeClass';
DomHandler[funcName](document.body, 'p-overflow-hidden');
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
this.disableDocumentSettings();
this.styleElement = DomHandler.removeInlineStyle(this.styleElement);
ZIndexUtils.clear(this.mask);
}
}, {
key: "renderCloseIcon",
value: function renderCloseIcon() {
var _this7 = this;
if (this.props.closable) {
return /*#__PURE__*/React__default["default"].createElement("button", {
ref: function ref(el) {
return _this7.closeElement = el;
},
type: "button",
className: "p-dialog-header-icon p-dialog-header-close p-link",
"aria-label": this.props.ariaCloseIconLabel,
onClick: this.onClose
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-dialog-header-close-icon pi pi-times"
}), /*#__PURE__*/React__default["default"].createElement(Ripple, null));
}
return null;
}
}, {
key: "renderMaximizeIcon",
value: function renderMaximizeIcon() {
var iconClassName = classNames('p-dialog-header-maximize-icon pi', {
'pi-window-maximize': !this.maximized,
'pi-window-minimize': this.maximized
});
if (this.props.maximizable) {
return /*#__PURE__*/React__default["default"].createElement("button", {
type: "button",
className: "p-dialog-header-icon p-dialog-header-maximize p-link",
onClick: this.toggleMaximize
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: iconClassName
}), /*#__PURE__*/React__default["default"].createElement(Ripple, null));
}
return null;
}
}, {
key: "renderHeader",
value: function renderHeader() {
var _this8 = this;
if (this.props.showHeader) {
var closeIcon = this.renderCloseIcon();
var maximizeIcon = this.renderMaximizeIcon();
var icons = ObjectUtils.getJSXElement(this.props.icons, this.props);
var header = ObjectUtils.getJSXElement(this.props.header, this.props);
return /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this8.headerEl = el;
},
className: "p-dialog-header",
onMouseDown: this.onDragStart
}, /*#__PURE__*/React__default["default"].createElement("div", {
id: this.state.id + '_header',
className: "p-dialog-title"
}, header), /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-dialog-header-icons"
}, icons, maximizeIcon, closeIcon));
}
return null;
}
}, {
key: "renderContent",
value: function renderContent() {
var _this9 = this;
var contentClassName = classNames('p-dialog-content', this.props.contentClassName);
return /*#__PURE__*/React__default["default"].createElement("div", {
id: this.state.id + '_content',
ref: function ref(el) {
return _this9.contentEl = el;
},
className: contentClassName,
style: this.props.contentStyle
}, this.props.children);
}
}, {
key: "renderFooter",
value: function renderFooter() {
var _this10 = this;
var footer = ObjectUtils.getJSXElement(this.props.footer, this.props);
return footer && /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this10.footerElement = el;
},
className: "p-dialog-footer"
}, footer);
}
}, {
key: "renderResizer",
value: function renderResizer() {
if (this.props.resizable) {
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-resizable-handle",
style: {
zIndex: 90
},
onMouseDown: this.onResizeStart
});
}
return null;
}
}, {
key: "renderElement",
value: function renderElement() {
var _this11 = this;
var className = classNames('p-dialog p-component', this.props.className, {
'p-dialog-rtl': this.props.rtl,
'p-dialog-maximized': this.maximized
});
var maskClassName = classNames('p-dialog-mask', {
'p-component-overlay p-component-overlay-enter': this.props.modal,
'p-dialog-visible': this.state.maskVisible,
'p-dialog-draggable': this.props.draggable,
'p-dialog-resizable': this.props.resizable
}, this.props.maskClassName, this.getPositionClass());
var header = this.renderHeader();
var content = this.renderContent();
var footer = this.renderFooter();
var resizer = this.renderResizer();
var transitionTimeout = {
enter: this.props.position === 'center' ? 150 : 300,
exit: this.props.position === 'center' ? 150 : 300
};
return /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this11.mask = el;
},
style: this.props.maskStyle,
className: maskClassName,
onClick: this.onMaskClick
}, /*#__PURE__*/React__default["default"].createElement(CSSTransition, {
nodeRef: this.dialogRef,
classNames: "p-dialog",
timeout: transitionTimeout,
"in": this.state.visible,
options: this.props.transitionOptions,
unmountOnExit: true,
onEnter: this.onEnter,
onEntered: this.onEntered,
onExiting: this.onExiting,
onExited: this.onExited
}, /*#__PURE__*/React__default["default"].createElement("div", {
ref: this.dialogRef,
id: this.state.id,
className: className,
style: this.props.style,
onClick: this.props.onClick,
role: "dialog",
"aria-labelledby": this.state.id + '_header',
"aria-describedby": this.state.id + '_content',
"aria-modal": this.props.modal
}, header, content, footer, resizer)));
}
}, {
key: "render",
value: function render() {
if (this.state.maskVisible) {
var element = this.renderElement();
return /*#__PURE__*/React__default["default"].createElement(Portal, {
element: element,
appendTo: this.props.appendTo,
visible: true
});
}
return null;
}
}]);
return Dialog;
}(React.Component);
_defineProperty(Dialog, "defaultProps", {
id: null,
header: null,
footer: null,
visible: false,
position: 'center',
draggable: true,
resizable: true,
modal: true,
onHide: null,
onShow: null,
contentStyle: null,
contentClassName: null,
closeOnEscape: true,
dismissableMask: false,
rtl: false,
closable: true,
style: null,
className: null,
maskStyle: null,
maskClassName: null,
showHeader: true,
appendTo: null,
baseZIndex: 0,
maximizable: false,
blockScroll: false,
icons: null,
ariaCloseIconLabel: 'Close',
focusOnShow: true,
minX: 0,
minY: 0,
keepInViewport: true,
maximized: false,
breakpoints: null,
transitionOptions: null,
onMaximize: null,
onDragStart: null,
onDrag: null,
onDragEnd: null,
onResizeStart: null,
onResize: null,
onResizeEnd: null,
onClick: null,
onMaskClick: null
});
function _createSuper$1T(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1T(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1T() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
function ownKeys$F(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$F(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$F(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$F(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function confirmDialog(props) {
var appendTo = props.appendTo || document.body;
var confirmDialogWrapper = document.createDocumentFragment();
DomHandler.appendChild(confirmDialogWrapper, appendTo);
props = _objectSpread$F(_objectSpread$F({}, props), {
visible: props.visible === undefined ? true : props.visible
});
var confirmDialogEl = /*#__PURE__*/React__default["default"].createElement(ConfirmDialog, props);
ReactDOM__default["default"].render(confirmDialogEl, confirmDialogWrapper);
var updateConfirmDialog = function updateConfirmDialog(newProps) {
props = _objectSpread$F(_objectSpread$F({}, props), newProps);
ReactDOM__default["default"].render( /*#__PURE__*/React__default["default"].cloneElement(confirmDialogEl, props), confirmDialogWrapper);
};
return {
_destroy: function _destroy() {
ReactDOM__default["default"].unmountComponentAtNode(confirmDialogWrapper);
},
show: function show() {
updateConfirmDialog({
visible: true,
onHide: function onHide() {
updateConfirmDialog({
visible: false
}); // reset
}
});
},
hide: function hide() {
updateConfirmDialog({
visible: false
});
},
update: function update(newProps) {
updateConfirmDialog(newProps);
}
};
}
var ConfirmDialog = /*#__PURE__*/function (_Component) {
_inherits(ConfirmDialog, _Component);
var _super = _createSuper$1T(ConfirmDialog);
function ConfirmDialog(props) {
var _this;
_classCallCheck(this, ConfirmDialog);
_this = _super.call(this, props);
_this.state = {
visible: props.visible
};
_this.reject = _this.reject.bind(_assertThisInitialized(_this));
_this.accept = _this.accept.bind(_assertThisInitialized(_this));
_this.hide = _this.hide.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(ConfirmDialog, [{
key: "acceptLabel",
value: function acceptLabel() {
return this.props.acceptLabel || localeOption('accept');
}
}, {
key: "rejectLabel",
value: function rejectLabel() {
return this.props.rejectLabel || localeOption('reject');
}
}, {
key: "accept",
value: function accept() {
if (this.props.accept) {
this.props.accept();
}
this.hide('accept');
}
}, {
key: "reject",
value: function reject() {
if (this.props.reject) {
this.props.reject();
}
this.hide('reject');
}
}, {
key: "show",
value: function show() {
this.setState({
visible: true
});
}
}, {
key: "hide",
value: function hide(result) {
var _this2 = this;
this.setState({
visible: false
}, function () {
if (_this2.props.onHide) {
_this2.props.onHide(result);
}
});
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps) {
if (prevProps.visible !== this.props.visible) {
this.setState({
visible: this.props.visible
});
}
}
}, {
key: "renderFooter",
value: function renderFooter() {
var acceptClassName = classNames('p-confirm-dialog-accept', this.props.acceptClassName);
var rejectClassName = classNames('p-confirm-dialog-reject', {
'p-button-text': !this.props.rejectClassName
}, this.props.rejectClassName);
var content = /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(Button, {
label: this.rejectLabel(),
icon: this.props.rejectIcon,
className: rejectClassName,
onClick: this.reject
}), /*#__PURE__*/React__default["default"].createElement(Button, {
label: this.acceptLabel(),
icon: this.props.acceptIcon,
className: acceptClassName,
onClick: this.accept,
autoFocus: true
}));
if (this.props.footer) {
var defaultContentOptions = {
accept: this.accept,
reject: this.reject,
acceptClassName: acceptClassName,
rejectClassName: rejectClassName,
acceptLabel: this.acceptLabel(),
rejectLabel: this.rejectLabel(),
element: content,
props: this.props
};
return ObjectUtils.getJSXElement(this.props.footer, defaultContentOptions);
}
return content;
}
}, {
key: "renderElement",
value: function renderElement() {
var className = classNames('p-confirm-dialog', this.props.className);
var dialogProps = ObjectUtils.findDiffKeys(this.props, ConfirmDialog.defaultProps);
var message = ObjectUtils.getJSXElement(this.props.message, this.props);
var footer = this.renderFooter();
return /*#__PURE__*/React__default["default"].createElement(Dialog, _extends({
visible: this.state.visible
}, dialogProps, {
className: className,
footer: footer,
onHide: this.hide,
breakpoints: this.props.breakpoints
}), IconUtils.getJSXIcon(this.props.icon, {
className: 'p-confirm-dialog-icon'
}, {
props: this.props
}), /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-confirm-dialog-message"
}, message));
}
}, {
key: "render",
value: function render() {
var element = this.renderElement();
return /*#__PURE__*/React__default["default"].createElement(Portal, {
element: element,
appendTo: this.props.appendTo
});
}
}]);
return ConfirmDialog;
}(React.Component);
_defineProperty(ConfirmDialog, "defaultProps", {
visible: false,
message: null,
rejectLabel: null,
acceptLabel: null,
icon: null,
rejectIcon: null,
acceptIcon: null,
rejectClassName: null,
acceptClassName: null,
className: null,
appendTo: null,
footer: null,
breakpoints: null,
onHide: null,
accept: null,
reject: null
});
function _createSuper$1S(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1S(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1S() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
function ownKeys$E(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$E(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$E(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$E(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function confirmPopup(props) {
var appendTo = props.appendTo || document.body;
var confirmPopupWrapper = document.createDocumentFragment();
DomHandler.appendChild(confirmPopupWrapper, appendTo);
props = _objectSpread$E(_objectSpread$E({}, props), {
visible: props.visible === undefined ? true : props.visible
});
var confirmPopupEl = /*#__PURE__*/React__default["default"].createElement(ConfirmPopup, props);
ReactDOM__default["default"].render(confirmPopupEl, confirmPopupWrapper);
var updateConfirmPopup = function updateConfirmPopup(newProps) {
props = _objectSpread$E(_objectSpread$E({}, props), newProps);
ReactDOM__default["default"].render( /*#__PURE__*/React__default["default"].cloneElement(confirmPopupEl, props), confirmPopupWrapper);
};
return {
_destroy: function _destroy() {
ReactDOM__default["default"].unmountComponentAtNode(confirmPopupWrapper);
},
show: function show() {
updateConfirmPopup({
visible: true,
onHide: function onHide() {
updateConfirmPopup({
visible: false
}); // reset
}
});
},
hide: function hide() {
updateConfirmPopup({
visible: false
});
},
update: function update(newProps) {
updateConfirmPopup(newProps);
}
};
}
var ConfirmPopup = /*#__PURE__*/function (_Component) {
_inherits(ConfirmPopup, _Component);
var _super = _createSuper$1S(ConfirmPopup);
function ConfirmPopup(props) {
var _this;
_classCallCheck(this, ConfirmPopup);
_this = _super.call(this, props);
_this.state = {
visible: false
};
_this.reject = _this.reject.bind(_assertThisInitialized(_this));
_this.accept = _this.accept.bind(_assertThisInitialized(_this));
_this.hide = _this.hide.bind(_assertThisInitialized(_this));
_this.onCloseClick = _this.onCloseClick.bind(_assertThisInitialized(_this));
_this.onPanelClick = _this.onPanelClick.bind(_assertThisInitialized(_this));
_this.onEnter = _this.onEnter.bind(_assertThisInitialized(_this));
_this.onEntered = _this.onEntered.bind(_assertThisInitialized(_this));
_this.onExit = _this.onExit.bind(_assertThisInitialized(_this));
_this.onExited = _this.onExited.bind(_assertThisInitialized(_this));
_this.overlayRef = /*#__PURE__*/React__default["default"].createRef();
_this.acceptBtnRef = /*#__PURE__*/React__default["default"].createRef();
return _this;
}
_createClass(ConfirmPopup, [{
key: "acceptLabel",
value: function acceptLabel() {
return this.props.acceptLabel || localeOption('accept');
}
}, {
key: "rejectLabel",
value: function rejectLabel() {
return this.props.rejectLabel || localeOption('reject');
}
}, {
key: "bindDocumentClickListener",
value: function bindDocumentClickListener() {
var _this2 = this;
if (!this.documentClickListener && this.props.dismissable) {
this.documentClickListener = function (event) {
if (!_this2.isPanelClicked && _this2.isOutsideClicked(event.target)) {
_this2.hide();
}
_this2.isPanelClicked = false;
};
document.addEventListener('click', this.documentClickListener);
}
}
}, {
key: "unbindDocumentClickListener",
value: function unbindDocumentClickListener() {
if (this.documentClickListener) {
document.removeEventListener('click', this.documentClickListener);
this.documentClickListener = null;
}
}
}, {
key: "bindScrollListener",
value: function bindScrollListener() {
var _this3 = this;
if (!this.scrollHandler) {
this.scrollHandler = new ConnectedOverlayScrollHandler(this.props.target, function () {
if (_this3.state.visible) {
_this3.hide();
}
});
}
this.scrollHandler.bindScrollListener();
}
}, {
key: "unbindScrollListener",
value: function unbindScrollListener() {
if (this.scrollHandler) {
this.scrollHandler.unbindScrollListener();
}
}
}, {
key: "bindResizeListener",
value: function bindResizeListener() {
var _this4 = this;
if (!this.resizeListener) {
this.resizeListener = function () {
if (_this4.state.visible && !DomHandler.isTouchDevice()) {
_this4.hide();
}
};
window.addEventListener('resize', this.resizeListener);
}
}
}, {
key: "unbindResizeListener",
value: function unbindResizeListener() {
if (this.resizeListener) {
window.removeEventListener('resize', this.resizeListener);
this.resizeListener = null;
}
}
}, {
key: "isOutsideClicked",
value: function isOutsideClicked(target) {
return this.overlayRef && this.overlayRef.current && !(this.overlayRef.current.isSameNode(target) || this.overlayRef.current.contains(target));
}
}, {
key: "onCloseClick",
value: function onCloseClick(event) {
this.hide();
event.preventDefault();
}
}, {
key: "onPanelClick",
value: function onPanelClick(event) {
this.isPanelClicked = true;
OverlayService.emit('overlay-click', {
originalEvent: event,
target: this.props.target
});
}
}, {
key: "accept",
value: function accept() {
if (this.props.accept) {
this.props.accept();
}
this.hide('accept');
}
}, {
key: "reject",
value: function reject() {
if (this.props.reject) {
this.props.reject();
}
this.hide('reject');
}
}, {
key: "show",
value: function show() {
var _this5 = this;
this.setState({
visible: true
}, function () {
_this5.overlayEventListener = function (e) {
if (!_this5.isOutsideClicked(e.target)) {
_this5.isPanelClicked = true;
}
};
OverlayService.on('overlay-click', _this5.overlayEventListener);
});
}
}, {
key: "hide",
value: function hide(result) {
var _this6 = this;
this.setState({
visible: false
}, function () {
OverlayService.off('overlay-click', _this6.overlayEventListener);
_this6.overlayEventListener = null;
if (_this6.props.onHide) {
_this6.props.onHide(result);
}
});
}
}, {
key: "onEnter",
value: function onEnter() {
ZIndexUtils.set('overlay', this.overlayRef.current, PrimeReact.autoZIndex, PrimeReact.zIndex['overlay']);
this.align();
}
}, {
key: "onEntered",
value: function onEntered() {
this.bindDocumentClickListener();
this.bindScrollListener();
this.bindResizeListener();
if (this.acceptBtnRef && this.acceptBtnRef.current) {
this.acceptBtnRef.current.focus();
}
this.props.onShow && this.props.onShow();
}
}, {
key: "onExit",
value: function onExit() {
this.unbindDocumentClickListener();
this.unbindScrollListener();
this.unbindResizeListener();
}
}, {
key: "onExited",
value: function onExited() {
ZIndexUtils.clear(this.overlayRef.current);
}
}, {
key: "align",
value: function align() {
if (this.props.target) {
DomHandler.absolutePosition(this.overlayRef.current, this.props.target);
var containerOffset = DomHandler.getOffset(this.overlayRef.current);
var targetOffset = DomHandler.getOffset(this.props.target);
var arrowLeft = 0;
if (containerOffset.left < targetOffset.left) {
arrowLeft = targetOffset.left - containerOffset.left;
}
this.overlayRef.current.style.setProperty('--overlayArrowLeft', "".concat(arrowLeft, "px"));
if (containerOffset.top < targetOffset.top) {
DomHandler.addClass(this.overlayRef.current, 'p-confirm-popup-flipped');
}
}
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
if (this.props.visible) {
this.setState({
visible: true
});
}
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps) {
if (prevProps.visible !== this.props.visible) {
this.setState({
visible: this.props.visible
});
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
this.unbindDocumentClickListener();
this.unbindResizeListener();
if (this.scrollHandler) {
this.scrollHandler.destroy();
this.scrollHandler = null;
}
if (this.overlayEventListener) {
OverlayService.off('overlay-click', this.overlayEventListener);
this.overlayEventListener = null;
}
ZIndexUtils.clear(this.overlayRef.current);
}
}, {
key: "renderContent",
value: function renderContent() {
var message = ObjectUtils.getJSXElement(this.props.message, this.props);
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-confirm-popup-content"
}, IconUtils.getJSXIcon(this.props.icon, {
className: 'p-confirm-popup-icon'
}, {
props: this.props
}), /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-confirm-popup-message"
}, message));
}
}, {
key: "renderFooter",
value: function renderFooter() {
var acceptClassName = classNames('p-confirm-popup-accept p-button-sm', this.props.acceptClassName);
var rejectClassName = classNames('p-confirm-popup-reject p-button-sm', {
'p-button-text': !this.props.rejectClassName
}, this.props.rejectClassName);
var content = /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-confirm-popup-footer"
}, /*#__PURE__*/React__default["default"].createElement(Button, {
label: this.rejectLabel(),
icon: this.props.rejectIcon,
className: rejectClassName,
onClick: this.reject
}), /*#__PURE__*/React__default["default"].createElement(Button, {
ref: this.acceptBtnRef,
label: this.acceptLabel(),
icon: this.props.acceptIcon,
className: acceptClassName,
onClick: this.accept
}));
if (this.props.footer) {
var defaultContentOptions = {
accept: this.accept,
reject: this.reject,
className: 'p-confirm-popup-footer',
acceptClassName: acceptClassName,
rejectClassName: rejectClassName,
acceptLabel: this.acceptLabel(),
rejectLabel: this.rejectLabel(),
element: content,
props: this.props
};
return ObjectUtils.getJSXElement(this.props.footer, defaultContentOptions);
}
return content;
}
}, {
key: "renderElement",
value: function renderElement() {
var className = classNames('p-confirm-popup p-component', this.props.className);
var content = this.renderContent();
var footer = this.renderFooter();
return /*#__PURE__*/React__default["default"].createElement(CSSTransition, {
nodeRef: this.overlayRef,
classNames: "p-connected-overlay",
"in": this.state.visible,
timeout: {
enter: 120,
exit: 100
},
options: this.props.transitionOptions,
unmountOnExit: true,
onEnter: this.onEnter,
onEntered: this.onEntered,
onExit: this.onExit,
onExited: this.onExited
}, /*#__PURE__*/React__default["default"].createElement("div", {
ref: this.overlayRef,
id: this.props.id,
className: className,
style: this.props.style,
onClick: this.onPanelClick
}, content, footer));
}
}, {
key: "render",
value: function render() {
var element = this.renderElement();
return /*#__PURE__*/React__default["default"].createElement(Portal, {
element: element,
appendTo: this.props.appendTo,
visible: this.props.visible
});
}
}]);
return ConfirmPopup;
}(React.Component);
_defineProperty(ConfirmPopup, "defaultProps", {
target: null,
visible: false,
message: null,
rejectLabel: null,
acceptLabel: null,
icon: null,
rejectIcon: null,
acceptIcon: null,
rejectClassName: null,
acceptClassName: null,
className: null,
style: null,
appendTo: null,
dismissable: true,
footer: null,
onShow: null,
onHide: null,
accept: null,
reject: null,
transitionOptions: null
});
function _createSuper$1R(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1R(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1R() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var ContextMenuSub = /*#__PURE__*/function (_Component) {
_inherits(ContextMenuSub, _Component);
var _super = _createSuper$1R(ContextMenuSub);
function ContextMenuSub(props) {
var _this;
_classCallCheck(this, ContextMenuSub);
_this = _super.call(this, props);
_this.state = {
activeItem: null
};
_this.onEnter = _this.onEnter.bind(_assertThisInitialized(_this));
_this.submenuRef = /*#__PURE__*/React__default["default"].createRef();
return _this;
}
_createClass(ContextMenuSub, [{
key: "onItemMouseEnter",
value: function onItemMouseEnter(event, item) {
if (item.disabled) {
event.preventDefault();
return;
}
this.setState({
activeItem: item
});
}
}, {
key: "onItemClick",
value: function onItemClick(event, item) {
if (item.disabled) {
event.preventDefault();
return;
}
if (!item.url) {
event.preventDefault();
}
if (item.command) {
item.command({
originalEvent: event,
item: item
});
}
if (!item.items) {
this.props.onLeafClick(event);
}
}
}, {
key: "position",
value: function position() {
var parentItem = this.submenuRef.current.parentElement;
var containerOffset = DomHandler.getOffset(this.submenuRef.current.parentElement);
var viewport = DomHandler.getViewport();
var sublistWidth = this.submenuRef.current.offsetParent ? this.submenuRef.current.offsetWidth : DomHandler.getHiddenElementOuterWidth(this.submenuRef.current);
var itemOuterWidth = DomHandler.getOuterWidth(parentItem.children[0]);
this.submenuRef.current.style.top = '0px';
if (parseInt(containerOffset.left, 10) + itemOuterWidth + sublistWidth > viewport.width - DomHandler.calculateScrollbarWidth()) {
this.submenuRef.current.style.left = -1 * sublistWidth + 'px';
} else {
this.submenuRef.current.style.left = itemOuterWidth + 'px';
}
}
}, {
key: "onEnter",
value: function onEnter() {
this.position();
}
}, {
key: "isActive",
value: function isActive() {
return this.props.root || !this.props.resetMenu;
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate() {
if (this.isActive()) {
this.position();
}
}
}, {
key: "renderSeparator",
value: function renderSeparator(index) {
return /*#__PURE__*/React__default["default"].createElement("li", {
key: 'separator_' + index,
className: "p-menu-separator",
role: "separator"
});
}
}, {
key: "renderSubmenu",
value: function renderSubmenu(item) {
if (item.items) {
return /*#__PURE__*/React__default["default"].createElement(ContextMenuSub, {
model: item.items,
resetMenu: item !== this.state.activeItem,
onLeafClick: this.props.onLeafClick
});
}
return null;
}
}, {
key: "renderMenuitem",
value: function renderMenuitem(item, index) {
var _this2 = this;
var active = this.state.activeItem === item;
var className = classNames('p-menuitem', {
'p-menuitem-active': active
}, item.className);
var linkClassName = classNames('p-menuitem-link', {
'p-disabled': item.disabled
});
var iconClassName = classNames('p-menuitem-icon', item.icon);
var submenuIconClassName = 'p-submenu-icon pi pi-angle-right';
var icon = item.icon && /*#__PURE__*/React__default["default"].createElement("span", {
className: iconClassName
});
var label = item.label && /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-menuitem-text"
}, item.label);
var submenuIcon = item.items && /*#__PURE__*/React__default["default"].createElement("span", {
className: submenuIconClassName
});
var submenu = this.renderSubmenu(item);
var content = /*#__PURE__*/React__default["default"].createElement("a", {
href: item.url || '#',
className: linkClassName,
target: item.target,
onClick: function onClick(event) {
return _this2.onItemClick(event, item, index);
},
role: "menuitem",
"aria-haspopup": item.items != null,
"aria-disabled": item.disabled
}, icon, label, submenuIcon, /*#__PURE__*/React__default["default"].createElement(Ripple, null));
if (item.template) {
var defaultContentOptions = {
onClick: function onClick(event) {
return _this2.onItemClick(event, item, index);
},
className: linkClassName,
labelClassName: 'p-menuitem-text',
iconClassName: iconClassName,
submenuIconClassName: submenuIconClassName,
element: content,
props: this.props,
active: active
};
content = ObjectUtils.getJSXElement(item.template, item, defaultContentOptions);
}
return /*#__PURE__*/React__default["default"].createElement("li", {
key: item.label + '_' + index,
role: "none",
className: className,
style: item.style,
onMouseEnter: function onMouseEnter(event) {
return _this2.onItemMouseEnter(event, item);
}
}, content, submenu);
}
}, {
key: "renderItem",
value: function renderItem(item, index) {
if (item.separator) return this.renderSeparator(index);else return this.renderMenuitem(item, index);
}
}, {
key: "renderMenu",
value: function renderMenu() {
var _this3 = this;
if (this.props.model) {
return this.props.model.map(function (item, index) {
return _this3.renderItem(item, index);
});
}
return null;
}
}, {
key: "render",
value: function render() {
var className = classNames({
'p-submenu-list': !this.props.root
});
var submenu = this.renderMenu();
var isActive = this.isActive();
return /*#__PURE__*/React__default["default"].createElement(CSSTransition, {
nodeRef: this.submenuRef,
classNames: "p-contextmenusub",
"in": isActive,
timeout: {
enter: 0,
exit: 0
},
unmountOnExit: true,
onEnter: this.onEnter
}, /*#__PURE__*/React__default["default"].createElement("ul", {
ref: this.submenuRef,
className: className
}, submenu));
}
}], [{
key: "getDerivedStateFromProps",
value: function getDerivedStateFromProps(nextProps, prevState) {
if (nextProps.resetMenu === true) {
return {
activeItem: null
};
}
return null;
}
}]);
return ContextMenuSub;
}(React.Component);
_defineProperty(ContextMenuSub, "defaultProps", {
model: null,
root: false,
className: null,
resetMenu: false,
onLeafClick: null
});
var ContextMenu = /*#__PURE__*/function (_Component2) {
_inherits(ContextMenu, _Component2);
var _super2 = _createSuper$1R(ContextMenu);
function ContextMenu(props) {
var _this4;
_classCallCheck(this, ContextMenu);
_this4 = _super2.call(this, props);
_this4.state = {
visible: false,
reshow: false,
resetMenu: false
};
_this4.onMenuClick = _this4.onMenuClick.bind(_assertThisInitialized(_this4));
_this4.onLeafClick = _this4.onLeafClick.bind(_assertThisInitialized(_this4));
_this4.onMenuMouseEnter = _this4.onMenuMouseEnter.bind(_assertThisInitialized(_this4));
_this4.onEnter = _this4.onEnter.bind(_assertThisInitialized(_this4));
_this4.onEntered = _this4.onEntered.bind(_assertThisInitialized(_this4));
_this4.onExit = _this4.onExit.bind(_assertThisInitialized(_this4));
_this4.onExited = _this4.onExited.bind(_assertThisInitialized(_this4));
_this4.menuRef = /*#__PURE__*/React__default["default"].createRef();
return _this4;
}
_createClass(ContextMenu, [{
key: "onMenuClick",
value: function onMenuClick() {
this.setState({
resetMenu: false
});
}
}, {
key: "onMenuMouseEnter",
value: function onMenuMouseEnter() {
this.setState({
resetMenu: false
});
}
}, {
key: "show",
value: function show(event) {
var _this5 = this;
if (!(event instanceof Event)) {
event.persist();
}
event.stopPropagation();
event.preventDefault();
this.currentEvent = event;
if (this.state.visible) {
this.setState({
reshow: true
});
} else {
this.setState({
visible: true
}, function () {
if (_this5.props.onShow) {
_this5.props.onShow(_this5.currentEvent);
}
});
}
}
}, {
key: "hide",
value: function hide(event) {
var _this6 = this;
if (!(event instanceof Event)) {
event.persist();
}
this.currentEvent = event;
this.setState({
visible: false,
reshow: false
}, function () {
if (_this6.props.onHide) {
_this6.props.onHide(_this6.currentEvent);
}
});
}
}, {
key: "onEnter",
value: function onEnter() {
if (this.props.autoZIndex) {
ZIndexUtils.set('menu', this.menuRef.current, PrimeReact.autoZIndex, this.props.baseZIndex || PrimeReact.zIndex['menu']);
}
this.position(this.currentEvent);
}
}, {
key: "onEntered",
value: function onEntered() {
this.bindDocumentListeners();
}
}, {
key: "onExit",
value: function onExit() {
this.currentEvent = null;
this.unbindDocumentListeners();
}
}, {
key: "onExited",
value: function onExited() {
ZIndexUtils.clear(this.menuRef.current);
}
}, {
key: "position",
value: function position(event) {
if (event) {
var left = event.pageX + 1;
var top = event.pageY + 1;
var width = this.menuRef.current.offsetParent ? this.menuRef.current.offsetWidth : DomHandler.getHiddenElementOuterWidth(this.menuRef.current);
var height = this.menuRef.current.offsetParent ? this.menuRef.current.offsetHeight : DomHandler.getHiddenElementOuterHeight(this.menuRef.current);
var viewport = DomHandler.getViewport(); //flip
if (left + width - document.body.scrollLeft > viewport.width) {
left -= width;
} //flip
if (top + height - document.body.scrollTop > viewport.height) {
top -= height;
} //fit
if (left < document.body.scrollLeft) {
left = document.body.scrollLeft;
} //fit
if (top < document.body.scrollTop) {
top = document.body.scrollTop;
}
this.menuRef.current.style.left = left + 'px';
this.menuRef.current.style.top = top + 'px';
}
}
}, {
key: "onLeafClick",
value: function onLeafClick(event) {
this.setState({
resetMenu: true
});
this.hide(event);
event.stopPropagation();
}
}, {
key: "isOutsideClicked",
value: function isOutsideClicked(event) {
return this.menuRef && this.menuRef.current && !(this.menuRef.current.isSameNode(event.target) || this.menuRef.current.contains(event.target));
}
}, {
key: "bindDocumentListeners",
value: function bindDocumentListeners() {
this.bindDocumentResizeListener();
this.bindDocumentClickListener();
}
}, {
key: "unbindDocumentListeners",
value: function unbindDocumentListeners() {
this.unbindDocumentResizeListener();
this.unbindDocumentClickListener();
}
}, {
key: "bindDocumentClickListener",
value: function bindDocumentClickListener() {
var _this7 = this;
if (!this.documentClickListener) {
this.documentClickListener = function (event) {
if (_this7.isOutsideClicked(event) && event.button !== 2) {
_this7.hide(event);
_this7.setState({
resetMenu: true
});
}
};
document.addEventListener('click', this.documentClickListener);
}
}
}, {
key: "bindDocumentContextMenuListener",
value: function bindDocumentContextMenuListener() {
var _this8 = this;
if (!this.documentContextMenuListener) {
this.documentContextMenuListener = function (event) {
_this8.show(event);
};
document.addEventListener('contextmenu', this.documentContextMenuListener);
}
}
}, {
key: "bindDocumentResizeListener",
value: function bindDocumentResizeListener() {
var _this9 = this;
if (!this.documentResizeListener) {
this.documentResizeListener = function (event) {
if (_this9.state.visible && !DomHandler.isTouchDevice()) {
_this9.hide(event);
}
};
window.addEventListener('resize', this.documentResizeListener);
}
}
}, {
key: "unbindDocumentClickListener",
value: function unbindDocumentClickListener() {
if (this.documentClickListener) {
document.removeEventListener('click', this.documentClickListener);
this.documentClickListener = null;
}
}
}, {
key: "unbindDocumentContextMenuListener",
value: function unbindDocumentContextMenuListener() {
if (this.documentContextMenuListener) {
document.removeEventListener('contextmenu', this.documentContextMenuListener);
this.documentContextMenuListener = null;
}
}
}, {
key: "unbindDocumentResizeListener",
value: function unbindDocumentResizeListener() {
if (this.documentResizeListener) {
window.removeEventListener('resize', this.documentResizeListener);
this.documentResizeListener = null;
}
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
if (this.props.global) {
this.bindDocumentContextMenuListener();
}
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps, prevState) {
var _this10 = this;
if (this.state.visible && (prevState.reshow !== this.state.reshow || prevProps.model !== this.props.model)) {
var event = this.currentEvent;
this.setState({
visible: false,
reshow: false,
rePosition: false,
resetMenu: true
}, function () {
return _this10.show(event);
});
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
this.unbindDocumentListeners();
this.unbindDocumentContextMenuListener();
ZIndexUtils.clear(this.menuRef.current);
}
}, {
key: "renderContextMenu",
value: function renderContextMenu() {
var className = classNames('p-contextmenu p-component', this.props.className);
return /*#__PURE__*/React__default["default"].createElement(CSSTransition, {
nodeRef: this.menuRef,
classNames: "p-contextmenu",
"in": this.state.visible,
timeout: {
enter: 250,
exit: 0
},
options: this.props.transitionOptions,
unmountOnExit: true,
onEnter: this.onEnter,
onEntered: this.onEntered,
onExit: this.onExit,
onExited: this.onExited
}, /*#__PURE__*/React__default["default"].createElement("div", {
ref: this.menuRef,
id: this.props.id,
className: className,
style: this.props.style,
onClick: this.onMenuClick,
onMouseEnter: this.onMenuMouseEnter
}, /*#__PURE__*/React__default["default"].createElement(ContextMenuSub, {
model: this.props.model,
root: true,
resetMenu: this.state.resetMenu,
onLeafClick: this.onLeafClick
})));
}
}, {
key: "render",
value: function render() {
var element = this.renderContextMenu();
return /*#__PURE__*/React__default["default"].createElement(Portal, {
element: element,
appendTo: this.props.appendTo
});
}
}]);
return ContextMenu;
}(React.Component);
_defineProperty(ContextMenu, "defaultProps", {
id: null,
model: null,
style: null,
className: null,
global: false,
autoZIndex: true,
baseZIndex: 0,
appendTo: null,
transitionOptions: null,
onShow: null,
onHide: null
});
function _createSuper$1Q(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1Q(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1Q() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var DataScroller = /*#__PURE__*/function (_Component) {
_inherits(DataScroller, _Component);
var _super = _createSuper$1Q(DataScroller);
function DataScroller(props) {
var _this;
_classCallCheck(this, DataScroller);
_this = _super.call(this, props);
_this.state = {};
_this.dataToRender = [];
_this.value = _this.props.value;
_this.first = 0;
return _this;
}
_createClass(DataScroller, [{
key: "handleDataChange",
value: function handleDataChange() {
if (this.props.lazy) {
this.dataToRender = this.value;
this.setState({
dataToRender: this.dataToRender
});
} else {
this.load();
}
}
}, {
key: "load",
value: function load() {
if (this.props.lazy) {
if (this.props.onLazyLoad) {
this.props.onLazyLoad(this.createLazyLoadMetadata());
}
this.first = this.first + this.props.rows;
} else {
if (this.value) {
for (var i = this.first; i < this.first + this.props.rows; i++) {
if (i >= this.value.length) {
break;
}
this.dataToRender.push(this.value[i]);
}
if (this.value.length !== 0) {
this.first = this.first + this.props.rows;
}
this.setState({
dataToRender: this.dataToRender
});
}
}
}
}, {
key: "reset",
value: function reset() {
this.first = 0;
this.dataToRender = [];
this.setState({
dataToRender: this.dataToRender
});
this.load();
}
}, {
key: "isEmpty",
value: function isEmpty() {
return !this.dataToRender || this.dataToRender.length === 0;
}
}, {
key: "createLazyLoadMetadata",
value: function createLazyLoadMetadata() {
return {
first: this.first,
rows: this.props.rows
};
}
}, {
key: "bindScrollListener",
value: function bindScrollListener() {
var _this2 = this;
if (this.props.inline) {
this.scrollFunction = function () {
var scrollTop = _this2.contentElement.scrollTop,
scrollHeight = _this2.contentElement.scrollHeight,
viewportHeight = _this2.contentElement.clientHeight;
if (scrollTop >= scrollHeight * _this2.props.buffer - viewportHeight) {
_this2.load();
}
};
this.contentElement.addEventListener('scroll', this.scrollFunction);
} else {
this.scrollFunction = function () {
var docBody = document.body,
docElement = document.documentElement,
scrollTop = window.pageYOffset || document.documentElement.scrollTop,
winHeight = docElement.clientHeight,
docHeight = Math.max(docBody.scrollHeight, docBody.offsetHeight, winHeight, docElement.scrollHeight, docElement.offsetHeight);
if (scrollTop >= docHeight * _this2.props.buffer - winHeight) {
_this2.load();
}
};
window.addEventListener('scroll', this.scrollFunction);
}
}
}, {
key: "unbindScrollListener",
value: function unbindScrollListener() {
if (this.scrollFunction) {
if (this.props.inline) {
this.contentElement.removeEventListener('scroll', this.scrollFunction);
this.contentElement = null;
} else if (!this.props.loader) {
window.removeEventListener('scroll', this.scrollFunction);
}
}
this.scrollFunction = null;
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
this.load();
if (!this.props.loader) {
this.bindScrollListener();
}
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps, prevState) {
var newValue = this.props.value;
if (newValue && this.value !== newValue) {
this.value = newValue;
this.first = 0;
this.dataToRender = [];
this.handleDataChange();
}
if (prevProps.loader !== this.props.loader && this.props.loader) {
this.unbindScrollListener();
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
if (this.scrollFunction) {
this.unbindScrollListener();
}
}
}, {
key: "renderHeader",
value: function renderHeader() {
if (this.props.header) {
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-datascroller-header"
}, this.props.header);
}
return null;
}
}, {
key: "renderFooter",
value: function renderFooter() {
if (this.props.footer) {
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-datascroller-footer"
}, this.props.footer);
}
return null;
}
}, {
key: "renderItem",
value: function renderItem(value, index) {
var content = this.props.itemTemplate ? this.props.itemTemplate(value) : value;
return /*#__PURE__*/React__default["default"].createElement("li", {
key: index + '_datascrollitem'
}, content);
}
}, {
key: "renderEmptyMessage",
value: function renderEmptyMessage() {
var content = ObjectUtils.getJSXElement(this.props.emptyMessage, this.props) || localeOption('emptyMessage');
return /*#__PURE__*/React__default["default"].createElement("li", null, content);
}
}, {
key: "renderContent",
value: function renderContent() {
var _this3 = this;
var content = this.state.dataToRender && this.state.dataToRender.length ? this.state.dataToRender.map(function (val, i) {
return _this3.renderItem(val, i);
}) : this.renderEmptyMessage();
return /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this3.contentElement = el;
},
className: "p-datascroller-content",
style: {
'maxHeight': this.props.scrollHeight
}
}, /*#__PURE__*/React__default["default"].createElement("ul", {
className: "p-datascroller-list"
}, content));
}
}, {
key: "render",
value: function render() {
var className = classNames('p-datascroller p-component', this.props.className, {
'p-datascroller-inline': this.props.inline
});
var header = this.renderHeader();
var footer = this.renderFooter();
var content = this.renderContent();
return /*#__PURE__*/React__default["default"].createElement("div", {
id: this.props.id,
className: className
}, header, content, footer);
}
}]);
return DataScroller;
}(React.Component);
_defineProperty(DataScroller, "defaultProps", {
id: null,
value: null,
rows: 0,
inline: false,
scrollHeight: null,
loader: false,
buffer: 0.9,
style: null,
className: null,
onLazyLoad: null,
emptyMessage: null,
itemTemplate: null,
header: null,
footer: null,
lazy: false
});
function _createSuper$1P(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1P(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1P() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var FirstPageLink = /*#__PURE__*/function (_Component) {
_inherits(FirstPageLink, _Component);
var _super = _createSuper$1P(FirstPageLink);
function FirstPageLink() {
_classCallCheck(this, FirstPageLink);
return _super.apply(this, arguments);
}
_createClass(FirstPageLink, [{
key: "render",
value: function render() {
var className = classNames('p-paginator-first p-paginator-element p-link', {
'p-disabled': this.props.disabled
});
var iconClassName = 'p-paginator-icon pi pi-angle-double-left';
var element = /*#__PURE__*/React__default["default"].createElement("button", {
type: "button",
className: className,
onClick: this.props.onClick,
disabled: this.props.disabled
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: iconClassName
}), /*#__PURE__*/React__default["default"].createElement(Ripple, null));
if (this.props.template) {
var defaultOptions = {
onClick: this.props.onClick,
className: className,
iconClassName: iconClassName,
disabled: this.props.disabled,
element: element,
props: this.props
};
return ObjectUtils.getJSXElement(this.props.template, defaultOptions);
}
return element;
}
}]);
return FirstPageLink;
}(React.Component);
_defineProperty(FirstPageLink, "defaultProps", {
disabled: false,
onClick: null,
template: null
});
function _createSuper$1O(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1O(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1O() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var NextPageLink = /*#__PURE__*/function (_Component) {
_inherits(NextPageLink, _Component);
var _super = _createSuper$1O(NextPageLink);
function NextPageLink() {
_classCallCheck(this, NextPageLink);
return _super.apply(this, arguments);
}
_createClass(NextPageLink, [{
key: "render",
value: function render() {
var className = classNames('p-paginator-next p-paginator-element p-link', {
'p-disabled': this.props.disabled
});
var iconClassName = 'p-paginator-icon pi pi-angle-right';
var element = /*#__PURE__*/React__default["default"].createElement("button", {
type: "button",
className: className,
onClick: this.props.onClick,
disabled: this.props.disabled
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: iconClassName
}), /*#__PURE__*/React__default["default"].createElement(Ripple, null));
if (this.props.template) {
var defaultOptions = {
onClick: this.props.onClick,
className: className,
iconClassName: iconClassName,
disabled: this.props.disabled,
element: element,
props: this.props
};
return ObjectUtils.getJSXElement(this.props.template, defaultOptions);
}
return element;
}
}]);
return NextPageLink;
}(React.Component);
_defineProperty(NextPageLink, "defaultProps", {
disabled: false,
onClick: null,
template: null
});
function _createSuper$1N(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1N(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1N() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var PrevPageLink = /*#__PURE__*/function (_Component) {
_inherits(PrevPageLink, _Component);
var _super = _createSuper$1N(PrevPageLink);
function PrevPageLink() {
_classCallCheck(this, PrevPageLink);
return _super.apply(this, arguments);
}
_createClass(PrevPageLink, [{
key: "render",
value: function render() {
var className = classNames('p-paginator-prev p-paginator-element p-link', {
'p-disabled': this.props.disabled
});
var iconClassName = 'p-paginator-icon pi pi-angle-left';
var element = /*#__PURE__*/React__default["default"].createElement("button", {
type: "button",
className: className,
onClick: this.props.onClick,
disabled: this.props.disabled
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: iconClassName
}), /*#__PURE__*/React__default["default"].createElement(Ripple, null));
if (this.props.template) {
var defaultOptions = {
onClick: this.props.onClick,
className: className,
iconClassName: iconClassName,
disabled: this.props.disabled,
element: element,
props: this.props
};
return ObjectUtils.getJSXElement(this.props.template, defaultOptions);
}
return element;
}
}]);
return PrevPageLink;
}(React.Component);
_defineProperty(PrevPageLink, "defaultProps", {
disabled: false,
onClick: null,
template: null
});
function _createSuper$1M(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1M(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1M() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var LastPageLink = /*#__PURE__*/function (_Component) {
_inherits(LastPageLink, _Component);
var _super = _createSuper$1M(LastPageLink);
function LastPageLink() {
_classCallCheck(this, LastPageLink);
return _super.apply(this, arguments);
}
_createClass(LastPageLink, [{
key: "render",
value: function render() {
var className = classNames('p-paginator-last p-paginator-element p-link', {
'p-disabled': this.props.disabled
});
var iconClassName = 'p-paginator-icon pi pi-angle-double-right';
var element = /*#__PURE__*/React__default["default"].createElement("button", {
type: "button",
className: className,
onClick: this.props.onClick,
disabled: this.props.disabled
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: iconClassName
}), /*#__PURE__*/React__default["default"].createElement(Ripple, null));
if (this.props.template) {
var defaultOptions = {
onClick: this.props.onClick,
className: className,
iconClassName: iconClassName,
disabled: this.props.disabled,
element: element,
props: this.props
};
return ObjectUtils.getJSXElement(this.props.template, defaultOptions);
}
return element;
}
}]);
return LastPageLink;
}(React.Component);
_defineProperty(LastPageLink, "defaultProps", {
disabled: false,
onClick: null,
template: null
});
function _createSuper$1L(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1L(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1L() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var PageLinks = /*#__PURE__*/function (_Component) {
_inherits(PageLinks, _Component);
var _super = _createSuper$1L(PageLinks);
function PageLinks() {
_classCallCheck(this, PageLinks);
return _super.apply(this, arguments);
}
_createClass(PageLinks, [{
key: "onPageLinkClick",
value: function onPageLinkClick(event, pageLink) {
if (this.props.onClick) {
this.props.onClick({
originalEvent: event,
value: pageLink
});
}
event.preventDefault();
}
}, {
key: "render",
value: function render() {
var _this = this;
var elements;
if (this.props.value) {
var startPageInView = this.props.value[0];
var endPageInView = this.props.value[this.props.value.length - 1];
elements = this.props.value.map(function (pageLink, i) {
var className = classNames('p-paginator-page p-paginator-element p-link', {
'p-paginator-page-start': pageLink === startPageInView,
'p-paginator-page-end': pageLink === endPageInView,
'p-highlight': pageLink - 1 === _this.props.page
});
var element = /*#__PURE__*/React__default["default"].createElement("button", {
type: "button",
className: className,
onClick: function onClick(e) {
return _this.onPageLinkClick(e, pageLink);
}
}, pageLink, /*#__PURE__*/React__default["default"].createElement(Ripple, null));
if (_this.props.template) {
var defaultOptions = {
onClick: function onClick(e) {
return _this.onPageLinkClick(e, pageLink);
},
className: className,
view: {
startPage: startPageInView - 1,
endPage: endPageInView - 1
},
page: pageLink - 1,
currentPage: _this.props.page,
totalPages: _this.props.pageCount,
element: element,
props: _this.props
};
element = ObjectUtils.getJSXElement(_this.props.template, defaultOptions);
}
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, {
key: pageLink
}, element);
});
}
return /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-paginator-pages"
}, elements);
}
}]);
return PageLinks;
}(React.Component);
_defineProperty(PageLinks, "defaultProps", {
value: null,
page: null,
rows: null,
pageCount: null,
links: null,
template: null
});
function _createSuper$1K(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1K(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1K() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var DropdownItem = /*#__PURE__*/function (_Component) {
_inherits(DropdownItem, _Component);
var _super = _createSuper$1K(DropdownItem);
function DropdownItem(props) {
var _this;
_classCallCheck(this, DropdownItem);
_this = _super.call(this, props);
_this.onClick = _this.onClick.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(DropdownItem, [{
key: "onClick",
value: function onClick(event) {
if (this.props.onClick) {
this.props.onClick({
originalEvent: event,
option: this.props.option
});
}
}
}, {
key: "render",
value: function render() {
var className = classNames('p-dropdown-item', {
'p-highlight': this.props.selected,
'p-disabled': this.props.disabled,
'p-dropdown-item-empty': !this.props.label || this.props.label.length === 0
}, this.props.option.className);
var content = this.props.template ? ObjectUtils.getJSXElement(this.props.template, this.props.option) : this.props.label;
return /*#__PURE__*/React__default["default"].createElement("li", {
className: className,
onClick: this.onClick,
"aria-label": this.props.label,
key: this.props.label,
role: "option",
"aria-selected": this.props.selected
}, content, /*#__PURE__*/React__default["default"].createElement(Ripple, null));
}
}]);
return DropdownItem;
}(React.Component);
_defineProperty(DropdownItem, "defaultProps", {
option: null,
label: null,
template: null,
selected: false,
disabled: false,
onClick: null
});
function ownKeys$D(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$D(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$D(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$D(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createSuper$1J(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1J(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1J() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var DropdownPanelComponent = /*#__PURE__*/function (_Component) {
_inherits(DropdownPanelComponent, _Component);
var _super = _createSuper$1J(DropdownPanelComponent);
function DropdownPanelComponent(props) {
var _this;
_classCallCheck(this, DropdownPanelComponent);
_this = _super.call(this, props);
_this.onEnter = _this.onEnter.bind(_assertThisInitialized(_this));
_this.onEntered = _this.onEntered.bind(_assertThisInitialized(_this));
_this.onFilterInputChange = _this.onFilterInputChange.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(DropdownPanelComponent, [{
key: "onEnter",
value: function onEnter() {
var _this2 = this;
this.props.onEnter(function () {
if (_this2.virtualScrollerRef) {
var selectedIndex = _this2.props.getSelectedOptionIndex();
if (selectedIndex !== -1) {
_this2.virtualScrollerRef.scrollToIndex(selectedIndex);
}
}
});
}
}, {
key: "onEntered",
value: function onEntered() {
var _this3 = this;
this.props.onEntered(function () {
if (_this3.props.filter && _this3.props.filterInputAutoFocus) {
_this3.filterInput.focus();
}
});
}
}, {
key: "onFilterInputChange",
value: function onFilterInputChange(event) {
if (this.virtualScrollerRef) {
this.virtualScrollerRef.scrollToIndex(0);
}
this.props.onFilterInputChange && this.props.onFilterInputChange(event);
}
}, {
key: "isEmptyFilter",
value: function isEmptyFilter() {
return !(this.props.visibleOptions && this.props.visibleOptions.length) && this.props.hasFilter();
}
}, {
key: "renderGroupChildren",
value: function renderGroupChildren(optionGroup) {
var _this4 = this;
var groupChildren = this.props.getOptionGroupChildren(optionGroup);
return groupChildren.map(function (option, j) {
var optionLabel = _this4.props.getOptionLabel(option);
var optionKey = j + '_' + _this4.props.getOptionRenderKey(option);
var disabled = _this4.props.isOptionDisabled(option);
return /*#__PURE__*/React__default["default"].createElement(DropdownItem, {
key: optionKey,
label: optionLabel,
option: option,
template: _this4.props.itemTemplate,
selected: _this4.props.isSelected(option),
disabled: disabled,
onClick: _this4.props.onOptionClick
});
});
}
}, {
key: "renderEmptyMessage",
value: function renderEmptyMessage(emptyMessage, isFilter) {
var message = ObjectUtils.getJSXElement(emptyMessage, this.props) || localeOption(isFilter ? 'emptyFilterMessage' : 'emptyMessage');
return /*#__PURE__*/React__default["default"].createElement("li", {
className: "p-dropdown-empty-message"
}, message);
}
}, {
key: "renderItem",
value: function renderItem(option, index) {
if (this.props.optionGroupLabel) {
var groupContent = this.props.optionGroupTemplate ? ObjectUtils.getJSXElement(this.props.optionGroupTemplate, option, index) : this.props.getOptionGroupLabel(option);
var groupChildrenContent = this.renderGroupChildren(option);
var key = index + '_' + this.props.getOptionGroupRenderKey(option);
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, {
key: key
}, /*#__PURE__*/React__default["default"].createElement("li", {
className: "p-dropdown-item-group"
}, groupContent), groupChildrenContent);
} else {
var optionLabel = this.props.getOptionLabel(option);
var optionKey = index + '_' + this.props.getOptionRenderKey(option);
var disabled = this.props.isOptionDisabled(option);
return /*#__PURE__*/React__default["default"].createElement(DropdownItem, {
key: optionKey,
label: optionLabel,
option: option,
template: this.props.itemTemplate,
selected: this.props.isSelected(option),
disabled: disabled,
onClick: this.props.onOptionClick
});
}
}
}, {
key: "renderItems",
value: function renderItems() {
var _this5 = this;
if (this.props.visibleOptions && this.props.visibleOptions.length) {
return this.props.visibleOptions.map(function (option, index) {
return _this5.renderItem(option, index);
});
} else if (this.props.hasFilter()) {
return this.renderEmptyMessage(this.props.emptyFilterMessage, true);
}
return this.renderEmptyMessage(this.props.emptyMessage);
}
}, {
key: "renderFilterClearIcon",
value: function renderFilterClearIcon() {
var _this6 = this;
if (this.props.showFilterClear && this.props.filterValue) {
return /*#__PURE__*/React__default["default"].createElement("i", {
className: "p-dropdown-filter-clear-icon pi pi-times",
onClick: function onClick() {
return _this6.props.onFilterClearIconClick(function () {
return _this6.filterInput.focus();
});
}
});
}
return null;
}
}, {
key: "renderFilter",
value: function renderFilter() {
var _this7 = this;
if (this.props.filter) {
var clearIcon = this.renderFilterClearIcon();
var containerClassName = classNames('p-dropdown-filter-container', {
'p-dropdown-clearable-filter': !!clearIcon
});
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-dropdown-header"
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: containerClassName
}, /*#__PURE__*/React__default["default"].createElement("input", {
ref: function ref(el) {
return _this7.filterInput = el;
},
type: "text",
autoComplete: "off",
className: "p-dropdown-filter p-inputtext p-component",
placeholder: this.props.filterPlaceholder,
onKeyDown: this.props.onFilterInputKeyDown,
onChange: this.onFilterInputChange,
value: this.props.filterValue
}), clearIcon, /*#__PURE__*/React__default["default"].createElement("i", {
className: "p-dropdown-filter-icon pi pi-search"
})));
}
return null;
}
}, {
key: "renderContent",
value: function renderContent() {
var _this8 = this;
if (this.props.virtualScrollerOptions) {
var virtualScrollerProps = _objectSpread$D(_objectSpread$D({}, this.props.virtualScrollerOptions), {
style: _objectSpread$D(_objectSpread$D({}, this.props.virtualScrollerOptions.style), {
height: this.props.scrollHeight
}),
className: classNames('p-dropdown-items-wrapper', this.props.virtualScrollerOptions.className),
items: this.props.visibleOptions,
onLazyLoad: function onLazyLoad(event) {
return _this8.props.virtualScrollerOptions.onLazyLoad(_objectSpread$D(_objectSpread$D({}, event), {
filter: _this8.props.filterValue
}));
},
itemTemplate: function itemTemplate(item, options) {
return item && _this8.renderItem(item, options.index);
},
contentTemplate: function contentTemplate(options) {
var className = classNames('p-dropdown-items', options.className);
var content = _this8.isEmptyFilter() ? _this8.renderEmptyMessage() : options.children;
return /*#__PURE__*/React__default["default"].createElement("ul", {
ref: options.contentRef,
className: className,
role: "listbox"
}, content);
}
});
return /*#__PURE__*/React__default["default"].createElement(VirtualScroller, _extends({
ref: function ref(el) {
return _this8.virtualScrollerRef = el;
}
}, virtualScrollerProps));
} else {
var items = this.renderItems();
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-dropdown-items-wrapper",
style: {
maxHeight: this.props.scrollHeight || 'auto'
}
}, /*#__PURE__*/React__default["default"].createElement("ul", {
className: "p-dropdown-items",
role: "listbox"
}, items));
}
}
}, {
key: "renderElement",
value: function renderElement() {
var className = classNames('p-dropdown-panel p-component', this.props.panelClassName);
var filter = this.renderFilter();
var content = this.renderContent();
return /*#__PURE__*/React__default["default"].createElement(CSSTransition, {
nodeRef: this.props.forwardRef,
classNames: "p-connected-overlay",
"in": this.props["in"],
timeout: {
enter: 120,
exit: 100
},
options: this.props.transitionOptions,
unmountOnExit: true,
onEnter: this.onEnter,
onEntering: this.props.onEntering,
onEntered: this.onEntered,
onExit: this.props.onExit,
onExited: this.props.onExited
}, /*#__PURE__*/React__default["default"].createElement("div", {
ref: this.props.forwardRef,
className: className,
style: this.props.panelStyle,
onClick: this.props.onClick
}, filter, content));
}
}, {
key: "render",
value: function render() {
var element = this.renderElement();
return /*#__PURE__*/React__default["default"].createElement(Portal, {
element: element,
appendTo: this.props.appendTo
});
}
}]);
return DropdownPanelComponent;
}(React.Component);
var DropdownPanel = /*#__PURE__*/React__default["default"].forwardRef(function (props, ref) {
return /*#__PURE__*/React__default["default"].createElement(DropdownPanelComponent, _extends({
forwardRef: ref
}, props));
});
function ownKeys$C(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$C(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$C(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$C(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createForOfIteratorHelper$c(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray$c(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it["return"] != null) it["return"](); } finally { if (didErr) throw err; } } }; }
function _unsupportedIterableToArray$c(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray$c(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray$c(o, minLen); }
function _arrayLikeToArray$c(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
function _createSuper$1I(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1I(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1I() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var Dropdown = /*#__PURE__*/function (_Component) {
_inherits(Dropdown, _Component);
var _super = _createSuper$1I(Dropdown);
function Dropdown(props) {
var _this;
_classCallCheck(this, Dropdown);
_this = _super.call(this, props);
_this.state = {
filter: '',
focused: false,
overlayVisible: false
};
_this.onClick = _this.onClick.bind(_assertThisInitialized(_this));
_this.onInputFocus = _this.onInputFocus.bind(_assertThisInitialized(_this));
_this.onInputBlur = _this.onInputBlur.bind(_assertThisInitialized(_this));
_this.onInputKeyDown = _this.onInputKeyDown.bind(_assertThisInitialized(_this));
_this.onEditableInputChange = _this.onEditableInputChange.bind(_assertThisInitialized(_this));
_this.onEditableInputFocus = _this.onEditableInputFocus.bind(_assertThisInitialized(_this));
_this.onOptionClick = _this.onOptionClick.bind(_assertThisInitialized(_this));
_this.onFilterInputChange = _this.onFilterInputChange.bind(_assertThisInitialized(_this));
_this.onFilterInputKeyDown = _this.onFilterInputKeyDown.bind(_assertThisInitialized(_this));
_this.onFilterClearIconClick = _this.onFilterClearIconClick.bind(_assertThisInitialized(_this));
_this.onPanelClick = _this.onPanelClick.bind(_assertThisInitialized(_this));
_this.onOverlayEnter = _this.onOverlayEnter.bind(_assertThisInitialized(_this));
_this.onOverlayEntered = _this.onOverlayEntered.bind(_assertThisInitialized(_this));
_this.onOverlayExit = _this.onOverlayExit.bind(_assertThisInitialized(_this));
_this.onOverlayExited = _this.onOverlayExited.bind(_assertThisInitialized(_this));
_this.resetFilter = _this.resetFilter.bind(_assertThisInitialized(_this));
_this.clear = _this.clear.bind(_assertThisInitialized(_this));
_this.hasFilter = _this.hasFilter.bind(_assertThisInitialized(_this));
_this.getOptionLabel = _this.getOptionLabel.bind(_assertThisInitialized(_this));
_this.getOptionRenderKey = _this.getOptionRenderKey.bind(_assertThisInitialized(_this));
_this.isOptionDisabled = _this.isOptionDisabled.bind(_assertThisInitialized(_this));
_this.getOptionGroupChildren = _this.getOptionGroupChildren.bind(_assertThisInitialized(_this));
_this.getOptionGroupLabel = _this.getOptionGroupLabel.bind(_assertThisInitialized(_this));
_this.getOptionGroupRenderKey = _this.getOptionGroupRenderKey.bind(_assertThisInitialized(_this));
_this.getSelectedOptionIndex = _this.getSelectedOptionIndex.bind(_assertThisInitialized(_this));
_this.isSelected = _this.isSelected.bind(_assertThisInitialized(_this));
_this.overlayRef = /*#__PURE__*/React.createRef();
_this.inputRef = /*#__PURE__*/React.createRef(_this.props.inputRef);
return _this;
}
_createClass(Dropdown, [{
key: "onClick",
value: function onClick(event) {
if (this.props.disabled) {
return;
}
if (DomHandler.hasClass(event.target, 'p-dropdown-clear-icon') || event.target.tagName === 'INPUT') {
return;
} else if (!this.overlayRef.current || !(this.overlayRef.current && this.overlayRef.current.contains(event.target))) {
this.focusInput.focus();
if (this.state.overlayVisible) {
this.hideOverlay();
} else {
this.showOverlay();
}
}
}
}, {
key: "onInputFocus",
value: function onInputFocus(event) {
var _this2 = this;
event.persist();
if (this.props.showOnFocus && !this.state.overlayVisible) {
this.showOverlay();
}
this.setState({
focused: true
}, function () {
if (_this2.props.onFocus) {
_this2.props.onFocus(event);
}
});
}
}, {
key: "onInputBlur",
value: function onInputBlur(event) {
var _this3 = this;
event.persist();
this.setState({
focused: false
}, function () {
if (_this3.props.onBlur) {
_this3.props.onBlur(event);
}
});
}
}, {
key: "onPanelClick",
value: function onPanelClick(event) {
OverlayService.emit('overlay-click', {
originalEvent: event,
target: this.container
});
}
}, {
key: "onInputKeyDown",
value: function onInputKeyDown(event) {
switch (event.which) {
//down
case 40:
this.onDownKey(event);
break;
//up
case 38:
this.onUpKey(event);
break;
//space
case 32:
if (this.state.overlayVisible) this.hideOverlay();else this.showOverlay();
event.preventDefault();
break;
//enter
case 13:
this.hideOverlay();
event.preventDefault();
break;
//escape and tab
case 27:
case 9:
this.hideOverlay();
break;
default:
this.search(event);
break;
}
}
}, {
key: "onFilterInputKeyDown",
value: function onFilterInputKeyDown(event) {
switch (event.which) {
//down
case 40:
this.onDownKey(event);
break;
//up
case 38:
this.onUpKey(event);
break;
//enter and escape
case 13:
case 27:
this.hideOverlay();
event.preventDefault();
break;
}
}
}, {
key: "onUpKey",
value: function onUpKey(event) {
var visibleOptions = this.getVisibleOptions();
if (visibleOptions) {
var prevOption = this.findPrevOption(this.getSelectedOptionIndex());
if (prevOption) {
this.selectItem({
originalEvent: event,
option: prevOption
});
}
}
event.preventDefault();
}
}, {
key: "onDownKey",
value: function onDownKey(event) {
var visibleOptions = this.getVisibleOptions();
if (visibleOptions) {
if (!this.state.overlayVisible && event.altKey) {
this.showOverlay();
} else {
var nextOption = this.findNextOption(this.getSelectedOptionIndex());
if (nextOption) {
this.selectItem({
originalEvent: event,
option: nextOption
});
}
}
}
event.preventDefault();
}
}, {
key: "findNextOption",
value: function findNextOption(index) {
var visibleOptions = this.getVisibleOptions();
if (this.props.optionGroupLabel) {
var groupIndex = index === -1 ? 0 : index.group;
var optionIndex = index === -1 ? -1 : index.option;
var option = this.findNextOptionInList(this.getOptionGroupChildren(visibleOptions[groupIndex]), optionIndex);
if (option) return option;else if (groupIndex + 1 !== visibleOptions.length) return this.findNextOption({
group: groupIndex + 1,
option: -1
});else return null;
} else {
return this.findNextOptionInList(visibleOptions, index);
}
}
}, {
key: "findNextOptionInList",
value: function findNextOptionInList(list, index) {
var i = index + 1;
if (i === list.length) {
return null;
}
var option = list[i];
if (this.isOptionDisabled(option)) return this.findNextOptionInList(i);else return option;
}
}, {
key: "findPrevOption",
value: function findPrevOption(index) {
if (index === -1) {
return null;
}
var visibleOptions = this.getVisibleOptions();
if (this.props.optionGroupLabel) {
var groupIndex = index.group;
var optionIndex = index.option;
var option = this.findPrevOptionInList(this.getOptionGroupChildren(visibleOptions[groupIndex]), optionIndex);
if (option) return option;else if (groupIndex > 0) return this.findPrevOption({
group: groupIndex - 1,
option: this.getOptionGroupChildren(visibleOptions[groupIndex - 1]).length
});else return null;
} else {
return this.findPrevOptionInList(visibleOptions, index);
}
}
}, {
key: "findPrevOptionInList",
value: function findPrevOptionInList(list, index) {
var i = index - 1;
if (i < 0) {
return null;
}
var option = list[i];
if (this.isOptionDisabled(option)) return this.findPrevOption(i);else return option;
}
}, {
key: "search",
value: function search(event) {
var _this4 = this;
if (this.searchTimeout) {
clearTimeout(this.searchTimeout);
}
var _char = event.key;
this.previousSearchChar = this.currentSearchChar;
this.currentSearchChar = _char;
if (this.previousSearchChar === this.currentSearchChar) this.searchValue = this.currentSearchChar;else this.searchValue = this.searchValue ? this.searchValue + _char : _char;
if (this.searchValue) {
var searchIndex = this.getSelectedOptionIndex();
var newOption = this.props.optionGroupLabel ? this.searchOptionInGroup(searchIndex) : this.searchOption(++searchIndex);
if (newOption) {
this.selectItem({
originalEvent: event,
option: newOption
});
this.selectedOptionUpdated = true;
}
}
this.searchTimeout = setTimeout(function () {
_this4.searchValue = null;
}, 250);
}
}, {
key: "searchOption",
value: function searchOption(index) {
var option;
if (this.searchValue) {
var visibleOptions = this.getVisibleOptions();
option = this.searchOptionInRange(index, visibleOptions.length);
if (!option) {
option = this.searchOptionInRange(0, index);
}
}
return option;
}
}, {
key: "searchOptionInRange",
value: function searchOptionInRange(start, end) {
var visibleOptions = this.getVisibleOptions();
for (var i = start; i < end; i++) {
var opt = visibleOptions[i];
if (this.matchesSearchValue(opt)) {
return opt;
}
}
return null;
}
}, {
key: "searchOptionInGroup",
value: function searchOptionInGroup(index) {
var searchIndex = index === -1 ? {
group: 0,
option: -1
} : index;
var visibleOptions = this.getVisibleOptions();
for (var i = searchIndex.group; i < visibleOptions.length; i++) {
var groupOptions = this.getOptionGroupChildren(visibleOptions[i]);
for (var j = searchIndex.group === i ? searchIndex.option + 1 : 0; j < groupOptions.length; j++) {
if (this.matchesSearchValue(groupOptions[j])) {
return groupOptions[j];
}
}
}
for (var _i = 0; _i <= searchIndex.group; _i++) {
var _groupOptions = this.getOptionGroupChildren(visibleOptions[_i]);
for (var _j = 0; _j < (searchIndex.group === _i ? searchIndex.option : _groupOptions.length); _j++) {
if (this.matchesSearchValue(_groupOptions[_j])) {
return _groupOptions[_j];
}
}
}
return null;
}
}, {
key: "matchesSearchValue",
value: function matchesSearchValue(option) {
var label = this.getOptionLabel(option).toLocaleLowerCase(this.props.filterLocale);
return label.startsWith(this.searchValue.toLocaleLowerCase(this.props.filterLocale));
}
}, {
key: "onEditableInputChange",
value: function onEditableInputChange(event) {
if (this.props.onChange) {
this.props.onChange({
originalEvent: event.originalEvent,
value: event.target.value,
stopPropagation: function stopPropagation() {},
preventDefault: function preventDefault() {},
target: {
name: this.props.name,
id: this.props.id,
value: event.target.value
}
});
}
}
}, {
key: "onEditableInputFocus",
value: function onEditableInputFocus(event) {
var _this5 = this;
event.persist();
this.setState({
focused: true
}, function () {
_this5.hideOverlay();
if (_this5.props.onFocus) {
_this5.props.onFocus(event);
}
});
}
}, {
key: "onOptionClick",
value: function onOptionClick(event) {
var option = event.option;
if (!option.disabled) {
this.selectItem(event);
this.focusInput.focus();
}
this.hideOverlay();
}
}, {
key: "onFilterInputChange",
value: function onFilterInputChange(event) {
var _this6 = this;
var filter = event.target.value;
this.setState({
filter: filter
}, function () {
if (_this6.props.onFilter) {
_this6.props.onFilter({
originalEvent: event,
filter: filter
});
}
});
}
}, {
key: "onFilterClearIconClick",
value: function onFilterClearIconClick(callback) {
this.resetFilter(callback);
}
}, {
key: "resetFilter",
value: function resetFilter(callback) {
var _this7 = this;
var filter = '';
this.setState({
filter: filter
}, function () {
_this7.props.onFilter && _this7.props.onFilter({
filter: filter
});
callback && callback();
});
}
}, {
key: "clear",
value: function clear(event) {
if (this.props.onChange) {
this.props.onChange({
originalEvent: event,
value: undefined,
stopPropagation: function stopPropagation() {},
preventDefault: function preventDefault() {},
target: {
name: this.props.name,
id: this.props.id,
value: undefined
}
});
}
this.updateEditableLabel();
}
}, {
key: "selectItem",
value: function selectItem(event) {
var currentSelectedOption = this.getSelectedOption();
if (currentSelectedOption !== event.option) {
this.updateEditableLabel(event.option);
var optionValue = this.getOptionValue(event.option);
if (this.props.onChange) {
this.props.onChange({
originalEvent: event.originalEvent,
value: optionValue,
stopPropagation: function stopPropagation() {},
preventDefault: function preventDefault() {},
target: {
name: this.props.name,
id: this.props.id,
value: optionValue
}
});
}
}
}
}, {
key: "getSelectedOption",
value: function getSelectedOption() {
var index = this.getSelectedOptionIndex();
var visibleOptions = this.getVisibleOptions();
return index !== -1 ? this.props.optionGroupLabel ? this.getOptionGroupChildren(visibleOptions[index.group])[index.option] : visibleOptions[index] : null;
}
}, {
key: "getSelectedOptionIndex",
value: function getSelectedOptionIndex() {
var visibleOptions = this.getVisibleOptions();
if (this.props.value != null && visibleOptions) {
if (this.props.optionGroupLabel) {
for (var i = 0; i < visibleOptions.length; i++) {
var selectedOptionIndex = this.findOptionIndexInList(this.props.value, this.getOptionGroupChildren(visibleOptions[i]));
if (selectedOptionIndex !== -1) {
return {
group: i,
option: selectedOptionIndex
};
}
}
} else {
return this.findOptionIndexInList(this.props.value, visibleOptions);
}
}
return -1;
}
}, {
key: "findOptionIndexInList",
value: function findOptionIndexInList(value, list) {
var key = this.equalityKey();
for (var i = 0; i < list.length; i++) {
if (ObjectUtils.equals(value, this.getOptionValue(list[i]), key)) {
return i;
}
}
return -1;
}
}, {
key: "isSelected",
value: function isSelected(option) {
return ObjectUtils.equals(this.props.value, this.getOptionValue(option), this.equalityKey());
}
}, {
key: "equalityKey",
value: function equalityKey() {
return this.props.optionValue ? null : this.props.dataKey;
}
}, {
key: "showOverlay",
value: function showOverlay() {
this.setState({
overlayVisible: true
});
}
}, {
key: "hideOverlay",
value: function hideOverlay() {
this.setState({
overlayVisible: false
});
}
}, {
key: "onOverlayEnter",
value: function onOverlayEnter(callback) {
ZIndexUtils.set('overlay', this.overlayRef.current, PrimeReact.autoZIndex, PrimeReact.zIndex['overlay']);
this.alignOverlay();
callback && callback();
}
}, {
key: "onOverlayEntered",
value: function onOverlayEntered(callback) {
callback && callback();
this.bindDocumentClickListener();
this.bindScrollListener();
this.bindResizeListener();
this.props.onShow && this.props.onShow();
}
}, {
key: "onOverlayExit",
value: function onOverlayExit() {
this.unbindDocumentClickListener();
this.unbindScrollListener();
this.unbindResizeListener();
}
}, {
key: "onOverlayExited",
value: function onOverlayExited() {
if (this.props.filter && this.props.resetFilterOnHide) {
this.resetFilter();
}
ZIndexUtils.clear(this.overlayRef.current);
this.props.onHide && this.props.onHide();
}
}, {
key: "alignOverlay",
value: function alignOverlay() {
DomHandler.alignOverlay(this.overlayRef.current, this.input.parentElement, this.props.appendTo || PrimeReact.appendTo);
}
}, {
key: "scrollInView",
value: function scrollInView() {
var highlightItem = DomHandler.findSingle(this.overlayRef.current, 'li.p-highlight');
if (highlightItem) {
highlightItem.scrollIntoView({
block: 'nearest',
inline: 'start'
});
}
}
}, {
key: "bindDocumentClickListener",
value: function bindDocumentClickListener() {
var _this8 = this;
if (!this.documentClickListener) {
this.documentClickListener = function (event) {
if (_this8.state.overlayVisible && _this8.isOutsideClicked(event)) {
_this8.hideOverlay();
}
};
document.addEventListener('click', this.documentClickListener);
}
}
}, {
key: "unbindDocumentClickListener",
value: function unbindDocumentClickListener() {
if (this.documentClickListener) {
document.removeEventListener('click', this.documentClickListener);
this.documentClickListener = null;
}
}
}, {
key: "bindScrollListener",
value: function bindScrollListener() {
var _this9 = this;
if (!this.scrollHandler) {
this.scrollHandler = new ConnectedOverlayScrollHandler(this.container, function () {
if (_this9.state.overlayVisible) {
_this9.hideOverlay();
}
});
}
this.scrollHandler.bindScrollListener();
}
}, {
key: "unbindScrollListener",
value: function unbindScrollListener() {
if (this.scrollHandler) {
this.scrollHandler.unbindScrollListener();
}
}
}, {
key: "bindResizeListener",
value: function bindResizeListener() {
var _this10 = this;
if (!this.resizeListener) {
this.resizeListener = function () {
if (_this10.state.overlayVisible && !DomHandler.isTouchDevice()) {
_this10.hideOverlay();
}
};
window.addEventListener('resize', this.resizeListener);
}
}
}, {
key: "unbindResizeListener",
value: function unbindResizeListener() {
if (this.resizeListener) {
window.removeEventListener('resize', this.resizeListener);
this.resizeListener = null;
}
}
}, {
key: "isOutsideClicked",
value: function isOutsideClicked(event) {
return this.container && !(this.container.isSameNode(event.target) || this.isClearClicked(event) || this.container.contains(event.target) || this.overlayRef && this.overlayRef.current.contains(event.target));
}
}, {
key: "isClearClicked",
value: function isClearClicked(event) {
return DomHandler.hasClass(event.target, 'p-dropdown-clear-icon') || DomHandler.hasClass(event.target, 'p-dropdown-filter-clear-icon');
}
}, {
key: "updateEditableLabel",
value: function updateEditableLabel(option) {
if (this.input) {
this.input.value = option ? this.getOptionLabel(option) : this.props.value || '';
}
}
}, {
key: "hasFilter",
value: function hasFilter() {
return this.state.filter && this.state.filter.trim().length > 0;
}
}, {
key: "getOptionLabel",
value: function getOptionLabel(option) {
return this.props.optionLabel ? ObjectUtils.resolveFieldData(option, this.props.optionLabel) : option && option['label'] !== undefined ? option['label'] : option;
}
}, {
key: "getOptionValue",
value: function getOptionValue(option) {
return this.props.optionValue ? ObjectUtils.resolveFieldData(option, this.props.optionValue) : option && option['value'] !== undefined ? option['value'] : option;
}
}, {
key: "getOptionRenderKey",
value: function getOptionRenderKey(option) {
return this.props.dataKey ? ObjectUtils.resolveFieldData(option, this.props.dataKey) : this.getOptionLabel(option);
}
}, {
key: "isOptionDisabled",
value: function isOptionDisabled(option) {
if (this.props.optionDisabled) {
return ObjectUtils.isFunction(this.props.optionDisabled) ? this.props.optionDisabled(option) : ObjectUtils.resolveFieldData(option, this.props.optionDisabled);
}
return option && option['disabled'] !== undefined ? option['disabled'] : false;
}
}, {
key: "getOptionGroupRenderKey",
value: function getOptionGroupRenderKey(optionGroup) {
return ObjectUtils.resolveFieldData(optionGroup, this.props.optionGroupLabel);
}
}, {
key: "getOptionGroupLabel",
value: function getOptionGroupLabel(optionGroup) {
return ObjectUtils.resolveFieldData(optionGroup, this.props.optionGroupLabel);
}
}, {
key: "getOptionGroupChildren",
value: function getOptionGroupChildren(optionGroup) {
return ObjectUtils.resolveFieldData(optionGroup, this.props.optionGroupChildren);
}
}, {
key: "checkValidity",
value: function checkValidity() {
if (this.inputRef.current) {
return this.inputRef.current.checkValidity();
}
return false;
}
}, {
key: "isLazy",
value: function isLazy() {
return this.props.virtualScrollerOptions && this.props.virtualScrollerOptions.lazy;
}
}, {
key: "getVisibleOptions",
value: function getVisibleOptions() {
if (this.hasFilter() && !this.isLazy()) {
var filterValue = this.state.filter.trim().toLocaleLowerCase(this.props.filterLocale);
var searchFields = this.props.filterBy ? this.props.filterBy.split(',') : [this.props.optionLabel || 'label'];
if (this.props.optionGroupLabel) {
var filteredGroups = [];
var _iterator = _createForOfIteratorHelper$c(this.props.options),
_step;
try {
for (_iterator.s(); !(_step = _iterator.n()).done;) {
var optgroup = _step.value;
var filteredSubOptions = FilterService.filter(this.getOptionGroupChildren(optgroup), searchFields, filterValue, this.props.filterMatchMode, this.props.filterLocale);
if (filteredSubOptions && filteredSubOptions.length) {
filteredGroups.push(_objectSpread$C(_objectSpread$C({}, optgroup), {
items: filteredSubOptions
}));
}
}
} catch (err) {
_iterator.e(err);
} finally {
_iterator.f();
}
return filteredGroups;
} else {
return FilterService.filter(this.props.options, searchFields, filterValue, this.props.filterMatchMode, this.props.filterLocale);
}
} else {
return this.props.options;
}
}
}, {
key: "updateInputField",
value: function updateInputField() {
if (this.props.editable && this.input) {
var selectedOption = this.getSelectedOption();
var label = selectedOption ? this.getOptionLabel(selectedOption) : null;
var value = label || this.props.value || '';
this.input.value = value;
}
}
}, {
key: "updateInputRef",
value: function updateInputRef() {
var ref = this.props.inputRef;
if (ref) {
if (typeof ref === 'function') {
ref(this.inputRef.current);
} else {
ref.current = this.inputRef.current;
}
}
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
this.updateInputRef();
if (this.props.autoFocus && this.focusInput) {
this.focusInput.focus();
}
if (this.props.tooltip) {
this.renderTooltip();
}
this.updateInputField();
if (this.inputRef.current) {
this.inputRef.current.selectedIndex = 1;
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
this.unbindDocumentClickListener();
this.unbindResizeListener();
if (this.scrollHandler) {
this.scrollHandler.destroy();
this.scrollHandler = null;
}
if (this.tooltip) {
this.tooltip.destroy();
this.tooltip = null;
}
if (this.hideTimeout) {
clearTimeout(this.hideTimeout);
this.hideTimeout = null;
}
ZIndexUtils.clear(this.overlayRef.current);
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps) {
if (this.state.overlayVisible) {
if (this.props.filter) {
this.alignOverlay();
}
if (prevProps.value !== this.props.value) {
this.scrollInView();
}
}
if (prevProps.tooltip !== this.props.tooltip || prevProps.tooltipOptions !== this.props.tooltipOptions) {
if (this.tooltip) this.tooltip.update(_objectSpread$C({
content: this.props.tooltip
}, this.props.tooltipOptions || {}));else this.renderTooltip();
}
if (this.state.filter && (!this.props.options || this.props.options.length === 0)) {
this.setState({
filter: ''
});
}
this.updateInputField();
if (this.inputRef.current) {
this.inputRef.current.selectedIndex = 1;
}
}
}, {
key: "renderHiddenSelect",
value: function renderHiddenSelect(selectedOption) {
var placeHolderOption = /*#__PURE__*/React__default["default"].createElement("option", {
value: ""
}, this.props.placeholder);
var option = selectedOption ? /*#__PURE__*/React__default["default"].createElement("option", {
value: selectedOption.value
}, this.getOptionLabel(selectedOption)) : null;
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-hidden-accessible p-dropdown-hidden-select"
}, /*#__PURE__*/React__default["default"].createElement("select", {
ref: this.inputRef,
required: this.props.required,
name: this.props.name,
tabIndex: -1,
"aria-hidden": "true"
}, placeHolderOption, option));
}
}, {
key: "renderTooltip",
value: function renderTooltip() {
this.tooltip = tip({
target: this.container,
content: this.props.tooltip,
options: this.props.tooltipOptions
});
}
}, {
key: "renderKeyboardHelper",
value: function renderKeyboardHelper() {
var _this11 = this;
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-hidden-accessible"
}, /*#__PURE__*/React__default["default"].createElement("input", {
ref: function ref(el) {
return _this11.focusInput = el;
},
id: this.props.inputId,
type: "text",
readOnly: true,
"aria-haspopup": "listbox",
onFocus: this.onInputFocus,
onBlur: this.onInputBlur,
onKeyDown: this.onInputKeyDown,
disabled: this.props.disabled,
tabIndex: this.props.tabIndex,
"aria-label": this.props.ariaLabel,
"aria-labelledby": this.props.ariaLabelledBy
}));
}
}, {
key: "renderLabel",
value: function renderLabel(selectedOption) {
var _this12 = this;
var label = ObjectUtils.isNotEmpty(selectedOption) ? this.getOptionLabel(selectedOption) : null;
if (this.props.editable) {
var value = label || this.props.value || '';
return /*#__PURE__*/React__default["default"].createElement("input", {
ref: function ref(el) {
return _this12.input = el;
},
type: "text",
defaultValue: value,
className: "p-dropdown-label p-inputtext",
disabled: this.props.disabled,
placeholder: this.props.placeholder,
maxLength: this.props.maxLength,
onInput: this.onEditableInputChange,
onFocus: this.onEditableInputFocus,
onBlur: this.onInputBlur,
"aria-label": this.props.ariaLabel,
"aria-labelledby": this.props.ariaLabelledBy,
"aria-haspopup": "listbox"
});
} else {
var className = classNames('p-dropdown-label p-inputtext', {
'p-placeholder': label === null && this.props.placeholder,
'p-dropdown-label-empty': label === null && !this.props.placeholder
});
var content = this.props.valueTemplate ? ObjectUtils.getJSXElement(this.props.valueTemplate, selectedOption, this.props) : label || this.props.placeholder || 'empty';
return /*#__PURE__*/React__default["default"].createElement("span", {
ref: function ref(el) {
return _this12.input = el;
},
className: className
}, content);
}
}
}, {
key: "renderClearIcon",
value: function renderClearIcon() {
if (this.props.value != null && this.props.showClear && !this.props.disabled) {
return /*#__PURE__*/React__default["default"].createElement("i", {
className: "p-dropdown-clear-icon pi pi-times",
onClick: this.clear
});
}
return null;
}
}, {
key: "renderDropdownIcon",
value: function renderDropdownIcon() {
var _this13 = this;
var iconClassName = classNames('p-dropdown-trigger-icon p-clickable', this.props.dropdownIcon);
return /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this13.trigger = el;
},
className: "p-dropdown-trigger",
role: "button",
"aria-haspopup": "listbox",
"aria-expanded": this.state.overlayVisible
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: iconClassName
}));
}
}, {
key: "render",
value: function render() {
var _this14 = this;
var className = classNames('p-dropdown p-component p-inputwrapper', this.props.className, {
'p-disabled': this.props.disabled,
'p-focus': this.state.focused,
'p-dropdown-clearable': this.props.showClear && !this.props.disabled,
'p-inputwrapper-filled': this.props.value,
'p-inputwrapper-focus': this.state.focused || this.state.overlayVisible
});
var visibleOptions = this.getVisibleOptions();
var selectedOption = this.getSelectedOption();
var appendTo = this.props.appendTo || PrimeReact.appendTo;
var hiddenSelect = this.renderHiddenSelect(selectedOption);
var keyboardHelper = this.renderKeyboardHelper();
var labelElement = this.renderLabel(selectedOption);
var dropdownIcon = this.renderDropdownIcon();
var clearIcon = this.renderClearIcon();
return /*#__PURE__*/React__default["default"].createElement("div", {
id: this.props.id,
ref: function ref(el) {
return _this14.container = el;
},
className: className,
style: this.props.style,
onClick: this.onClick,
onMouseDown: this.props.onMouseDown,
onContextMenu: this.props.onContextMenu
}, keyboardHelper, hiddenSelect, labelElement, clearIcon, dropdownIcon, /*#__PURE__*/React__default["default"].createElement(DropdownPanel, _extends({
ref: this.overlayRef,
visibleOptions: visibleOptions
}, this.props, {
appendTo: appendTo,
onClick: this.onPanelClick,
onOptionClick: this.onOptionClick,
filterValue: this.state.filter,
hasFilter: this.hasFilter,
onFilterClearIconClick: this.onFilterClearIconClick,
onFilterInputKeyDown: this.onFilterInputKeyDown,
onFilterInputChange: this.onFilterInputChange,
getOptionLabel: this.getOptionLabel,
getOptionRenderKey: this.getOptionRenderKey,
isOptionDisabled: this.isOptionDisabled,
getOptionGroupChildren: this.getOptionGroupChildren,
getOptionGroupLabel: this.getOptionGroupLabel,
getOptionGroupRenderKey: this.getOptionGroupRenderKey,
isSelected: this.isSelected,
getSelectedOptionIndex: this.getSelectedOptionIndex,
"in": this.state.overlayVisible,
onEnter: this.onOverlayEnter,
onEntered: this.onOverlayEntered,
onExit: this.onOverlayExit,
onExited: this.onOverlayExited
})));
}
}]);
return Dropdown;
}(React.Component);
_defineProperty(Dropdown, "defaultProps", {
id: null,
inputRef: null,
name: null,
value: null,
options: null,
optionLabel: null,
optionValue: null,
optionDisabled: null,
optionGroupLabel: null,
optionGroupChildren: null,
optionGroupTemplate: null,
valueTemplate: null,
itemTemplate: null,
style: null,
className: null,
virtualScrollerOptions: null,
scrollHeight: '200px',
filter: false,
filterBy: null,
filterMatchMode: 'contains',
filterPlaceholder: null,
filterLocale: undefined,
emptyMessage: null,
emptyFilterMessage: null,
editable: false,
placeholder: null,
required: false,
disabled: false,
appendTo: null,
tabIndex: null,
autoFocus: false,
filterInputAutoFocus: true,
resetFilterOnHide: false,
showFilterClear: false,
panelClassName: null,
panelStyle: null,
dataKey: null,
inputId: null,
showClear: false,
maxLength: null,
tooltip: null,
tooltipOptions: null,
ariaLabel: null,
ariaLabelledBy: null,
transitionOptions: null,
dropdownIcon: 'pi pi-chevron-down',
showOnFocus: false,
onChange: null,
onFocus: null,
onBlur: null,
onMouseDown: null,
onContextMenu: null,
onShow: null,
onHide: null,
onFilter: null
});
function _createSuper$1H(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1H(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1H() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var RowsPerPageDropdown = /*#__PURE__*/function (_Component) {
_inherits(RowsPerPageDropdown, _Component);
var _super = _createSuper$1H(RowsPerPageDropdown);
function RowsPerPageDropdown() {
_classCallCheck(this, RowsPerPageDropdown);
return _super.apply(this, arguments);
}
_createClass(RowsPerPageDropdown, [{
key: "hasOptions",
value: function hasOptions() {
return this.props.options && this.props.options.length > 0;
}
}, {
key: "render",
value: function render() {
var hasOptions = this.hasOptions();
var options = hasOptions ? this.props.options.map(function (opt) {
return {
label: String(opt),
value: opt
};
}) : [];
var element = hasOptions ? /*#__PURE__*/React__default["default"].createElement(Dropdown, {
value: this.props.value,
options: options,
onChange: this.props.onChange,
appendTo: this.props.appendTo,
disabled: this.props.disabled
}) : null;
if (this.props.template) {
var defaultOptions = {
value: this.props.value,
options: options,
onChange: this.props.onChange,
appendTo: this.props.appendTo,
currentPage: this.props.page,
totalPages: this.props.pageCount,
totalRecords: this.props.totalRecords,
disabled: this.props.disabled,
element: element,
props: this.props
};
return ObjectUtils.getJSXElement(this.props.template, defaultOptions);
}
return element;
}
}]);
return RowsPerPageDropdown;
}(React.Component);
_defineProperty(RowsPerPageDropdown, "defaultProps", {
options: null,
value: null,
page: null,
pageCount: null,
totalRecords: 0,
appendTo: null,
onChange: null,
template: null,
disabled: false
});
function ownKeys$B(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$B(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$B(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$B(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createSuper$1G(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1G(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1G() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var CurrentPageReport = /*#__PURE__*/function (_Component) {
_inherits(CurrentPageReport, _Component);
var _super = _createSuper$1G(CurrentPageReport);
function CurrentPageReport() {
_classCallCheck(this, CurrentPageReport);
return _super.apply(this, arguments);
}
_createClass(CurrentPageReport, [{
key: "render",
value: function render() {
var report = {
currentPage: this.props.page + 1,
totalPages: this.props.pageCount,
first: Math.min(this.props.first + 1, this.props.totalRecords),
last: Math.min(this.props.first + this.props.rows, this.props.totalRecords),
rows: this.props.rows,
totalRecords: this.props.totalRecords
};
var text = this.props.reportTemplate.replace("{currentPage}", report.currentPage).replace("{totalPages}", report.totalPages).replace("{first}", report.first).replace("{last}", report.last).replace("{rows}", report.rows).replace("{totalRecords}", report.totalRecords);
var element = /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-paginator-current"
}, text);
if (this.props.template) {
var defaultOptions = _objectSpread$B(_objectSpread$B({}, report), {
className: 'p-paginator-current',
element: element,
props: this.props
});
return ObjectUtils.getJSXElement(this.props.template, defaultOptions);
}
return element;
}
}]);
return CurrentPageReport;
}(React.Component);
_defineProperty(CurrentPageReport, "defaultProps", {
pageCount: null,
page: null,
first: null,
rows: null,
totalRecords: null,
reportTemplate: '({currentPage} of {totalPages})',
template: null
});
function ownKeys$A(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$A(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$A(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$A(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createSuper$1F(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1F(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1F() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var InputNumber = /*#__PURE__*/function (_Component) {
_inherits(InputNumber, _Component);
var _super = _createSuper$1F(InputNumber);
function InputNumber(props) {
var _this;
_classCallCheck(this, InputNumber);
_this = _super.call(this, props);
_this.state = {
focused: false
};
_this.constructParser();
_this.onInput = _this.onInput.bind(_assertThisInitialized(_this));
_this.onInputKeyDown = _this.onInputKeyDown.bind(_assertThisInitialized(_this));
_this.onInputKeyPress = _this.onInputKeyPress.bind(_assertThisInitialized(_this));
_this.onInputClick = _this.onInputClick.bind(_assertThisInitialized(_this));
_this.onInputBlur = _this.onInputBlur.bind(_assertThisInitialized(_this));
_this.onInputFocus = _this.onInputFocus.bind(_assertThisInitialized(_this));
_this.onPaste = _this.onPaste.bind(_assertThisInitialized(_this));
_this.onUpButtonMouseLeave = _this.onUpButtonMouseLeave.bind(_assertThisInitialized(_this));
_this.onUpButtonMouseDown = _this.onUpButtonMouseDown.bind(_assertThisInitialized(_this));
_this.onUpButtonMouseUp = _this.onUpButtonMouseUp.bind(_assertThisInitialized(_this));
_this.onUpButtonKeyDown = _this.onUpButtonKeyDown.bind(_assertThisInitialized(_this));
_this.onUpButtonKeyUp = _this.onUpButtonKeyUp.bind(_assertThisInitialized(_this));
_this.onDownButtonMouseLeave = _this.onDownButtonMouseLeave.bind(_assertThisInitialized(_this));
_this.onDownButtonMouseDown = _this.onDownButtonMouseDown.bind(_assertThisInitialized(_this));
_this.onDownButtonMouseUp = _this.onDownButtonMouseUp.bind(_assertThisInitialized(_this));
_this.onDownButtonKeyDown = _this.onDownButtonKeyDown.bind(_assertThisInitialized(_this));
_this.onDownButtonKeyUp = _this.onDownButtonKeyUp.bind(_assertThisInitialized(_this));
_this.inputRef = /*#__PURE__*/React.createRef(_this.props.inputRef);
return _this;
}
_createClass(InputNumber, [{
key: "getOptions",
value: function getOptions() {
return {
localeMatcher: this.props.localeMatcher,
style: this.props.mode,
currency: this.props.currency,
currencyDisplay: this.props.currencyDisplay,
useGrouping: this.props.useGrouping,
minimumFractionDigits: this.props.minFractionDigits,
maximumFractionDigits: this.props.maxFractionDigits
};
}
}, {
key: "constructParser",
value: function constructParser() {
this.numberFormat = new Intl.NumberFormat(this.props.locale, this.getOptions());
var numerals = _toConsumableArray(new Intl.NumberFormat(this.props.locale, {
useGrouping: false
}).format(9876543210)).reverse();
var index = new Map(numerals.map(function (d, i) {
return [d, i];
}));
this._numeral = new RegExp("[".concat(numerals.join(''), "]"), 'g');
this._group = this.getGroupingExpression();
this._minusSign = this.getMinusSignExpression();
this._currency = this.getCurrencyExpression();
this._decimal = this.getDecimalExpression();
this._suffix = this.getSuffixExpression();
this._prefix = this.getPrefixExpression();
this._index = function (d) {
return index.get(d);
};
}
}, {
key: "escapeRegExp",
value: function escapeRegExp(text) {
return text.replace(/[-[\]{}()*+?.,\\^$|#\s]/g, '\\$&');
}
}, {
key: "getDecimalExpression",
value: function getDecimalExpression() {
var formatter = new Intl.NumberFormat(this.props.locale, _objectSpread$A(_objectSpread$A({}, this.getOptions()), {}, {
useGrouping: false
}));
return new RegExp("[".concat(formatter.format(1.1).replace(this._currency, '').trim().replace(this._numeral, ''), "]"), 'g');
}
}, {
key: "getGroupingExpression",
value: function getGroupingExpression() {
var formatter = new Intl.NumberFormat(this.props.locale, {
useGrouping: true
});
this.groupChar = formatter.format(1000000).trim().replace(this._numeral, '').charAt(0);
return new RegExp("[".concat(this.groupChar, "]"), 'g');
}
}, {
key: "getMinusSignExpression",
value: function getMinusSignExpression() {
var formatter = new Intl.NumberFormat(this.props.locale, {
useGrouping: false
});
return new RegExp("[".concat(formatter.format(-1).trim().replace(this._numeral, ''), "]"), 'g');
}
}, {
key: "getCurrencyExpression",
value: function getCurrencyExpression() {
if (this.props.currency) {
var formatter = new Intl.NumberFormat(this.props.locale, {
style: 'currency',
currency: this.props.currency,
currencyDisplay: this.props.currencyDisplay,
minimumFractionDigits: 0,
maximumFractionDigits: 0
});
return new RegExp("[".concat(formatter.format(1).replace(/\s/g, '').replace(this._numeral, '').replace(this._group, ''), "]"), 'g');
}
return new RegExp("[]", 'g');
}
}, {
key: "getPrefixExpression",
value: function getPrefixExpression() {
if (this.props.prefix) {
this.prefixChar = this.props.prefix;
} else {
var formatter = new Intl.NumberFormat(this.props.locale, {
style: this.props.mode,
currency: this.props.currency,
currencyDisplay: this.props.currencyDisplay
});
this.prefixChar = formatter.format(1).split('1')[0];
}
return new RegExp("".concat(this.escapeRegExp(this.prefixChar || '')), 'g');
}
}, {
key: "getSuffixExpression",
value: function getSuffixExpression() {
if (this.props.suffix) {
this.suffixChar = this.props.suffix;
} else {
var formatter = new Intl.NumberFormat(this.props.locale, {
style: this.props.mode,
currency: this.props.currency,
currencyDisplay: this.props.currencyDisplay,
minimumFractionDigits: 0,
maximumFractionDigits: 0
});
this.suffixChar = formatter.format(1).split('1')[1];
}
return new RegExp("".concat(this.escapeRegExp(this.suffixChar || '')), 'g');
}
}, {
key: "formatValue",
value: function formatValue(value) {
if (value != null) {
if (value === '-') {
// Minus sign
return value;
}
if (this.props.format) {
var formatter = new Intl.NumberFormat(this.props.locale, this.getOptions());
var formattedValue = formatter.format(value);
if (this.props.prefix) {
formattedValue = this.props.prefix + formattedValue;
}
if (this.props.suffix) {
formattedValue = formattedValue + this.props.suffix;
}
return formattedValue;
}
return value.toString();
}
return '';
}
}, {
key: "parseValue",
value: function parseValue(text) {
var filteredText = text.replace(this._suffix, '').replace(this._prefix, '').trim().replace(/\s/g, '').replace(this._currency, '').replace(this._group, '').replace(this._minusSign, '-').replace(this._decimal, '.').replace(this._numeral, this._index);
if (filteredText) {
if (filteredText === '-') // Minus sign
return filteredText;
var parsedValue = +filteredText;
return isNaN(parsedValue) ? null : parsedValue;
}
return null;
}
}, {
key: "repeat",
value: function repeat(event, interval, dir) {
var _this2 = this;
var i = interval || 500;
this.clearTimer();
this.timer = setTimeout(function () {
_this2.repeat(event, 40, dir);
}, i);
this.spin(event, dir);
}
}, {
key: "spin",
value: function spin(event, dir) {
if (this.inputRef && this.inputRef.current) {
var step = this.props.step * dir;
var currentValue = this.parseValue(this.inputRef.current.value) || 0;
var newValue = this.validateValue(currentValue + step);
this.updateInput(newValue, null, 'spin');
this.updateModel(event, newValue);
this.handleOnChange(event, currentValue, newValue);
}
}
}, {
key: "onUpButtonMouseDown",
value: function onUpButtonMouseDown(event) {
if (!this.props.disabled && !this.props.readOnly) {
this.inputRef.current.focus();
this.repeat(event, null, 1);
event.preventDefault();
}
}
}, {
key: "onUpButtonMouseUp",
value: function onUpButtonMouseUp() {
if (!this.props.disabled && !this.props.readOnly) {
this.clearTimer();
}
}
}, {
key: "onUpButtonMouseLeave",
value: function onUpButtonMouseLeave() {
if (!this.props.disabled && !this.props.readOnly) {
this.clearTimer();
}
}
}, {
key: "onUpButtonKeyUp",
value: function onUpButtonKeyUp() {
if (!this.props.disabled && !this.props.readOnly) {
this.clearTimer();
}
}
}, {
key: "onUpButtonKeyDown",
value: function onUpButtonKeyDown(event) {
if (!this.props.disabled && !this.props.readOnly && (event.keyCode === 32 || event.keyCode === 13)) {
this.repeat(event, null, 1);
}
}
}, {
key: "onDownButtonMouseDown",
value: function onDownButtonMouseDown(event) {
if (!this.props.disabled && !this.props.readOnly) {
this.inputRef.current.focus();
this.repeat(event, null, -1);
event.preventDefault();
}
}
}, {
key: "onDownButtonMouseUp",
value: function onDownButtonMouseUp() {
if (!this.props.disabled && !this.props.readOnly) {
this.clearTimer();
}
}
}, {
key: "onDownButtonMouseLeave",
value: function onDownButtonMouseLeave() {
if (!this.props.disabled && !this.props.readOnly) {
this.clearTimer();
}
}
}, {
key: "onDownButtonKeyUp",
value: function onDownButtonKeyUp() {
if (!this.props.disabled && !this.props.readOnly) {
this.clearTimer();
}
}
}, {
key: "onDownButtonKeyDown",
value: function onDownButtonKeyDown(event) {
if (!this.props.disabled && !this.props.readOnly && (event.keyCode === 32 || event.keyCode === 13)) {
this.repeat(event, null, -1);
}
}
}, {
key: "onInput",
value: function onInput(event) {
if (this.props.disabled || this.props.readOnly) {
return;
}
if (this.isSpecialChar) {
event.target.value = this.lastValue;
}
this.isSpecialChar = false;
}
}, {
key: "onInputKeyDown",
value: function onInputKeyDown(event) {
if (this.props.disabled || this.props.readOnly) {
return;
}
this.lastValue = event.target.value;
if (event.shiftKey || event.altKey) {
this.isSpecialChar = true;
return;
}
var selectionStart = event.target.selectionStart;
var selectionEnd = event.target.selectionEnd;
var inputValue = event.target.value;
var newValueStr = null;
if (event.altKey) {
event.preventDefault();
}
switch (event.which) {
//up
case 38:
this.spin(event, 1);
event.preventDefault();
break;
//down
case 40:
this.spin(event, -1);
event.preventDefault();
break;
//left
case 37:
if (!this.isNumeralChar(inputValue.charAt(selectionStart - 1))) {
event.preventDefault();
}
break;
//right
case 39:
if (!this.isNumeralChar(inputValue.charAt(selectionStart))) {
event.preventDefault();
}
break;
//enter
case 13:
newValueStr = this.validateValue(this.parseValue(inputValue));
this.inputRef.current.value = this.formatValue(newValueStr);
this.inputRef.current.setAttribute('aria-valuenow', newValueStr);
this.updateModel(event, newValueStr);
break;
//backspace
case 8:
event.preventDefault();
if (selectionStart === selectionEnd) {
var deleteChar = inputValue.charAt(selectionStart - 1);
var _this$getDecimalCharI = this.getDecimalCharIndexes(inputValue),
decimalCharIndex = _this$getDecimalCharI.decimalCharIndex,
decimalCharIndexWithoutPrefix = _this$getDecimalCharI.decimalCharIndexWithoutPrefix;
if (this.isNumeralChar(deleteChar)) {
var decimalLength = this.getDecimalLength(inputValue);
if (this._group.test(deleteChar)) {
this._group.lastIndex = 0;
newValueStr = inputValue.slice(0, selectionStart - 2) + inputValue.slice(selectionStart - 1);
} else if (this._decimal.test(deleteChar)) {
this._decimal.lastIndex = 0;
if (decimalLength) {
this.inputRef.current.setSelectionRange(selectionStart - 1, selectionStart - 1);
} else {
newValueStr = inputValue.slice(0, selectionStart - 1) + inputValue.slice(selectionStart);
}
} else if (decimalCharIndex > 0 && selectionStart > decimalCharIndex) {
var insertedText = this.isDecimalMode() && (this.props.minFractionDigits || 0) < decimalLength ? '' : '0';
newValueStr = inputValue.slice(0, selectionStart - 1) + insertedText + inputValue.slice(selectionStart);
} else if (decimalCharIndexWithoutPrefix === 1) {
newValueStr = inputValue.slice(0, selectionStart - 1) + '0' + inputValue.slice(selectionStart);
newValueStr = this.parseValue(newValueStr) > 0 ? newValueStr : '';
} else {
newValueStr = inputValue.slice(0, selectionStart - 1) + inputValue.slice(selectionStart);
}
}
this.updateValue(event, newValueStr, null, 'delete-single');
} else {
newValueStr = this.deleteRange(inputValue, selectionStart, selectionEnd);
this.updateValue(event, newValueStr, null, 'delete-range');
}
break;
// del
case 46:
event.preventDefault();
if (selectionStart === selectionEnd) {
var _deleteChar = inputValue.charAt(selectionStart);
var _this$getDecimalCharI2 = this.getDecimalCharIndexes(inputValue),
_decimalCharIndex = _this$getDecimalCharI2.decimalCharIndex,
_decimalCharIndexWithoutPrefix = _this$getDecimalCharI2.decimalCharIndexWithoutPrefix;
if (this.isNumeralChar(_deleteChar)) {
var _decimalLength = this.getDecimalLength(inputValue);
if (this._group.test(_deleteChar)) {
this._group.lastIndex = 0;
newValueStr = inputValue.slice(0, selectionStart) + inputValue.slice(selectionStart + 2);
} else if (this._decimal.test(_deleteChar)) {
this._decimal.lastIndex = 0;
if (_decimalLength) {
this.$refs.input.$el.setSelectionRange(selectionStart + 1, selectionStart + 1);
} else {
newValueStr = inputValue.slice(0, selectionStart) + inputValue.slice(selectionStart + 1);
}
} else if (_decimalCharIndex > 0 && selectionStart > _decimalCharIndex) {
var _insertedText = this.isDecimalMode() && (this.props.minFractionDigits || 0) < _decimalLength ? '' : '0';
newValueStr = inputValue.slice(0, selectionStart) + _insertedText + inputValue.slice(selectionStart + 1);
} else if (_decimalCharIndexWithoutPrefix === 1) {
newValueStr = inputValue.slice(0, selectionStart) + '0' + inputValue.slice(selectionStart + 1);
newValueStr = this.parseValue(newValueStr) > 0 ? newValueStr : '';
} else {
newValueStr = inputValue.slice(0, selectionStart) + inputValue.slice(selectionStart + 1);
}
}
this.updateValue(event, newValueStr, null, 'delete-back-single');
} else {
newValueStr = this.deleteRange(inputValue, selectionStart, selectionEnd);
this.updateValue(event, newValueStr, null, 'delete-range');
}
break;
}
if (this.props.onKeyDown) {
this.props.onKeyDown(event);
}
}
}, {
key: "onInputKeyPress",
value: function onInputKeyPress(event) {
if (this.props.disabled || this.props.readOnly) {
return;
}
var code = event.which || event.keyCode;
var _char = String.fromCharCode(code);
var isDecimalSign = this.isDecimalSign(_char);
var isMinusSign = this.isMinusSign(_char);
if (48 <= code && code <= 57 || isMinusSign || isDecimalSign) {
this.insert(event, _char, {
isDecimalSign: isDecimalSign,
isMinusSign: isMinusSign
});
event.preventDefault();
}
}
}, {
key: "onPaste",
value: function onPaste(event) {
event.preventDefault();
if (this.props.disabled || this.props.readOnly) {
return;
}
var data = (event.clipboardData || window['clipboardData']).getData('Text');
if (data) {
var filteredData = this.parseValue(data);
if (filteredData != null) {
this.insert(event, filteredData.toString());
}
}
}
}, {
key: "allowMinusSign",
value: function allowMinusSign() {
return this.props.min === null || this.props.min < 0;
}
}, {
key: "isMinusSign",
value: function isMinusSign(_char2) {
if (this._minusSign.test(_char2) || _char2 === '-') {
this._minusSign.lastIndex = 0;
return true;
}
return false;
}
}, {
key: "isDecimalSign",
value: function isDecimalSign(_char3) {
if (this._decimal.test(_char3)) {
this._decimal.lastIndex = 0;
return true;
}
return false;
}
}, {
key: "isDecimalMode",
value: function isDecimalMode() {
return this.props.mode === 'decimal';
}
}, {
key: "getDecimalCharIndexes",
value: function getDecimalCharIndexes(val) {
var decimalCharIndex = val.search(this._decimal);
this._decimal.lastIndex = 0;
var filteredVal = val.replace(this._prefix, '').trim().replace(/\s/g, '').replace(this._currency, '');
var decimalCharIndexWithoutPrefix = filteredVal.search(this._decimal);
this._decimal.lastIndex = 0;
return {
decimalCharIndex: decimalCharIndex,
decimalCharIndexWithoutPrefix: decimalCharIndexWithoutPrefix
};
}
}, {
key: "getCharIndexes",
value: function getCharIndexes(val) {
var decimalCharIndex = val.search(this._decimal);
this._decimal.lastIndex = 0;
var minusCharIndex = val.search(this._minusSign);
this._minusSign.lastIndex = 0;
var suffixCharIndex = val.search(this._suffix);
this._suffix.lastIndex = 0;
var currencyCharIndex = val.search(this._currency);
this._currency.lastIndex = 0;
return {
decimalCharIndex: decimalCharIndex,
minusCharIndex: minusCharIndex,
suffixCharIndex: suffixCharIndex,
currencyCharIndex: currencyCharIndex
};
}
}, {
key: "insert",
value: function insert(event, text) {
var sign = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {
isDecimalSign: false,
isMinusSign: false
};
var minusCharIndexOnText = text.search(this._minusSign);
this._minusSign.lastIndex = 0;
if (!this.allowMinusSign() && minusCharIndexOnText !== -1) {
return;
}
var selectionStart = this.inputRef.current.selectionStart;
var selectionEnd = this.inputRef.current.selectionEnd;
var inputValue = this.inputRef.current.value.trim();
var _this$getCharIndexes = this.getCharIndexes(inputValue),
decimalCharIndex = _this$getCharIndexes.decimalCharIndex,
minusCharIndex = _this$getCharIndexes.minusCharIndex,
suffixCharIndex = _this$getCharIndexes.suffixCharIndex,
currencyCharIndex = _this$getCharIndexes.currencyCharIndex;
var newValueStr;
if (sign.isMinusSign) {
if (selectionStart === 0) {
newValueStr = inputValue;
if (minusCharIndex === -1 || selectionEnd !== 0) {
newValueStr = this.insertText(inputValue, text, 0, selectionEnd);
}
this.updateValue(event, newValueStr, text, 'insert');
}
} else if (sign.isDecimalSign) {
if (decimalCharIndex > 0 && selectionStart === decimalCharIndex) {
this.updateValue(event, inputValue, text, 'insert');
} else if (decimalCharIndex > selectionStart && decimalCharIndex < selectionEnd) {
newValueStr = this.insertText(inputValue, text, selectionStart, selectionEnd);
this.updateValue(event, newValueStr, text, 'insert');
} else if (decimalCharIndex === -1 && this.props.maxFractionDigits) {
newValueStr = this.insertText(inputValue, text, selectionStart, selectionEnd);
this.updateValue(event, newValueStr, text, 'insert');
}
} else {
var maxFractionDigits = this.numberFormat.resolvedOptions().maximumFractionDigits;
var operation = selectionStart !== selectionEnd ? 'range-insert' : 'insert';
if (decimalCharIndex > 0 && selectionStart > decimalCharIndex) {
if (selectionStart + text.length - (decimalCharIndex + 1) <= maxFractionDigits) {
var charIndex = currencyCharIndex >= selectionStart ? currencyCharIndex - 1 : suffixCharIndex >= selectionStart ? suffixCharIndex : inputValue.length;
newValueStr = inputValue.slice(0, selectionStart) + text + inputValue.slice(selectionStart + text.length, charIndex) + inputValue.slice(charIndex);
this.updateValue(event, newValueStr, text, operation);
}
} else {
newValueStr = this.insertText(inputValue, text, selectionStart, selectionEnd);
this.updateValue(event, newValueStr, text, operation);
}
}
}
}, {
key: "insertText",
value: function insertText(value, text, start, end) {
var textSplit = text === '.' ? text : text.split('.');
if (textSplit.length === 2) {
var decimalCharIndex = value.slice(start, end).search(this._decimal);
this._decimal.lastIndex = 0;
return decimalCharIndex > 0 ? value.slice(0, start) + this.formatValue(text) + value.slice(end) : value || this.formatValue(text);
} else if (end - start === value.length) {
return this.formatValue(text);
} else if (start === 0) {
return text + value.slice(end);
} else if (end === value.length) {
return value.slice(0, start) + text;
} else {
return value.slice(0, start) + text + value.slice(end);
}
}
}, {
key: "deleteRange",
value: function deleteRange(value, start, end) {
var newValueStr;
if (end - start === value.length) newValueStr = '';else if (start === 0) newValueStr = value.slice(end);else if (end === value.length) newValueStr = value.slice(0, start);else newValueStr = value.slice(0, start) + value.slice(end);
return newValueStr;
}
}, {
key: "initCursor",
value: function initCursor() {
var selectionStart = this.inputRef.current.selectionStart;
var inputValue = this.inputRef.current.value;
var valueLength = inputValue.length;
var index = null; // remove prefix
var prefixLength = (this.prefixChar || '').length;
inputValue = inputValue.replace(this._prefix, '');
selectionStart = selectionStart - prefixLength;
var _char4 = inputValue.charAt(selectionStart);
if (this.isNumeralChar(_char4)) {
return selectionStart + prefixLength;
} //left
var i = selectionStart - 1;
while (i >= 0) {
_char4 = inputValue.charAt(i);
if (this.isNumeralChar(_char4)) {
index = i + prefixLength;
break;
} else {
i--;
}
}
if (index !== null) {
this.inputRef.current.setSelectionRange(index + 1, index + 1);
} else {
i = selectionStart;
while (i < valueLength) {
_char4 = inputValue.charAt(i);
if (this.isNumeralChar(_char4)) {
index = i + prefixLength;
break;
} else {
i++;
}
}
if (index !== null) {
this.inputRef.current.setSelectionRange(index, index);
}
}
return index || 0;
}
}, {
key: "onInputClick",
value: function onInputClick() {
this.initCursor();
}
}, {
key: "isNumeralChar",
value: function isNumeralChar(_char5) {
if (_char5.length === 1 && (this._numeral.test(_char5) || this._decimal.test(_char5) || this._group.test(_char5) || this._minusSign.test(_char5))) {
this.resetRegex();
return true;
} else {
return false;
}
}
}, {
key: "resetRegex",
value: function resetRegex() {
this._numeral.lastIndex = 0;
this._decimal.lastIndex = 0;
this._group.lastIndex = 0;
this._minusSign.lastIndex = 0;
}
}, {
key: "updateValue",
value: function updateValue(event, valueStr, insertedValueStr, operation) {
var currentValue = this.inputRef.current.value;
var newValue = null;
if (valueStr != null) {
newValue = this.parseValue(valueStr);
newValue = this.evaluateEmpty(newValue);
this.updateInput(newValue, insertedValueStr, operation, valueStr);
this.handleOnChange(event, currentValue, newValue);
}
}
}, {
key: "evaluateEmpty",
value: function evaluateEmpty(newValue) {
return !newValue && !this.props.allowEmpty ? this.props.min || 0 : newValue;
}
}, {
key: "handleOnChange",
value: function handleOnChange(event, currentValue, newValue) {
if (this.props.onChange && this.isValueChanged(currentValue, newValue)) {
this.props.onChange({
originalEvent: event,
value: newValue
});
}
}
}, {
key: "isValueChanged",
value: function isValueChanged(currentValue, newValue) {
if (newValue === null && currentValue !== null) {
return true;
}
if (newValue != null) {
var parsedCurrentValue = typeof currentValue === 'string' ? this.parseValue(currentValue) : currentValue;
return newValue !== parsedCurrentValue;
}
return false;
}
}, {
key: "validateValue",
value: function validateValue(value) {
if (value === '-' || value == null) {
return null;
}
if (this.props.min !== null && value < this.props.min) {
return this.props.min;
}
if (this.props.max !== null && value > this.props.max) {
return this.props.max;
}
return value;
}
}, {
key: "updateInput",
value: function updateInput(value, insertedValueStr, operation, valueStr) {
insertedValueStr = insertedValueStr || '';
var inputEl = this.inputRef.current;
var inputValue = inputEl.value;
var newValue = this.formatValue(value);
var currentLength = inputValue.length;
if (newValue !== valueStr) {
newValue = this.concatValues(newValue, valueStr);
}
if (currentLength === 0) {
inputEl.value = newValue;
inputEl.setSelectionRange(0, 0);
var index = this.initCursor();
var selectionEnd = index + insertedValueStr.length;
inputEl.setSelectionRange(selectionEnd, selectionEnd);
} else {
var selectionStart = inputEl.selectionStart;
var _selectionEnd = inputEl.selectionEnd;
inputEl.value = newValue;
var newLength = newValue.length;
if (operation === 'range-insert') {
var startValue = this.parseValue((inputValue || '').slice(0, selectionStart));
var startValueStr = startValue !== null ? startValue.toString() : '';
var startExpr = startValueStr.split('').join("(".concat(this.groupChar, ")?"));
var sRegex = new RegExp(startExpr, 'g');
sRegex.test(newValue);
var tExpr = insertedValueStr.split('').join("(".concat(this.groupChar, ")?"));
var tRegex = new RegExp(tExpr, 'g');
tRegex.test(newValue.slice(sRegex.lastIndex));
_selectionEnd = sRegex.lastIndex + tRegex.lastIndex;
inputEl.setSelectionRange(_selectionEnd, _selectionEnd);
} else if (newLength === currentLength) {
if (operation === 'insert' || operation === 'delete-back-single') inputEl.setSelectionRange(_selectionEnd + 1, _selectionEnd + 1);else if (operation === 'delete-single') inputEl.setSelectionRange(_selectionEnd - 1, _selectionEnd - 1);else if (operation === 'delete-range' || operation === 'spin') inputEl.setSelectionRange(_selectionEnd, _selectionEnd);
} else if (operation === 'delete-back-single') {
var prevChar = inputValue.charAt(_selectionEnd - 1);
var nextChar = inputValue.charAt(_selectionEnd);
var diff = currentLength - newLength;
var isGroupChar = this._group.test(nextChar);
if (isGroupChar && diff === 1) {
_selectionEnd += 1;
} else if (!isGroupChar && this.isNumeralChar(prevChar)) {
_selectionEnd += -1 * diff + 1;
}
this._group.lastIndex = 0;
inputEl.setSelectionRange(_selectionEnd, _selectionEnd);
} else if (inputValue === '-' && operation === 'insert') {
inputEl.setSelectionRange(0, 0);
var _index = this.initCursor();
var _selectionEnd2 = _index + insertedValueStr.length + 1;
inputEl.setSelectionRange(_selectionEnd2, _selectionEnd2);
} else {
_selectionEnd = _selectionEnd + (newLength - currentLength);
inputEl.setSelectionRange(_selectionEnd, _selectionEnd);
}
}
inputEl.setAttribute('aria-valuenow', value);
}
}, {
key: "updateInputValue",
value: function updateInputValue(newValue) {
newValue = this.evaluateEmpty(newValue);
var inputEl = this.inputRef.current;
var value = inputEl.value;
var formattedValue = this.formattedValue(newValue);
if (value !== formattedValue) {
inputEl.value = formattedValue;
inputEl.setAttribute('aria-valuenow', newValue);
}
}
}, {
key: "formattedValue",
value: function formattedValue(val) {
var newValue = this.evaluateEmpty(val);
return this.formatValue(newValue);
}
}, {
key: "concatValues",
value: function concatValues(val1, val2) {
if (val1 && val2) {
var decimalCharIndex = val2.search(this._decimal);
this._decimal.lastIndex = 0;
return decimalCharIndex !== -1 ? val1.split(this._decimal)[0] + val2.slice(decimalCharIndex) : val1;
}
return val1;
}
}, {
key: "getDecimalLength",
value: function getDecimalLength(value) {
if (value) {
var valueSplit = value.split(this._decimal);
if (valueSplit.length === 2) {
return valueSplit[1].replace(this._suffix, '').trim().replace(/\s/g, '').replace(this._currency, '').length;
}
}
return 0;
}
}, {
key: "updateModel",
value: function updateModel(event, value) {
if (this.props.onValueChange) {
this.props.onValueChange({
originalEvent: event,
value: value,
stopPropagation: function stopPropagation() {},
preventDefault: function preventDefault() {},
target: {
name: this.props.name,
id: this.props.id,
value: value
}
});
}
}
}, {
key: "onInputFocus",
value: function onInputFocus(event) {
var _this3 = this;
event.persist();
this.setState({
focused: true
}, function () {
if (_this3.props.onFocus) {
_this3.props.onFocus(event);
}
});
}
}, {
key: "onInputBlur",
value: function onInputBlur(event) {
var _this4 = this;
event.persist();
this.setState({
focused: false
}, function () {
var currentValue = _this4.inputRef.current.value;
if (_this4.isValueChanged(currentValue, _this4.props.value)) {
var newValue = _this4.validateValue(_this4.parseValue(currentValue));
_this4.updateInputValue(newValue);
_this4.updateModel(event, newValue);
}
if (_this4.props.onBlur) {
_this4.props.onBlur(event);
}
});
}
}, {
key: "clearTimer",
value: function clearTimer() {
if (this.timer) {
clearInterval(this.timer);
}
}
}, {
key: "isStacked",
value: function isStacked() {
return this.props.showButtons && this.props.buttonLayout === 'stacked';
}
}, {
key: "isHorizontal",
value: function isHorizontal() {
return this.props.showButtons && this.props.buttonLayout === 'horizontal';
}
}, {
key: "isVertical",
value: function isVertical() {
return this.props.showButtons && this.props.buttonLayout === 'vertical';
}
}, {
key: "getInputMode",
value: function getInputMode() {
return this.props.inputMode || (this.props.mode === 'decimal' && !this.props.minFractionDigits ? 'numeric' : 'decimal');
}
}, {
key: "getFormatter",
value: function getFormatter() {
return this.numberFormat;
}
}, {
key: "updateInputRef",
value: function updateInputRef() {
var ref = this.props.inputRef;
if (ref) {
if (typeof ref === 'function') {
ref(this.inputRef.current);
} else {
ref.current = this.inputRef.current;
}
}
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
this.updateInputRef();
if (this.props.tooltip) {
this.renderTooltip();
}
var newValue = this.validateValue(this.props.value);
if (this.props.value !== null && this.props.value !== newValue) {
this.updateModel(null, newValue);
}
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps) {
if (prevProps.tooltip !== this.props.tooltip || prevProps.tooltipOptions !== this.props.tooltipOptions) {
if (this.tooltip) this.tooltip.update(_objectSpread$A({
content: this.props.tooltip
}, this.props.tooltipOptions || {}));else this.renderTooltip();
}
var isOptionChanged = this.isOptionChanged(prevProps);
if (isOptionChanged) {
this.constructParser();
}
if (prevProps.value !== this.props.value || isOptionChanged) {
var newValue = this.validateValue(this.props.value);
this.updateInputValue(newValue);
if (this.props.value !== null && this.props.value !== newValue) {
this.updateModel(null, newValue);
}
}
}
}, {
key: "isOptionChanged",
value: function isOptionChanged(prevProps) {
var _this5 = this;
var optionProps = ['locale', 'localeMatcher', 'mode', 'currency', 'currencyDisplay', 'useGrouping', 'minFractionDigits', 'maxFractionDigits', 'suffix', 'prefix'];
return optionProps.some(function (option) {
return prevProps[option] !== _this5.props[option];
});
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
if (this.tooltip) {
this.tooltip.destroy();
this.tooltip = null;
}
}
}, {
key: "renderTooltip",
value: function renderTooltip() {
this.tooltip = tip({
target: this.element,
content: this.props.tooltip,
options: this.props.tooltipOptions
});
}
}, {
key: "renderInputElement",
value: function renderInputElement() {
var className = classNames('p-inputnumber-input', this.props.inputClassName);
var valueToRender = this.formattedValue(this.props.value);
return /*#__PURE__*/React__default["default"].createElement(InputText, {
ref: this.inputRef,
id: this.props.inputId,
style: this.props.inputStyle,
role: "spinbutton",
className: className,
defaultValue: valueToRender,
type: this.props.type,
size: this.props.size,
tabIndex: this.props.tabIndex,
inputMode: this.getInputMode(),
maxLength: this.props.maxLength,
disabled: this.props.disabled,
required: this.props.required,
pattern: this.props.pattern,
placeholder: this.props.placeholder,
readOnly: this.props.readOnly,
name: this.props.name,
autoFocus: this.props.autoFocus,
onKeyDown: this.onInputKeyDown,
onKeyPress: this.onInputKeyPress,
onInput: this.onInput,
onClick: this.onInputClick,
onBlur: this.onInputBlur,
onFocus: this.onInputFocus,
onPaste: this.onPaste,
min: this.props.min,
max: this.props.max,
"aria-valuemin": this.props.min,
"aria-valuemax": this.props.max,
"aria-valuenow": this.props.value,
"aria-labelledby": this.props.ariaLabelledBy
});
}
}, {
key: "renderUpButton",
value: function renderUpButton() {
var className = classNames('p-inputnumber-button p-inputnumber-button-up p-button p-button-icon-only p-component', {
'p-disabled': this.props.disabled
}, this.props.incrementButtonClassName);
var icon = classNames('p-button-icon', this.props.incrementButtonIcon);
return /*#__PURE__*/React__default["default"].createElement("button", {
type: "button",
className: className,
onMouseLeave: this.onUpButtonMouseLeave,
onMouseDown: this.onUpButtonMouseDown,
onMouseUp: this.onUpButtonMouseUp,
onKeyDown: this.onUpButtonKeyDown,
onKeyUp: this.onUpButtonKeyUp,
disabled: this.props.disabled,
tabIndex: -1
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: icon
}), /*#__PURE__*/React__default["default"].createElement(Ripple, null));
}
}, {
key: "renderDownButton",
value: function renderDownButton() {
var className = classNames('p-inputnumber-button p-inputnumber-button-down p-button p-button-icon-only p-component', {
'p-disabled': this.props.disabled
}, this.props.decrementButtonClassName);
var icon = classNames('p-button-icon', this.props.decrementButtonIcon);
return /*#__PURE__*/React__default["default"].createElement("button", {
type: "button",
className: className,
onMouseLeave: this.onDownButtonMouseLeave,
onMouseDown: this.onDownButtonMouseDown,
onMouseUp: this.onDownButtonMouseUp,
onKeyDown: this.onDownButtonKeyDown,
onKeyUp: this.onDownButtonKeyUp,
disabled: this.props.disabled,
tabIndex: -1
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: icon
}), /*#__PURE__*/React__default["default"].createElement(Ripple, null));
}
}, {
key: "renderButtonGroup",
value: function renderButtonGroup() {
var upButton = this.props.showButtons && this.renderUpButton();
var downButton = this.props.showButtons && this.renderDownButton();
if (this.isStacked()) {
return /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-inputnumber-button-group"
}, upButton, downButton);
}
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, upButton, downButton);
}
}, {
key: "render",
value: function render() {
var _this6 = this;
var className = classNames('p-inputnumber p-component p-inputwrapper', this.props.className, {
'p-inputwrapper-filled': this.props.value != null && this.props.value.toString().length > 0,
'p-inputwrapper-focus': this.state.focused,
'p-inputnumber-buttons-stacked': this.isStacked(),
'p-inputnumber-buttons-horizontal': this.isHorizontal(),
'p-inputnumber-buttons-vertical': this.isVertical()
});
var inputElement = this.renderInputElement();
var buttonGroup = this.renderButtonGroup();
return /*#__PURE__*/React__default["default"].createElement("span", {
ref: function ref(el) {
return _this6.element = el;
},
id: this.props.id,
className: className,
style: this.props.style
}, inputElement, buttonGroup);
}
}]);
return InputNumber;
}(React.Component);
_defineProperty(InputNumber, "defaultProps", {
value: null,
inputRef: null,
format: true,
showButtons: false,
buttonLayout: 'stacked',
incrementButtonClassName: null,
decrementButtonClassName: null,
incrementButtonIcon: 'pi pi-angle-up',
decrementButtonIcon: 'pi pi-angle-down',
locale: undefined,
localeMatcher: undefined,
mode: 'decimal',
suffix: null,
prefix: null,
currency: undefined,
currencyDisplay: undefined,
useGrouping: true,
minFractionDigits: undefined,
maxFractionDigits: undefined,
id: null,
name: null,
type: 'text',
allowEmpty: true,
step: 1,
min: null,
max: null,
disabled: false,
required: false,
tabIndex: null,
pattern: null,
inputMode: null,
placeholder: null,
readOnly: false,
size: null,
style: null,
className: null,
inputId: null,
autoFocus: false,
inputStyle: null,
inputClassName: null,
tooltip: null,
tooltipOptions: null,
ariaLabelledBy: null,
onValueChange: null,
onChange: null,
onBlur: null,
onFocus: null,
onKeyDown: null
});
function _createSuper$1E(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1E(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1E() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var JumpToPageInput = /*#__PURE__*/function (_Component) {
_inherits(JumpToPageInput, _Component);
var _super = _createSuper$1E(JumpToPageInput);
function JumpToPageInput(props) {
var _this;
_classCallCheck(this, JumpToPageInput);
_this = _super.call(this, props);
_this.onChange = _this.onChange.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(JumpToPageInput, [{
key: "onChange",
value: function onChange(event) {
if (this.props.onChange) {
this.props.onChange(this.props.rows * (event.value - 1), this.props.rows);
}
}
}, {
key: "render",
value: function render() {
var value = this.props.pageCount > 0 ? this.props.page + 1 : 0;
var element = /*#__PURE__*/React__default["default"].createElement(InputNumber, {
value: value,
onChange: this.onChange,
className: "p-paginator-page-input",
disabled: this.props.disabled
});
if (this.props.template) {
var defaultOptions = {
value: value,
onChange: this.onChange,
disabled: this.props.disabled,
className: 'p-paginator-page-input',
element: element,
props: this.props
};
return ObjectUtils.getJSXElement(this.props.template, defaultOptions);
}
return element;
}
}]);
return JumpToPageInput;
}(React.Component);
_defineProperty(JumpToPageInput, "defaultProps", {
page: null,
rows: null,
pageCount: null,
disabled: false,
template: null,
onChange: null
});
function _createSuper$1D(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1D(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1D() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var Paginator = /*#__PURE__*/function (_Component) {
_inherits(Paginator, _Component);
var _super = _createSuper$1D(Paginator);
function Paginator(props) {
var _this;
_classCallCheck(this, Paginator);
_this = _super.call(this, props);
_this.changePageToFirst = _this.changePageToFirst.bind(_assertThisInitialized(_this));
_this.changePageToPrev = _this.changePageToPrev.bind(_assertThisInitialized(_this));
_this.changePageToNext = _this.changePageToNext.bind(_assertThisInitialized(_this));
_this.changePageToLast = _this.changePageToLast.bind(_assertThisInitialized(_this));
_this.onRowsChange = _this.onRowsChange.bind(_assertThisInitialized(_this));
_this.changePage = _this.changePage.bind(_assertThisInitialized(_this));
_this.onPageLinkClick = _this.onPageLinkClick.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(Paginator, [{
key: "isFirstPage",
value: function isFirstPage() {
return this.getPage() === 0;
}
}, {
key: "isLastPage",
value: function isLastPage() {
return this.getPage() === this.getPageCount() - 1;
}
}, {
key: "getPageCount",
value: function getPageCount() {
return Math.ceil(this.props.totalRecords / this.props.rows);
}
}, {
key: "calculatePageLinkBoundaries",
value: function calculatePageLinkBoundaries() {
var numberOfPages = this.getPageCount();
var visiblePages = Math.min(this.props.pageLinkSize, numberOfPages); //calculate range, keep current in middle if necessary
var start = Math.max(0, Math.ceil(this.getPage() - visiblePages / 2));
var end = Math.min(numberOfPages - 1, start + visiblePages - 1); //check when approaching to last page
var delta = this.props.pageLinkSize - (end - start + 1);
start = Math.max(0, start - delta);
return [start, end];
}
}, {
key: "updatePageLinks",
value: function updatePageLinks() {
var pageLinks = [];
var boundaries = this.calculatePageLinkBoundaries();
var start = boundaries[0];
var end = boundaries[1];
for (var i = start; i <= end; i++) {
pageLinks.push(i + 1);
}
return pageLinks;
}
}, {
key: "changePage",
value: function changePage(first, rows) {
var pc = this.getPageCount();
var p = Math.floor(first / rows);
if (p >= 0 && p < pc) {
var newPageState = {
first: first,
rows: rows,
page: p,
pageCount: pc
};
if (this.props.onPageChange) {
this.props.onPageChange(newPageState);
}
}
}
}, {
key: "getPage",
value: function getPage() {
return Math.floor(this.props.first / this.props.rows);
}
}, {
key: "empty",
value: function empty() {
var pageCount = this.getPageCount();
return pageCount === 0;
}
}, {
key: "changePageToFirst",
value: function changePageToFirst(event) {
this.changePage(0, this.props.rows);
event.preventDefault();
}
}, {
key: "changePageToPrev",
value: function changePageToPrev(event) {
this.changePage(this.props.first - this.props.rows, this.props.rows);
event.preventDefault();
}
}, {
key: "onPageLinkClick",
value: function onPageLinkClick(event) {
this.changePage((event.value - 1) * this.props.rows, this.props.rows);
}
}, {
key: "changePageToNext",
value: function changePageToNext(event) {
this.changePage(this.props.first + this.props.rows, this.props.rows);
event.preventDefault();
}
}, {
key: "changePageToLast",
value: function changePageToLast(event) {
this.changePage((this.getPageCount() - 1) * this.props.rows, this.props.rows);
event.preventDefault();
}
}, {
key: "onRowsChange",
value: function onRowsChange(event) {
var rows = event.value;
this.isRowChanged = rows !== this.props.rows;
this.changePage(0, rows);
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps, prevState) {
if (this.props.rows !== prevProps.rows && !this.isRowChanged) {
this.changePage(0, this.props.rows);
} else if (this.getPage() > 0 && prevProps.totalRecords !== this.props.totalRecords && this.props.first >= this.props.totalRecords) {
this.changePage((this.getPageCount() - 1) * this.props.rows, this.props.rows);
}
this.isRowChanged = false;
}
}, {
key: "renderElement",
value: function renderElement(key, template) {
var element;
switch (key) {
case 'FirstPageLink':
element = /*#__PURE__*/React__default["default"].createElement(FirstPageLink, {
key: key,
onClick: this.changePageToFirst,
disabled: this.isFirstPage() || this.empty(),
template: template
});
break;
case 'PrevPageLink':
element = /*#__PURE__*/React__default["default"].createElement(PrevPageLink, {
key: key,
onClick: this.changePageToPrev,
disabled: this.isFirstPage() || this.empty(),
template: template
});
break;
case 'NextPageLink':
element = /*#__PURE__*/React__default["default"].createElement(NextPageLink, {
key: key,
onClick: this.changePageToNext,
disabled: this.isLastPage() || this.empty(),
template: template
});
break;
case 'LastPageLink':
element = /*#__PURE__*/React__default["default"].createElement(LastPageLink, {
key: key,
onClick: this.changePageToLast,
disabled: this.isLastPage() || this.empty(),
template: template
});
break;
case 'PageLinks':
element = /*#__PURE__*/React__default["default"].createElement(PageLinks, {
key: key,
value: this.updatePageLinks(),
page: this.getPage(),
rows: this.props.rows,
pageCount: this.getPageCount(),
onClick: this.onPageLinkClick,
template: template
});
break;
case 'RowsPerPageDropdown':
element = /*#__PURE__*/React__default["default"].createElement(RowsPerPageDropdown, {
key: key,
value: this.props.rows,
page: this.getPage(),
pageCount: this.getPageCount(),
totalRecords: this.props.totalRecords,
options: this.props.rowsPerPageOptions,
onChange: this.onRowsChange,
appendTo: this.props.dropdownAppendTo,
template: template,
disabled: this.empty()
});
break;
case 'CurrentPageReport':
element = /*#__PURE__*/React__default["default"].createElement(CurrentPageReport, {
reportTemplate: this.props.currentPageReportTemplate,
key: key,
page: this.getPage(),
pageCount: this.getPageCount(),
first: this.props.first,
rows: this.props.rows,
totalRecords: this.props.totalRecords,
template: template
});
break;
case 'JumpToPageInput':
element = /*#__PURE__*/React__default["default"].createElement(JumpToPageInput, {
key: key,
rows: this.props.rows,
page: this.getPage(),
pageCount: this.getPageCount(),
onChange: this.changePage,
disabled: this.empty(),
template: template
});
break;
default:
element = null;
break;
}
return element;
}
}, {
key: "renderElements",
value: function renderElements() {
var _this2 = this;
var template = this.props.template;
if (template) {
if (_typeof(template) === 'object') {
return template.layout ? template.layout.split(' ').map(function (value) {
var key = value.trim();
return _this2.renderElement(key, template[key]);
}) : Object.entries(template).map(function (_ref) {
var _ref2 = _slicedToArray(_ref, 2),
key = _ref2[0],
_template = _ref2[1];
return _this2.renderElement(key, _template);
});
}
return template.split(' ').map(function (value) {
return _this2.renderElement(value.trim());
});
}
return null;
}
}, {
key: "render",
value: function render() {
if (!this.props.alwaysShow && this.getPageCount() === 1) {
return null;
} else {
var className = classNames('p-paginator p-component', this.props.className);
var leftContent = ObjectUtils.getJSXElement(this.props.leftContent, this.props);
var rightContent = ObjectUtils.getJSXElement(this.props.rightContent, this.props);
var elements = this.renderElements();
var leftElement = leftContent && /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-paginator-left-content"
}, leftContent);
var rightElement = rightContent && /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-paginator-right-content"
}, rightContent);
return /*#__PURE__*/React__default["default"].createElement("div", {
className: className,
style: this.props.style
}, leftElement, elements, rightElement);
}
}
}]);
return Paginator;
}(React.Component);
_defineProperty(Paginator, "defaultProps", {
totalRecords: 0,
rows: 0,
first: 0,
pageLinkSize: 5,
rowsPerPageOptions: null,
alwaysShow: true,
style: null,
className: null,
template: 'FirstPageLink PrevPageLink PageLinks NextPageLink LastPageLink RowsPerPageDropdown',
onPageChange: null,
leftContent: null,
rightContent: null,
dropdownAppendTo: null,
currentPageReportTemplate: '({currentPage} of {totalPages})'
});
function _objectWithoutPropertiesLoose(source, excluded) {
if (source == null) return {};
var target = {};
var sourceKeys = Object.keys(source);
var key, i;
for (i = 0; i < sourceKeys.length; i++) {
key = sourceKeys[i];
if (excluded.indexOf(key) >= 0) continue;
target[key] = source[key];
}
return target;
}
function _objectWithoutProperties(source, excluded) {
if (source == null) return {};
var target = _objectWithoutPropertiesLoose(source, excluded);
var key, i;
if (Object.getOwnPropertySymbols) {
var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
for (i = 0; i < sourceSymbolKeys.length; i++) {
key = sourceSymbolKeys[i];
if (excluded.indexOf(key) >= 0) continue;
if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
target[key] = source[key];
}
}
return target;
}
function _createSuper$1C(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1C(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1C() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var RowRadioButton = /*#__PURE__*/function (_Component) {
_inherits(RowRadioButton, _Component);
var _super = _createSuper$1C(RowRadioButton);
function RowRadioButton(props) {
var _this;
_classCallCheck(this, RowRadioButton);
_this = _super.call(this, props);
_this.state = {
focused: false
};
_this.onClick = _this.onClick.bind(_assertThisInitialized(_this));
_this.onFocus = _this.onFocus.bind(_assertThisInitialized(_this));
_this.onBlur = _this.onBlur.bind(_assertThisInitialized(_this));
_this.onChange = _this.onChange.bind(_assertThisInitialized(_this));
_this.onKeyDown = _this.onKeyDown.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(RowRadioButton, [{
key: "onClick",
value: function onClick(event) {
if (!this.props.disabled) {
this.props.onChange(event);
this.input.focus();
}
}
}, {
key: "onFocus",
value: function onFocus() {
this.setState({
focused: true
});
}
}, {
key: "onBlur",
value: function onBlur() {
this.setState({
focused: false
});
}
}, {
key: "onChange",
value: function onChange(event) {
this.onClick(event);
}
}, {
key: "onKeyDown",
value: function onKeyDown(event) {
if (event.code === 'Space') {
this.onClick(event);
event.preventDefault();
}
}
}, {
key: "render",
value: function render() {
var _this2 = this;
var className = classNames('p-radiobutton p-component', {
'p-radiobutton-focused': this.state.focused
});
var boxClassName = classNames('p-radiobutton-box p-component', {
'p-highlight': this.props.checked,
'p-focus': this.state.focused,
'p-disabled': this.props.disabled
});
var name = "".concat(this.props.tableSelector, "_dt_radio");
return /*#__PURE__*/React__default["default"].createElement("div", {
className: className
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-hidden-accessible"
}, /*#__PURE__*/React__default["default"].createElement("input", {
name: name,
ref: function ref(el) {
return _this2.input = el;
},
type: "radio",
checked: this.props.checked,
onFocus: this.onFocus,
onBlur: this.onBlur,
onChange: this.onChange,
onKeyDown: this.onKeyDown
})), /*#__PURE__*/React__default["default"].createElement("div", {
className: boxClassName,
onClick: this.onClick,
role: "radio",
"aria-checked": this.props.checked
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-radiobutton-icon"
})));
}
}]);
return RowRadioButton;
}(React.Component);
function _createSuper$1B(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1B(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1B() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var RowCheckbox = /*#__PURE__*/function (_Component) {
_inherits(RowCheckbox, _Component);
var _super = _createSuper$1B(RowCheckbox);
function RowCheckbox(props) {
var _this;
_classCallCheck(this, RowCheckbox);
_this = _super.call(this, props);
_this.state = {
focused: false
};
_this.onClick = _this.onClick.bind(_assertThisInitialized(_this));
_this.onFocus = _this.onFocus.bind(_assertThisInitialized(_this));
_this.onBlur = _this.onBlur.bind(_assertThisInitialized(_this));
_this.onKeyDown = _this.onKeyDown.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(RowCheckbox, [{
key: "onClick",
value: function onClick(event) {
if (!this.props.disabled) {
this.setState({
focused: true
});
this.props.onChange(event);
}
}
}, {
key: "onFocus",
value: function onFocus() {
this.setState({
focused: true
});
}
}, {
key: "onBlur",
value: function onBlur() {
this.setState({
focused: false
});
}
}, {
key: "onKeyDown",
value: function onKeyDown(event) {
if (event.code === 'Space') {
this.onClick(event);
event.preventDefault();
}
}
}, {
key: "render",
value: function render() {
var className = classNames('p-checkbox p-component', {
'p-checkbox-focused': this.state.focused
});
var boxClassName = classNames('p-checkbox-box p-component', {
'p-highlight': this.props.checked,
'p-disabled': this.props.disabled,
'p-focus': this.state.focused
});
var iconClassName = classNames('p-checkbox-icon', {
'pi pi-check': this.props.checked
});
var tabIndex = this.props.disabled ? null : '0';
return /*#__PURE__*/React__default["default"].createElement("div", {
className: className,
onClick: this.onClick
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: boxClassName,
role: "checkbox",
"aria-checked": this.props.checked,
tabIndex: tabIndex,
onKeyDown: this.onKeyDown,
onFocus: this.onFocus,
onBlur: this.onBlur
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: iconClassName
})));
}
}]);
return RowCheckbox;
}(React.Component);
function ownKeys$z(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$z(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$z(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$z(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createSuper$1A(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1A(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1A() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var BodyCell = /*#__PURE__*/function (_Component) {
_inherits(BodyCell, _Component);
var _super = _createSuper$1A(BodyCell);
function BodyCell(props) {
var _this;
_classCallCheck(this, BodyCell);
_this = _super.call(this, props);
_this.state = {
editing: props.editing,
editingRowData: props.rowData,
styleObject: {}
};
_this.onClick = _this.onClick.bind(_assertThisInitialized(_this));
_this.onMouseDown = _this.onMouseDown.bind(_assertThisInitialized(_this));
_this.onMouseUp = _this.onMouseUp.bind(_assertThisInitialized(_this));
_this.onKeyDown = _this.onKeyDown.bind(_assertThisInitialized(_this));
_this.onBlur = _this.onBlur.bind(_assertThisInitialized(_this));
_this.onEditorFocus = _this.onEditorFocus.bind(_assertThisInitialized(_this));
_this.onRowToggle = _this.onRowToggle.bind(_assertThisInitialized(_this));
_this.onRadioChange = _this.onRadioChange.bind(_assertThisInitialized(_this));
_this.onCheckboxChange = _this.onCheckboxChange.bind(_assertThisInitialized(_this));
_this.onRowEditSave = _this.onRowEditSave.bind(_assertThisInitialized(_this));
_this.onRowEditCancel = _this.onRowEditCancel.bind(_assertThisInitialized(_this));
_this.onRowEditInit = _this.onRowEditInit.bind(_assertThisInitialized(_this));
_this.editorCallback = _this.editorCallback.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(BodyCell, [{
key: "field",
get: function get() {
return this.getColumnProp('field') || "field_".concat(this.props.index);
}
}, {
key: "isEditable",
value: function isEditable() {
return this.getColumnProp('editor');
}
}, {
key: "isSelected",
value: function isSelected() {
return this.props.selection ? this.props.selection instanceof Array ? this.findIndex(this.props.selection) > -1 : this.equals(this.props.selection) : false;
}
}, {
key: "equalsData",
value: function equalsData(data) {
return this.props.compareSelectionBy === 'equals' ? data === this.props.rowData : ObjectUtils.equals(data, this.props.rowData, this.props.dataKey);
}
}, {
key: "equals",
value: function equals(selectedCell) {
return (selectedCell.rowIndex === this.props.rowIndex || this.equalsData(selectedCell.rowData)) && (selectedCell.field === this.field || selectedCell.cellIndex === this.props.index);
}
}, {
key: "isOutsideClicked",
value: function isOutsideClicked(target) {
return this.el && !(this.el.isSameNode(target) || this.el.contains(target));
}
}, {
key: "getColumnProp",
value: function getColumnProp(prop) {
return this.props.column ? this.props.column.props[prop] : null;
}
}, {
key: "getVirtualScrollerOption",
value: function getVirtualScrollerOption(option) {
return this.props.virtualScrollerOptions ? this.props.virtualScrollerOptions[option] : null;
}
}, {
key: "getStyle",
value: function getStyle() {
var bodyStyle = this.getColumnProp('bodyStyle');
var columnStyle = this.getColumnProp('style');
return this.getColumnProp('frozen') ? Object.assign({}, columnStyle, bodyStyle, this.state.styleObject) : Object.assign({}, columnStyle, bodyStyle);
}
}, {
key: "getCellParams",
value: function getCellParams() {
return {
value: this.resolveFieldData(),
field: this.field,
rowData: this.props.rowData,
rowIndex: this.props.rowIndex,
cellIndex: this.props.index,
selected: this.isSelected(),
column: this.props.column,
props: this.props
};
}
}, {
key: "getCellCallbackParams",
value: function getCellCallbackParams(event) {
var params = this.getCellParams();
return _objectSpread$z({
originalEvent: event
}, params);
}
}, {
key: "resolveFieldData",
value: function resolveFieldData(data) {
return ObjectUtils.resolveFieldData(data || this.props.rowData, this.field);
}
}, {
key: "getEditingRowData",
value: function getEditingRowData() {
return this.props.editingMeta && this.props.editingMeta[this.props.rowIndex] ? this.props.editingMeta[this.props.rowIndex].data : this.props.rowData;
}
}, {
key: "getTabIndex",
value: function getTabIndex(cellSelected) {
return this.props.allowCellSelection ? cellSelected ? 0 : this.props.rowIndex === 0 && this.props.index === 0 ? this.props.tabIndex : -1 : null;
}
}, {
key: "findIndex",
value: function findIndex(collection) {
var _this2 = this;
return (collection || []).findIndex(function (data) {
return _this2.equals(data);
});
}
}, {
key: "closeCell",
value: function closeCell(event) {
var _this3 = this;
var params = this.getCellCallbackParams(event);
var onBeforeCellEditHide = this.getColumnProp('onBeforeCellEditHide');
if (onBeforeCellEditHide) {
onBeforeCellEditHide(params);
}
/* When using the 'tab' key, the focus event of the next cell is not called in IE. */
setTimeout(function () {
_this3.setState({
editing: false
}, function () {
_this3.unbindDocumentEditListener();
OverlayService.off('overlay-click', _this3.overlayEventListener);
_this3.overlayEventListener = null;
});
}, 1);
}
}, {
key: "switchCellToViewMode",
value: function switchCellToViewMode(event, submit) {
var callbackParams = this.getCellCallbackParams(event);
var newRowData = this.state.editingRowData;
var newValue = this.resolveFieldData(newRowData);
var params = _objectSpread$z(_objectSpread$z({}, callbackParams), {}, {
newRowData: newRowData,
newValue: newValue
});
var onCellEditCancel = this.getColumnProp('onCellEditCancel');
var cellEditValidator = this.getColumnProp('cellEditValidator');
var onCellEditComplete = this.getColumnProp('onCellEditComplete');
if (!submit && onCellEditCancel) {
onCellEditCancel(params);
}
var valid = true;
if (cellEditValidator) {
valid = cellEditValidator(params);
}
if (valid) {
if (submit && onCellEditComplete) {
onCellEditComplete(params);
}
this.closeCell(event);
} else {
event.preventDefault();
}
}
}, {
key: "findNextSelectableCell",
value: function findNextSelectableCell(cell) {
var nextCell = cell.nextElementSibling;
return nextCell ? DomHandler.hasClass(nextCell, 'p-selectable-cell') ? nextCell : this.findNextSelectableCell(nextCell) : null;
}
}, {
key: "findPrevSelectableCell",
value: function findPrevSelectableCell(cell) {
var prevCell = cell.previousElementSibling;
return prevCell ? DomHandler.hasClass(prevCell, 'p-selectable-cell') ? prevCell : this.findPrevSelectableCell(prevCell) : null;
}
}, {
key: "findDownSelectableCell",
value: function findDownSelectableCell(cell) {
var downRow = cell.parentElement.nextElementSibling;
var downCell = downRow ? downRow.children[this.props.index] : null;
return downRow && downCell ? DomHandler.hasClass(downRow, 'p-selectable-row') && DomHandler.hasClass(downCell, 'p-selectable-cell') ? downCell : this.findDownSelectableCell(downCell) : null;
}
}, {
key: "findUpSelectableCell",
value: function findUpSelectableCell(cell) {
var upRow = cell.parentElement.previousElementSibling;
var upCell = upRow ? upRow.children[this.props.index] : null;
return upRow && upCell ? DomHandler.hasClass(upRow, 'p-selectable-row') && DomHandler.hasClass(upCell, 'p-selectable-cell') ? upCell : this.findUpSelectableCell(upCell) : null;
}
}, {
key: "changeTabIndex",
value: function changeTabIndex(currentCell, nextCell) {
if (currentCell && nextCell) {
currentCell.tabIndex = -1;
nextCell.tabIndex = this.props.tabIndex;
}
}
}, {
key: "focusOnElement",
value: function focusOnElement() {
var _this4 = this;
clearTimeout(this.tabindexTimeout);
this.tabindexTimeout = setTimeout(function () {
if (_this4.state.editing) {
var focusableEl = _this4.props.editMode === 'cell' ? DomHandler.getFirstFocusableElement(_this4.el, ':not(.p-cell-editor-key-helper)') : DomHandler.findSingle(_this4.el, '.p-row-editor-save');
focusableEl && focusableEl.focus();
}
_this4.keyHelper && (_this4.keyHelper.tabIndex = _this4.state.editing ? -1 : 0);
}, 1);
}
}, {
key: "focusOnInit",
value: function focusOnInit() {
var _this5 = this;
clearTimeout(this.initFocusTimeout);
this.initFocusTimeout = setTimeout(function () {
var focusableEl = _this5.props.editMode === 'row' ? DomHandler.findSingle(_this5.el, '.p-row-editor-init') : null;
focusableEl && focusableEl.focus();
}, 1);
}
}, {
key: "updateStickyPosition",
value: function updateStickyPosition() {
if (this.getColumnProp('frozen')) {
var styleObject = _objectSpread$z({}, this.state.styleObject);
var align = this.getColumnProp('alignFrozen');
if (align === 'right') {
var right = 0;
var next = this.el.nextElementSibling;
if (next) {
right = DomHandler.getOuterWidth(next) + parseFloat(next.style.right || 0);
}
styleObject['right'] = right + 'px';
} else {
var left = 0;
var prev = this.el.previousElementSibling;
if (prev) {
left = DomHandler.getOuterWidth(prev) + parseFloat(prev.style.left || 0);
}
styleObject['left'] = left + 'px';
}
var isSameStyle = this.state.styleObject['left'] === styleObject['left'] && this.state.styleObject['right'] === styleObject['right'];
!isSameStyle && this.setState({
styleObject: styleObject
});
}
}
}, {
key: "editorCallback",
value: function editorCallback(val) {
var editingRowData = _objectSpread$z({}, this.state.editingRowData);
editingRowData[this.field] = val;
this.setState({
editingRowData: editingRowData
}); // update editing meta for complete methods on row mode
this.props.editingMeta[this.props.rowIndex].data[this.field] = val;
}
}, {
key: "onClick",
value: function onClick(event) {
var _this6 = this;
var params = this.getCellCallbackParams(event);
if (this.props.editMode !== 'row' && this.isEditable() && !this.state.editing && (this.props.selectOnEdit || !this.props.selectOnEdit && this.props.selected)) {
this.selfClick = true;
var onBeforeCellEditShow = this.getColumnProp('onBeforeCellEditShow');
var onCellEditInit = this.getColumnProp('onCellEditInit');
var cellEditValidatorEvent = this.getColumnProp('cellEditValidatorEvent');
if (onBeforeCellEditShow) {
onBeforeCellEditShow(params);
} // If the data is sorted using sort icon, it has been added to wait for the sort operation when any cell is wanted to be opened.
setTimeout(function () {
_this6.setState({
editing: true
}, function () {
if (onCellEditInit) {
onCellEditInit(params);
}
if (cellEditValidatorEvent === 'click') {
_this6.bindDocumentEditListener();
_this6.overlayEventListener = function (e) {
if (!_this6.isOutsideClicked(e.target)) {
_this6.selfClick = true;
}
};
OverlayService.on('overlay-click', _this6.overlayEventListener);
}
});
}, 1);
}
if (this.props.allowCellSelection && this.props.onClick) {
this.props.onClick(params);
}
}
}, {
key: "onMouseDown",
value: function onMouseDown(event) {
var params = this.getCellCallbackParams(event);
if (this.props.onMouseDown) {
this.props.onMouseDown(params);
}
}
}, {
key: "onMouseUp",
value: function onMouseUp(event) {
var params = this.getCellCallbackParams(event);
if (this.props.onMouseUp) {
this.props.onMouseUp(params);
}
}
}, {
key: "onKeyDown",
value: function onKeyDown(event) {
if (this.props.editMode !== 'row') {
if (event.which === 13 || event.which === 9) {
// tab || enter
this.switchCellToViewMode(event, true);
}
if (event.which === 27) {
// escape
this.switchCellToViewMode(event, false);
}
}
if (this.props.allowCellSelection) {
var target = event.target,
cell = event.currentTarget;
switch (event.which) {
//left arrow
case 37:
var prevCell = this.findPrevSelectableCell(cell);
if (prevCell) {
this.changeTabIndex(cell, prevCell);
prevCell.focus();
}
event.preventDefault();
break;
//right arrow
case 39:
var nextCell = this.findNextSelectableCell(cell);
if (nextCell) {
this.changeTabIndex(cell, nextCell);
nextCell.focus();
}
event.preventDefault();
break;
//up arrow
case 38:
var upCell = this.findUpSelectableCell(cell);
if (upCell) {
this.changeTabIndex(cell, upCell);
upCell.focus();
}
event.preventDefault();
break;
//down arrow
case 40:
var downCell = this.findDownSelectableCell(cell);
if (downCell) {
this.changeTabIndex(cell, downCell);
downCell.focus();
}
event.preventDefault();
break;
//enter
case 13:
// @deprecated
if (!DomHandler.isClickable(target)) {
this.onClick(event);
event.preventDefault();
}
break;
//space
case 32:
if (!DomHandler.isClickable(target) && !target.readOnly) {
this.onClick(event);
event.preventDefault();
}
break;
}
}
}
}, {
key: "onBlur",
value: function onBlur(event) {
this.selfClick = false;
if (this.props.editMode !== 'row' && this.state.editing && this.getColumnProp('cellEditValidatorEvent') === 'blur') {
this.switchCellToViewMode(event, true);
}
}
}, {
key: "onEditorFocus",
value: function onEditorFocus(event) {
this.onClick(event);
}
}, {
key: "onRadioChange",
value: function onRadioChange(event) {
this.props.onRadioChange({
originalEvent: event,
data: this.props.rowData,
index: this.props.rowIndex
});
}
}, {
key: "onCheckboxChange",
value: function onCheckboxChange(event) {
this.props.onCheckboxChange({
originalEvent: event,
data: this.props.rowData,
index: this.props.rowIndex
});
}
}, {
key: "onRowToggle",
value: function onRowToggle(event) {
this.props.onRowToggle({
originalEvent: event,
data: this.props.rowData
});
event.preventDefault();
}
}, {
key: "onRowEditInit",
value: function onRowEditInit(event) {
this.props.onRowEditInit({
originalEvent: event,
data: this.props.rowData,
newData: this.getEditingRowData(),
field: this.field,
index: this.props.rowIndex
});
}
}, {
key: "onRowEditSave",
value: function onRowEditSave(event) {
this.props.onRowEditSave({
originalEvent: event,
data: this.props.rowData,
newData: this.getEditingRowData(),
field: this.field,
index: this.props.rowIndex
});
this.focusOnInit();
}
}, {
key: "onRowEditCancel",
value: function onRowEditCancel(event) {
this.props.onRowEditCancel({
originalEvent: event,
data: this.props.rowData,
newData: this.getEditingRowData(),
field: this.field,
index: this.props.rowIndex
});
this.focusOnInit();
}
}, {
key: "bindDocumentEditListener",
value: function bindDocumentEditListener() {
var _this7 = this;
if (!this.documentEditListener) {
this.documentEditListener = function (e) {
if (!_this7.selfClick && _this7.isOutsideClicked(e.target)) {
_this7.switchCellToViewMode(e, true);
}
_this7.selfClick = false;
};
document.addEventListener('click', this.documentEditListener, true);
}
}
}, {
key: "unbindDocumentEditListener",
value: function unbindDocumentEditListener() {
if (this.documentEditListener) {
document.removeEventListener('click', this.documentEditListener, true);
this.documentEditListener = null;
this.selfClick = false;
}
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
if (this.getColumnProp('frozen')) {
this.updateStickyPosition();
}
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps, prevState) {
if (this.getColumnProp('frozen')) {
this.updateStickyPosition();
}
if (this.props.editMode === 'cell' || this.props.editMode === 'row') {
this.focusOnElement();
if (prevProps.editingMeta !== this.props.editingMeta) {
this.setState({
editingRowData: this.getEditingRowData()
});
}
if (prevState.editing !== this.state.editing) {
var callbackParams = this.getCellCallbackParams();
var params = _objectSpread$z(_objectSpread$z({}, callbackParams), {}, {
editing: this.state.editing
});
this.props.onEditingMetaChange(params);
}
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
this.unbindDocumentEditListener();
if (this.overlayEventListener) {
OverlayService.off('overlay-click', this.overlayEventListener);
this.overlayEventListener = null;
}
}
}, {
key: "renderLoading",
value: function renderLoading() {
var options = this.getVirtualScrollerOption('getLoaderOptions')(this.props.rowIndex, {
cellIndex: this.props.index,
cellFirst: this.props.index === 0,
cellLast: this.props.index === this.getVirtualScrollerOption('columns').length - 1,
cellEven: this.props.index % 2 === 0,
cellOdd: this.props.index % 2 !== 0,
column: this.props.column,
field: this.field
});
var content = ObjectUtils.getJSXElement(this.getVirtualScrollerOption('loadingTemplate'), options);
return /*#__PURE__*/React__default["default"].createElement("td", null, content);
}
}, {
key: "renderElement",
value: function renderElement() {
var _this8 = this;
var content, editorKeyHelper;
var cellSelected = this.props.allowCellSelection && this.isSelected();
var isRowEditor = this.props.editMode === 'row';
var tabIndex = this.getTabIndex(cellSelected);
var selectionMode = this.getColumnProp('selectionMode');
var rowReorder = this.getColumnProp('rowReorder');
var expander = this.getColumnProp('expander');
var rowEditor = this.getColumnProp('rowEditor');
var header = this.getColumnProp('header');
var body = this.getColumnProp('body');
var editor = this.getColumnProp('editor');
var frozen = this.getColumnProp('frozen');
var align = this.getColumnProp('align');
var value = this.resolveFieldData();
var cellClassName = ObjectUtils.getPropValue(this.props.cellClassName, value, {
props: this.props.tableProps,
rowData: this.props.rowData,
column: this.props.column
});
var className = classNames(this.getColumnProp('bodyClassName'), this.getColumnProp('className'), cellClassName, _defineProperty({
'p-selection-column': selectionMode !== null,
'p-editable-column': editor,
'p-cell-editing': editor && this.state.editing,
'p-frozen-column': frozen,
'p-selectable-cell': this.props.allowCellSelection && this.props.isSelectable({
data: this.getCellParams(),
index: this.props.rowIndex
}),
'p-highlight': cellSelected
}, "p-align-".concat(align), !!align));
var style = this.getStyle();
var title = this.props.responsiveLayout === 'stack' && /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-column-title"
}, ObjectUtils.getJSXElement(header, {
props: this.props.tableProps
}));
if (selectionMode) {
var showSelection = this.props.showSelectionElement ? this.props.showSelectionElement(this.props.rowData, {
rowIndex: this.props.rowIndex,
props: this.props.tableProps
}) : true;
content = showSelection && /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, selectionMode === 'single' && /*#__PURE__*/React__default["default"].createElement(RowRadioButton, {
checked: this.props.selected,
onChange: this.onRadioChange,
tabIndex: this.props.tabIndex,
tableSelector: this.props.tableSelector
}), selectionMode === 'multiple' && /*#__PURE__*/React__default["default"].createElement(RowCheckbox, {
checked: this.props.selected,
onChange: this.onCheckboxChange,
tabIndex: this.props.tabIndex
}));
} else if (rowReorder) {
var showReorder = this.props.showRowReorderElement ? this.props.showRowReorderElement(this.props.rowData, {
rowIndex: this.props.rowIndex,
props: this.props.tableProps
}) : true;
content = showReorder && /*#__PURE__*/React__default["default"].createElement("i", {
className: classNames('p-datatable-reorderablerow-handle', this.getColumnProp('rowReorderIcon'))
});
} else if (expander) {
var iconClassName = classNames('p-row-toggler-icon', this.props.expanded ? this.props.expandedRowIcon : this.props.collapsedRowIcon);
var ariaControls = "".concat(this.props.tableSelector, "_content_").concat(this.props.rowIndex, "_expanded");
var expanderProps = {
onClick: this.onRowToggle,
className: 'p-row-toggler p-link',
iconClassName: iconClassName
};
content = /*#__PURE__*/React__default["default"].createElement("button", {
className: expanderProps.className,
onClick: expanderProps.onClick,
type: "button",
"aria-expanded": this.props.expanded,
"aria-controls": ariaControls,
tabIndex: this.props.tabIndex
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: expanderProps.iconClassName
}), /*#__PURE__*/React__default["default"].createElement(Ripple, null));
if (body) {
expanderProps['element'] = content;
content = ObjectUtils.getJSXElement(body, this.props.rowData, {
column: this.props.column,
field: this.field,
rowIndex: this.props.rowIndex,
frozenRow: this.props.frozenRow,
props: this.props.tableProps,
expander: expanderProps
});
}
} else if (isRowEditor && rowEditor) {
var rowEditorProps = {};
if (this.state.editing) {
rowEditorProps = {
editing: true,
onSaveClick: this.onRowEditSave,
saveClassName: 'p-row-editor-save p-link',
saveIconClassName: 'p-row-editor-save-icon pi pi-fw pi-check',
onCancelClick: this.onRowEditCancel,
cancelClassName: 'p-row-editor-cancel p-link',
cancelIconClassName: 'p-row-editor-cancel-icon pi pi-fw pi-times'
};
content = /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("button", {
type: "button",
onClick: rowEditorProps.onSaveClick,
className: rowEditorProps.saveClassName,
tabIndex: this.props.tabIndex
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: rowEditorProps.saveIconClassName
}), /*#__PURE__*/React__default["default"].createElement(Ripple, null)), /*#__PURE__*/React__default["default"].createElement("button", {
type: "button",
onClick: rowEditorProps.onCancelClick,
className: rowEditorProps.cancelClassName,
tabIndex: this.props.tabIndex
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: rowEditorProps.cancelIconClassName
}), /*#__PURE__*/React__default["default"].createElement(Ripple, null)));
} else {
rowEditorProps = {
editing: false,
onInitClick: this.onRowEditInit,
initClassName: 'p-row-editor-init p-link',
initIconClassName: 'p-row-editor-init-icon pi pi-fw pi-pencil'
};
content = /*#__PURE__*/React__default["default"].createElement("button", {
type: "button",
onClick: rowEditorProps.onInitClick,
className: rowEditorProps.initClassName,
tabIndex: this.props.tabIndex
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: rowEditorProps.initIconClassName
}), /*#__PURE__*/React__default["default"].createElement(Ripple, null));
}
if (body) {
rowEditorProps['element'] = content;
content = ObjectUtils.getJSXElement(body, this.props.rowData, {
column: this.props.column,
field: this.field,
rowIndex: this.props.rowIndex,
frozenRow: this.props.frozenRow,
props: this.props.tableProps,
rowEditor: rowEditorProps
});
}
} else if (body && !this.state.editing) {
content = body ? ObjectUtils.getJSXElement(body, this.props.rowData, {
column: this.props.column,
field: this.field,
rowIndex: this.props.rowIndex,
frozenRow: this.props.frozenRow,
props: this.props.tableProps
}) : value;
} else if (editor && this.state.editing) {
content = ObjectUtils.getJSXElement(editor, {
rowData: this.state.editingRowData,
value: this.resolveFieldData(this.state.editingRowData),
column: this.props.column,
field: this.field,
rowIndex: this.props.rowIndex,
frozenRow: this.props.frozenRow,
props: this.props.tableProps,
editorCallback: this.editorCallback
});
} else {
content = value;
}
if (!isRowEditor && editor) {
/* eslint-disable */
editorKeyHelper = /*#__PURE__*/React__default["default"].createElement("a", {
tabIndex: "0",
ref: function ref(el) {
return _this8.keyHelper = el;
},
className: "p-cell-editor-key-helper p-hidden-accessible",
onFocus: this.onEditorFocus
}, /*#__PURE__*/React__default["default"].createElement("span", null));
/* eslint-enable */
}
return /*#__PURE__*/React__default["default"].createElement("td", {
ref: function ref(el) {
return _this8.el = el;
},
style: style,
className: className,
rowSpan: this.props.rowSpan,
tabIndex: tabIndex,
role: "cell",
onClick: this.onClick,
onKeyDown: this.onKeyDown,
onBlur: this.onBlur,
onMouseDown: this.onMouseDown,
onMouseUp: this.onMouseUp
}, editorKeyHelper, title, content);
}
}, {
key: "render",
value: function render() {
return this.getVirtualScrollerOption('loading') ? this.renderLoading() : this.renderElement();
}
}], [{
key: "getDerivedStateFromProps",
value: function getDerivedStateFromProps(nextProps, prevState) {
if (nextProps.editMode === 'row' && nextProps.editing !== prevState.editing) {
return {
editing: nextProps.editing
};
}
return null;
}
}]);
return BodyCell;
}(React.Component);
function ownKeys$y(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$y(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$y(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$y(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createSuper$1z(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1z(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1z() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var BodyRow = /*#__PURE__*/function (_Component) {
_inherits(BodyRow, _Component);
var _super = _createSuper$1z(BodyRow);
function BodyRow(props) {
var _this;
_classCallCheck(this, BodyRow);
_this = _super.call(this, props);
if (!_this.props.onRowEditChange) {
_this.state = {
editing: false
};
}
_this.onClick = _this.onClick.bind(_assertThisInitialized(_this));
_this.onDoubleClick = _this.onDoubleClick.bind(_assertThisInitialized(_this));
_this.onRightClick = _this.onRightClick.bind(_assertThisInitialized(_this));
_this.onTouchEnd = _this.onTouchEnd.bind(_assertThisInitialized(_this));
_this.onKeyDown = _this.onKeyDown.bind(_assertThisInitialized(_this));
_this.onMouseDown = _this.onMouseDown.bind(_assertThisInitialized(_this));
_this.onMouseUp = _this.onMouseUp.bind(_assertThisInitialized(_this));
_this.onDragStart = _this.onDragStart.bind(_assertThisInitialized(_this));
_this.onDragEnd = _this.onDragEnd.bind(_assertThisInitialized(_this));
_this.onDragOver = _this.onDragOver.bind(_assertThisInitialized(_this));
_this.onDragLeave = _this.onDragLeave.bind(_assertThisInitialized(_this));
_this.onDrop = _this.onDrop.bind(_assertThisInitialized(_this));
_this.onEditInit = _this.onEditInit.bind(_assertThisInitialized(_this));
_this.onEditSave = _this.onEditSave.bind(_assertThisInitialized(_this));
_this.onEditCancel = _this.onEditCancel.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(BodyRow, [{
key: "isFocusable",
value: function isFocusable() {
return this.props.selectionMode && this.props.selectionModeInColumn !== 'single' && this.props.selectionModeInColumn !== 'multiple';
}
}, {
key: "isGrouped",
value: function isGrouped(column) {
if (this.props.groupRowsBy && this.getColumnProp(column, 'field')) {
if (Array.isArray(this.props.groupRowsBy)) return this.props.groupRowsBy.indexOf(column.props.field) > -1;else return this.props.groupRowsBy === column.props.field;
}
return false;
}
}, {
key: "equals",
value: function equals(data1, data2) {
return this.props.compareSelectionBy === 'equals' ? data1 === data2 : ObjectUtils.equals(data1, data2, this.props.dataKey);
}
}, {
key: "getColumnProp",
value: function getColumnProp(col, prop) {
return col ? col.props[prop] : null;
}
}, {
key: "getEditing",
value: function getEditing() {
return this.props.onRowEditChange ? this.props.editing : this.state.editing;
}
}, {
key: "getTabIndex",
value: function getTabIndex() {
return this.isFocusable() && !this.props.allowCellSelection ? this.props.index === 0 ? this.props.tabIndex : -1 : null;
}
}, {
key: "findIndex",
value: function findIndex(collection, rowData) {
var _this2 = this;
return (collection || []).findIndex(function (data) {
return _this2.equals(rowData, data);
});
}
}, {
key: "changeTabIndex",
value: function changeTabIndex(currentRow, nextRow) {
if (currentRow && nextRow) {
currentRow.tabIndex = -1;
nextRow.tabIndex = this.props.tabIndex;
}
}
}, {
key: "findNextSelectableRow",
value: function findNextSelectableRow(row) {
var nextRow = row.nextElementSibling;
return nextRow ? DomHandler.hasClass(nextRow, 'p-selectable-row') ? nextRow : this.findNextSelectableRow(nextRow) : null;
}
}, {
key: "findPrevSelectableRow",
value: function findPrevSelectableRow(row) {
var prevRow = row.previousElementSibling;
return prevRow ? DomHandler.hasClass(prevRow, 'p-selectable-row') ? prevRow : this.findPrevSelectableRow(prevRow) : null;
}
}, {
key: "shouldRenderBodyCell",
value: function shouldRenderBodyCell(value, column, i) {
if (this.getColumnProp(column, 'hidden')) {
return false;
} else if (this.props.rowGroupMode && this.props.rowGroupMode === 'rowspan' && this.isGrouped(column)) {
var prevRowData = value[i - 1];
if (prevRowData) {
var currentRowFieldData = ObjectUtils.resolveFieldData(value[i], this.getColumnProp(column, 'field'));
var previousRowFieldData = ObjectUtils.resolveFieldData(prevRowData, this.getColumnProp(column, 'field'));
return currentRowFieldData !== previousRowFieldData;
}
}
return true;
}
}, {
key: "calculateRowGroupSize",
value: function calculateRowGroupSize(value, column, index) {
if (this.isGrouped(column)) {
var currentRowFieldData = ObjectUtils.resolveFieldData(value[index], this.getColumnProp(column, 'field'));
var nextRowFieldData = currentRowFieldData;
var groupRowSpan = 0;
while (currentRowFieldData === nextRowFieldData) {
groupRowSpan++;
var nextRowData = value[++index];
if (nextRowData) {
nextRowFieldData = ObjectUtils.resolveFieldData(nextRowData, this.getColumnProp(column, 'field'));
} else {
break;
}
}
return groupRowSpan === 1 ? null : groupRowSpan;
} else {
return null;
}
}
}, {
key: "onClick",
value: function onClick(event) {
this.props.onRowClick({
originalEvent: event,
data: this.props.rowData,
index: this.props.index
});
}
}, {
key: "onDoubleClick",
value: function onDoubleClick(event) {
this.props.onRowDoubleClick({
originalEvent: event,
data: this.props.rowData,
index: this.props.index
});
}
}, {
key: "onRightClick",
value: function onRightClick(event) {
this.props.onRowRightClick({
originalEvent: event,
data: this.props.rowData,
index: this.props.index
});
}
}, {
key: "onTouchEnd",
value: function onTouchEnd(event) {
this.props.onRowTouchEnd(event);
}
}, {
key: "onKeyDown",
value: function onKeyDown(event) {
if (this.isFocusable() && !this.props.allowCellSelection) {
var target = event.target,
row = event.currentTarget;
switch (event.which) {
//down arrow
case 40:
var nextRow = this.findNextSelectableRow(row);
if (nextRow) {
this.changeTabIndex(row, nextRow);
nextRow.focus();
}
event.preventDefault();
break;
//up arrow
case 38:
var prevRow = this.findPrevSelectableRow(row);
if (prevRow) {
this.changeTabIndex(row, prevRow);
prevRow.focus();
}
event.preventDefault();
break;
//enter
case 13:
// @deprecated
if (!DomHandler.isClickable(target)) {
this.onClick(event);
event.preventDefault();
}
break;
//space
case 32:
if (!DomHandler.isClickable(target) && !target.readOnly) {
this.onClick(event);
event.preventDefault();
}
break;
}
}
}
}, {
key: "onMouseDown",
value: function onMouseDown(event) {
this.props.onRowMouseDown({
originalEvent: event,
data: this.props.rowData,
index: this.props.index
});
}
}, {
key: "onMouseUp",
value: function onMouseUp(event) {
this.props.onRowMouseUp({
originalEvent: event,
data: this.props.rowData,
index: this.props.index
});
}
}, {
key: "onDragStart",
value: function onDragStart(event) {
this.props.onRowDragStart({
originalEvent: event,
data: this.props.rowData,
index: this.props.index
});
}
}, {
key: "onDragOver",
value: function onDragOver(event) {
this.props.onRowDragOver({
originalEvent: event,
data: this.props.rowData,
index: this.props.index
});
}
}, {
key: "onDragLeave",
value: function onDragLeave(event) {
this.props.onRowDragLeave({
originalEvent: event,
data: this.props.rowData,
index: this.props.index
});
}
}, {
key: "onDragEnd",
value: function onDragEnd(event) {
this.props.onRowDragEnd({
originalEvent: event,
data: this.props.rowData,
index: this.props.index
});
}
}, {
key: "onDrop",
value: function onDrop(event) {
this.props.onRowDrop({
originalEvent: event,
data: this.props.rowData,
index: this.props.index
});
}
}, {
key: "onEditChange",
value: function onEditChange(e, editing) {
if (this.props.onRowEditChange) {
var editingRows;
var dataKey = this.props.dataKey;
var originalEvent = e.originalEvent,
data = e.data,
index = e.index;
if (dataKey) {
var dataKeyValue = String(ObjectUtils.resolveFieldData(data, dataKey));
editingRows = this.props.editingRows ? _objectSpread$y({}, this.props.editingRows) : {};
if (editingRows[dataKeyValue] != null) delete editingRows[dataKeyValue];else editingRows[dataKeyValue] = true;
} else {
var editingRowIndex = this.findIndex(this.props.editingRows, data);
editingRows = this.props.editingRows ? _toConsumableArray(this.props.editingRows) : [];
if (editingRowIndex !== -1) editingRows = editingRows.filter(function (val, i) {
return i !== editingRowIndex;
});else editingRows.push(data);
}
this.props.onRowEditChange({
originalEvent: originalEvent,
data: editingRows,
index: index
});
} else {
this.setState({
editing: editing
});
}
}
}, {
key: "onEditInit",
value: function onEditInit(e) {
var event = e.originalEvent;
if (this.props.onRowEditInit) {
this.props.onRowEditInit({
originalEvent: event,
data: this.props.rowData,
index: this.props.index
});
}
this.onEditChange(e, true);
event.preventDefault();
}
}, {
key: "onEditSave",
value: function onEditSave(e) {
var event = e.originalEvent;
var valid = this.props.rowEditValidator ? this.props.rowEditValidator(this.props.rowData, {
props: this.props.tableProps
}) : true;
if (this.props.onRowEditSave) {
this.props.onRowEditSave({
originalEvent: event,
data: this.props.rowData,
index: this.props.index,
valid: valid
});
}
if (valid) {
if (this.props.onRowEditComplete) {
this.props.onRowEditComplete(e);
}
this.onEditChange(e, false);
}
event.preventDefault();
}
}, {
key: "onEditCancel",
value: function onEditCancel(e) {
var event = e.originalEvent;
if (this.props.onRowEditCancel) {
this.props.onRowEditCancel({
originalEvent: event,
data: this.props.rowData,
index: this.props.index
});
}
this.onEditChange(e, false);
event.preventDefault();
}
}, {
key: "renderContent",
value: function renderContent() {
var _this3 = this;
return this.props.columns.map(function (col, i) {
if (_this3.shouldRenderBodyCell(_this3.props.value, col, _this3.props.index)) {
var key = "".concat(_this3.getColumnProp(col, 'columnKey') || _this3.getColumnProp(col, 'field'), "_").concat(i);
var rowSpan = _this3.props.rowGroupMode === 'rowspan' ? _this3.calculateRowGroupSize(_this3.props.value, col, _this3.props.index) : null;
var editing = _this3.getEditing();
return /*#__PURE__*/React__default["default"].createElement(BodyCell, {
key: key,
value: _this3.props.value,
tableProps: _this3.props.tableProps,
tableSelector: _this3.props.tableSelector,
column: col,
rowData: _this3.props.rowData,
rowIndex: _this3.props.index,
index: i,
rowSpan: rowSpan,
dataKey: _this3.props.dataKey,
editing: editing,
editingMeta: _this3.props.editingMeta,
editMode: _this3.props.editMode,
onRowEditInit: _this3.onEditInit,
onRowEditSave: _this3.onEditSave,
onRowEditCancel: _this3.onEditCancel,
onEditingMetaChange: _this3.props.onEditingMetaChange,
onRowToggle: _this3.props.onRowToggle,
selection: _this3.props.selection,
allowCellSelection: _this3.props.allowCellSelection,
compareSelectionBy: _this3.props.compareSelectionBy,
selectOnEdit: _this3.props.selectOnEdit,
selected: _this3.props.selected,
onClick: _this3.props.onCellClick,
onMouseDown: _this3.props.onCellMouseDown,
onMouseUp: _this3.props.onCellMouseUp,
tabIndex: _this3.props.tabIndex,
cellClassName: _this3.props.cellClassName,
responsiveLayout: _this3.props.responsiveLayout,
frozenRow: _this3.props.frozenRow,
isSelectable: _this3.props.isSelectable,
showSelectionElement: _this3.props.showSelectionElement,
showRowReorderElement: _this3.props.showRowReorderElement,
onRadioChange: _this3.props.onRadioChange,
onCheckboxChange: _this3.props.onCheckboxChange,
expanded: _this3.props.expanded,
expandedRowIcon: _this3.props.expandedRowIcon,
collapsedRowIcon: _this3.props.collapsedRowIcon,
virtualScrollerOptions: _this3.props.virtualScrollerOptions
});
}
return null;
});
}
}, {
key: "render",
value: function render() {
var _this4 = this;
var rowClassName = ObjectUtils.getPropValue(this.props.rowClassName, this.props.rowData, {
props: this.props.tableProps
});
var className = classNames(rowClassName, {
'p-highlight': !this.props.allowCellSelection && this.props.selected,
'p-highlight-contextmenu': this.props.contextMenuSelected,
'p-selectable-row': this.props.allowRowSelection && this.props.isSelectable({
data: this.props.rowData,
index: this.props.index
}),
'p-row-odd': this.props.index % 2 !== 0
});
var content = this.renderContent();
var tabIndex = this.getTabIndex();
return /*#__PURE__*/React__default["default"].createElement("tr", {
ref: function ref(el) {
return _this4.el = el;
},
role: "row",
tabIndex: tabIndex,
className: className,
onMouseDown: this.onMouseDown,
onMouseUp: this.onMouseUp,
onClick: this.onClick,
onDoubleClick: this.onDoubleClick,
onContextMenu: this.onRightClick,
onTouchEnd: this.onTouchEnd,
onKeyDown: this.onKeyDown,
onDragStart: this.onDragStart,
onDragOver: this.onDragOver,
onDragLeave: this.onDragLeave,
onDragEnd: this.onDragEnd,
onDrop: this.onDrop
}, content);
}
}]);
return BodyRow;
}(React.Component);
function _createSuper$1y(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1y(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1y() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var RowTogglerButton = /*#__PURE__*/function (_Component) {
_inherits(RowTogglerButton, _Component);
var _super = _createSuper$1y(RowTogglerButton);
function RowTogglerButton(props) {
var _this;
_classCallCheck(this, RowTogglerButton);
_this = _super.call(this, props);
_this.onClick = _this.onClick.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(RowTogglerButton, [{
key: "onClick",
value: function onClick(event) {
this.props.onClick({
originalEvent: event,
data: this.props.rowData
});
}
}, {
key: "render",
value: function render() {
var iconClassName = classNames('p-row-toggler-icon', this.props.expanded ? this.props.expandedRowIcon : this.props.collapsedRowIcon);
return /*#__PURE__*/React__default["default"].createElement("button", {
type: "button",
onClick: this.onClick,
className: "p-row-toggler p-link",
tabIndex: this.props.tabIndex
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: iconClassName
}), /*#__PURE__*/React__default["default"].createElement(Ripple, null));
}
}]);
return RowTogglerButton;
}(React.Component);
var _excluded = ["originalEvent"];
function ownKeys$x(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$x(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$x(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$x(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createSuper$1x(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1x(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1x() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var TableBody = /*#__PURE__*/function (_Component) {
_inherits(TableBody, _Component);
var _super = _createSuper$1x(TableBody);
function TableBody(props) {
var _this;
_classCallCheck(this, TableBody);
_this = _super.call(this, props);
_this.state = {
rowGroupHeaderStyleObject: {}
}; // row
_this.onRowClick = _this.onRowClick.bind(_assertThisInitialized(_this));
_this.onRowDoubleClick = _this.onRowDoubleClick.bind(_assertThisInitialized(_this));
_this.onRowRightClick = _this.onRowRightClick.bind(_assertThisInitialized(_this));
_this.onRowTouchEnd = _this.onRowTouchEnd.bind(_assertThisInitialized(_this));
_this.onRowMouseDown = _this.onRowMouseDown.bind(_assertThisInitialized(_this));
_this.onRowMouseUp = _this.onRowMouseUp.bind(_assertThisInitialized(_this));
_this.onRowToggle = _this.onRowToggle.bind(_assertThisInitialized(_this)); // drag
_this.onRowDragStart = _this.onRowDragStart.bind(_assertThisInitialized(_this));
_this.onRowDragOver = _this.onRowDragOver.bind(_assertThisInitialized(_this));
_this.onRowDragLeave = _this.onRowDragLeave.bind(_assertThisInitialized(_this));
_this.onRowDragEnd = _this.onRowDragEnd.bind(_assertThisInitialized(_this));
_this.onRowDrop = _this.onRowDrop.bind(_assertThisInitialized(_this)); // selection
_this.onRadioChange = _this.onRadioChange.bind(_assertThisInitialized(_this));
_this.onCheckboxChange = _this.onCheckboxChange.bind(_assertThisInitialized(_this));
_this.onDragSelectionMouseMove = _this.onDragSelectionMouseMove.bind(_assertThisInitialized(_this));
_this.onDragSelectionMouseUp = _this.onDragSelectionMouseUp.bind(_assertThisInitialized(_this));
_this.isSelectable = _this.isSelectable.bind(_assertThisInitialized(_this)); // cell
_this.onCellClick = _this.onCellClick.bind(_assertThisInitialized(_this));
_this.onCellMouseDown = _this.onCellMouseDown.bind(_assertThisInitialized(_this));
_this.onCellMouseUp = _this.onCellMouseUp.bind(_assertThisInitialized(_this));
_this.ref = _this.ref.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(TableBody, [{
key: "ref",
value: function ref(el) {
this.el = el;
this.props.virtualScrollerContentRef && this.props.virtualScrollerContentRef(el);
}
}, {
key: "equals",
value: function equals(data1, data2) {
if (this.allowCellSelection()) return (data1.rowIndex === data2.rowIndex || data1.rowData === data2.rowData) && (data1.field === data2.field || data1.cellIndex === data2.cellIndex);else return this.props.compareSelectionBy === 'equals' ? data1 === data2 : ObjectUtils.equals(data1, data2, this.props.dataKey);
}
}, {
key: "isSubheaderGrouping",
value: function isSubheaderGrouping() {
return this.props.rowGroupMode && this.props.rowGroupMode === 'subheader';
}
}, {
key: "isSelectionEnabled",
value: function isSelectionEnabled() {
return this.props.selectionMode || this.props.selectionModeInColumn !== null || this.props.columns && this.props.columns.some(function (col) {
return col && !!col.props.selectionMode;
});
}
}, {
key: "isRadioSelectionMode",
value: function isRadioSelectionMode() {
return this.props.selectionMode === 'radiobutton';
}
}, {
key: "isCheckboxSelectionMode",
value: function isCheckboxSelectionMode() {
return this.props.selectionMode === 'checkbox';
}
}, {
key: "isRadioSelectionModeInColumn",
value: function isRadioSelectionModeInColumn() {
return this.props.selectionModeInColumn === 'single';
}
}, {
key: "isCheckboxSelectionModeInColumn",
value: function isCheckboxSelectionModeInColumn() {
return this.props.selectionModeInColumn === 'multiple';
}
}, {
key: "isSingleSelection",
value: function isSingleSelection() {
return this.props.selectionMode === 'single' && !this.isCheckboxSelectionModeInColumn() || !this.isRadioSelectionMode() && this.isRadioSelectionModeInColumn();
}
}, {
key: "isMultipleSelection",
value: function isMultipleSelection() {
return this.props.selectionMode === 'multiple' && !this.isRadioSelectionModeInColumn() || this.isCheckboxSelectionModeInColumn();
}
}, {
key: "isRadioOnlySelection",
value: function isRadioOnlySelection() {
return this.isRadioSelectionMode() && this.isRadioSelectionModeInColumn();
}
}, {
key: "isCheckboxOnlySelection",
value: function isCheckboxOnlySelection() {
return this.isCheckboxSelectionMode() && this.isCheckboxSelectionModeInColumn();
}
}, {
key: "isSelected",
value: function isSelected(rowData) {
if (rowData && this.props.selection) {
return this.props.selection instanceof Array ? this.findIndex(this.props.selection, rowData) > -1 : this.equals(rowData, this.props.selection);
}
return false;
}
}, {
key: "isContextMenuSelected",
value: function isContextMenuSelected(rowData) {
if (rowData && this.props.contextMenuSelection) {
return this.equals(rowData, this.props.contextMenuSelection);
}
return false;
}
}, {
key: "isSelectable",
value: function isSelectable(options) {
return this.props.isDataSelectable ? this.props.isDataSelectable(options) : true;
}
}, {
key: "isRowExpanded",
value: function isRowExpanded(rowData) {
if (rowData && this.props.expandedRows) {
if (this.isSubheaderGrouping() && this.props.expandableRowGroups) {
return this.isRowGroupExpanded(rowData);
} else {
if (this.props.dataKey) return this.props.expandedRows ? this.props.expandedRows[ObjectUtils.resolveFieldData(rowData, this.props.dataKey)] !== undefined : false;else return this.findIndex(this.props.expandedRows, rowData) !== -1;
}
}
return false;
}
}, {
key: "isRowGroupExpanded",
value: function isRowGroupExpanded(rowData) {
var _this2 = this;
if (this.props.dataKey === this.props.groupRowsBy) return Object.keys(this.props.expandedRows).some(function (data) {
return ObjectUtils.equals(data, ObjectUtils.resolveFieldData(rowData, _this2.props.dataKey));
});else return this.props.expandedRows.some(function (data) {
return ObjectUtils.equals(data, rowData, _this2.props.groupRowsBy);
});
}
}, {
key: "isRowEditing",
value: function isRowEditing(rowData) {
if (this.props.editMode === 'row' && rowData && this.props.editingRows) {
if (this.props.dataKey) return this.props.editingRows ? this.props.editingRows[ObjectUtils.resolveFieldData(rowData, this.props.dataKey)] !== undefined : false;else return this.findIndex(this.props.editingRows, rowData) !== -1;
}
return false;
}
}, {
key: "allowDrag",
value: function allowDrag(event) {
return this.props.dragSelection && this.isMultipleSelection() && !event.originalEvent.shiftKey;
}
}, {
key: "allowRowDrag",
value: function allowRowDrag(event) {
return !this.allowCellSelection() && this.allowDrag(event);
}
}, {
key: "allowCellDrag",
value: function allowCellDrag(event) {
return this.allowCellSelection() && this.allowDrag(event);
}
}, {
key: "allowSelection",
value: function allowSelection(event) {
return !DomHandler.isClickable(event.originalEvent.target);
}
}, {
key: "allowMetaKeySelection",
value: function allowMetaKeySelection(event) {
return !this.rowTouched && (!this.props.metaKeySelection || this.props.metaKeySelection && (event.originalEvent.metaKey || event.originalEvent.ctrlKey));
}
}, {
key: "allowRangeSelection",
value: function allowRangeSelection(event) {
return this.isMultipleSelection() && event.originalEvent.shiftKey && this.anchorRowIndex !== null;
}
}, {
key: "allowRowSelection",
value: function allowRowSelection() {
return (this.props.selectionMode || this.props.selectionModeInColumn) && !this.isRadioOnlySelection() && !this.isCheckboxOnlySelection();
}
}, {
key: "allowCellSelection",
value: function allowCellSelection() {
return this.props.cellSelection && !this.isRadioSelectionModeInColumn() && !this.isCheckboxSelectionModeInColumn();
}
}, {
key: "getColumnsLength",
value: function getColumnsLength() {
return this.props.columns ? this.props.columns.length : 0;
}
}, {
key: "getVirtualScrollerOption",
value: function getVirtualScrollerOption(option, options) {
options = options || this.props.virtualScrollerOptions;
return options ? options[option] : null;
}
}, {
key: "findIndex",
value: function findIndex(collection, rowData) {
var _this3 = this;
return (collection || []).findIndex(function (data) {
return _this3.equals(rowData, data);
});
}
}, {
key: "rowGroupHeaderStyle",
value: function rowGroupHeaderStyle() {
if (this.props.scrollable) {
return {
top: this.state.rowGroupHeaderStyleObject['top']
};
}
return null;
}
}, {
key: "getRowKey",
value: function getRowKey(rowData, index) {
return this.props.dataKey ? ObjectUtils.resolveFieldData(rowData, this.props.dataKey) + '_' + index : index;
}
}, {
key: "shouldRenderRowGroupHeader",
value: function shouldRenderRowGroupHeader(value, rowData, i) {
var currentRowFieldData = ObjectUtils.resolveFieldData(rowData, this.props.groupRowsBy);
var prevRowData = value[i - 1];
if (prevRowData) {
var previousRowFieldData = ObjectUtils.resolveFieldData(prevRowData, this.props.groupRowsBy);
return currentRowFieldData !== previousRowFieldData;
} else {
return true;
}
}
}, {
key: "shouldRenderRowGroupFooter",
value: function shouldRenderRowGroupFooter(value, rowData, i, expanded) {
if (this.props.expandableRowGroups && !expanded) {
return false;
} else {
var currentRowFieldData = ObjectUtils.resolveFieldData(rowData, this.props.groupRowsBy);
var nextRowData = value[i + 1];
if (nextRowData) {
var nextRowFieldData = ObjectUtils.resolveFieldData(nextRowData, this.props.groupRowsBy);
return currentRowFieldData !== nextRowFieldData;
} else {
return true;
}
}
}
}, {
key: "updateFrozenRowStickyPosition",
value: function updateFrozenRowStickyPosition() {
this.el.style.top = DomHandler.getOuterHeight(this.el.previousElementSibling) + 'px';
}
}, {
key: "updateFrozenRowGroupHeaderStickyPosition",
value: function updateFrozenRowGroupHeaderStickyPosition() {
var tableHeaderHeight = DomHandler.getOuterHeight(this.el.previousElementSibling);
var top = tableHeaderHeight + 'px';
if (this.state.rowGroupHeaderStyleObject && this.state.rowGroupHeaderStyleObject.top !== top) {
this.setState({
rowGroupHeaderStyleObject: {
top: top
}
});
}
}
}, {
key: "updateVirtualScrollerPosition",
value: function updateVirtualScrollerPosition() {
var tableHeaderHeight = DomHandler.getOuterHeight(this.el.previousElementSibling);
this.el.style.top = (this.el.style.top || 0) + tableHeaderHeight + 'px';
}
}, {
key: "onSingleSelection",
value: function onSingleSelection(_ref) {
var originalEvent = _ref.originalEvent,
data = _ref.data,
index = _ref.index,
toggleable = _ref.toggleable,
type = _ref.type;
if (!this.isSelectable({
data: data,
index: index
})) {
return;
}
var selected = this.isSelected(data);
var selection = this.props.selection;
if (selected) {
if (toggleable) {
selection = null;
this.onUnselect({
originalEvent: originalEvent,
data: data,
type: type
});
}
} else {
selection = data;
this.onSelect({
originalEvent: originalEvent,
data: data,
type: type
});
}
this.focusOnElement(originalEvent, true);
if (this.props.onSelectionChange && selection !== this.props.selection) {
this.props.onSelectionChange({
originalEvent: originalEvent,
value: selection,
type: type
});
}
}
}, {
key: "onMultipleSelection",
value: function onMultipleSelection(_ref2) {
var _this4 = this;
var originalEvent = _ref2.originalEvent,
data = _ref2.data,
index = _ref2.index,
toggleable = _ref2.toggleable,
type = _ref2.type;
if (!this.isSelectable({
data: data,
index: index
})) {
return;
}
var selected = this.isSelected(data);
var selection = this.props.selection || [];
if (selected) {
if (toggleable) {
var selectionIndex = this.findIndex(selection, data);
selection = this.props.selection.filter(function (val, i) {
return i !== selectionIndex;
});
this.onUnselect({
originalEvent: originalEvent,
data: data,
type: type
});
} else if (selection.length) {
this.props.selection.forEach(function (d) {
return _this4.onUnselect({
originalEvent: originalEvent,
data: d,
type: type
});
});
selection = [data];
this.onSelect({
originalEvent: originalEvent,
data: data,
type: type
});
}
} else {
selection = toggleable && this.isMultipleSelection() ? [].concat(_toConsumableArray(selection), [data]) : [data];
this.onSelect({
originalEvent: originalEvent,
data: data,
type: type
});
}
this.focusOnElement(originalEvent, true);
if (this.props.onSelectionChange && selection !== this.props.selection) {
this.props.onSelectionChange({
originalEvent: originalEvent,
value: selection,
type: type
});
}
}
}, {
key: "onRangeSelection",
value: function onRangeSelection(event, type) {
DomHandler.clearSelection();
this.rangeRowIndex = this.allowCellSelection() ? event.rowIndex : event.index;
var selectionInRange = this.selectRange(event);
var selection = this.isMultipleSelection() ? _toConsumableArray(new Set([].concat(_toConsumableArray(this.props.selection || []), _toConsumableArray(selectionInRange)))) : selectionInRange;
if (this.props.onSelectionChange && selection !== this.props.selection) {
this.props.onSelectionChange({
originalEvent: event.originalEvent,
value: selection,
type: type
});
}
this.anchorRowIndex = this.rangeRowIndex;
this.anchorCellIndex = event.cellIndex;
this.focusOnElement(event.originalEvent, false);
}
}, {
key: "selectRange",
value: function selectRange(event) {
var rangeStart, rangeEnd;
var isLazyAndPaginator = this.props.lazy && this.props.paginator;
if (isLazyAndPaginator) {
this.anchorRowIndex += this.anchorRowFirst;
this.rangeRowIndex += this.props.first;
}
if (this.rangeRowIndex > this.anchorRowIndex) {
rangeStart = this.anchorRowIndex;
rangeEnd = this.rangeRowIndex;
} else if (this.rangeRowIndex < this.anchorRowIndex) {
rangeStart = this.rangeRowIndex;
rangeEnd = this.anchorRowIndex;
} else {
rangeStart = rangeEnd = this.rangeRowIndex;
}
if (isLazyAndPaginator) {
rangeStart = Math.max(rangeStart - this.props.first, 0);
rangeEnd -= this.props.first;
}
return this.allowCellSelection() ? this.selectRangeOnCell(event, rangeStart, rangeEnd) : this.selectRangeOnRow(event, rangeStart, rangeEnd);
}
}, {
key: "selectRangeOnRow",
value: function selectRangeOnRow(event, rowRangeStart, rowRangeEnd) {
var value = this.props.value;
var selection = [];
for (var i = rowRangeStart; i <= rowRangeEnd; i++) {
var rangeRowData = value[i];
if (!this.isSelectable({
data: rangeRowData,
index: i
})) {
continue;
}
selection.push(rangeRowData);
this.onSelect({
originalEvent: event.originalEvent,
data: rangeRowData,
type: 'row'
});
}
return selection;
}
}, {
key: "selectRangeOnCell",
value: function selectRangeOnCell(event, rowRangeStart, rowRangeEnd) {
var cellRangeStart,
cellRangeEnd,
cellIndex = event.cellIndex;
if (cellIndex > this.anchorCellIndex) {
cellRangeStart = this.anchorCellIndex;
cellRangeEnd = cellIndex;
} else if (cellIndex < this.anchorCellIndex) {
cellRangeStart = cellIndex;
cellRangeEnd = this.anchorCellIndex;
} else {
cellRangeStart = cellRangeEnd = cellIndex;
}
var value = this.props.value;
var selection = [];
for (var i = rowRangeStart; i <= rowRangeEnd; i++) {
var rowData = value[i];
var columns = this.props.columns;
for (var j = cellRangeStart; j <= cellRangeEnd; j++) {
var field = columns[j].props.field;
var _value = ObjectUtils.resolveFieldData(rowData, field);
var rangeRowData = {
value: _value,
field: field,
rowData: rowData,
rowIndex: i,
cellIndex: j,
selected: true
};
if (!this.isSelectable({
data: rangeRowData,
index: i
})) {
continue;
}
selection.push(rangeRowData);
this.onSelect({
originalEvent: event.originalEvent,
data: rangeRowData,
type: 'cell'
});
}
}
return selection;
}
}, {
key: "onSelect",
value: function onSelect(event) {
if (this.allowCellSelection()) this.props.onCellSelect && this.props.onCellSelect(_objectSpread$x(_objectSpread$x({
originalEvent: event.originalEvent
}, event.data), {}, {
type: event.type
}));else this.props.onRowSelect && this.props.onRowSelect(event);
}
}, {
key: "onUnselect",
value: function onUnselect(event) {
if (this.allowCellSelection()) this.props.onCellUnselect && this.props.onCellUnselect(_objectSpread$x(_objectSpread$x({
originalEvent: event.originalEvent
}, event.data), {}, {
type: event.type
}));else this.props.onRowUnselect && this.props.onRowUnselect(event);
}
}, {
key: "enableDragSelection",
value: function enableDragSelection(event) {
if (this.props.dragSelection && !this.dragSelectionHelper) {
this.dragSelectionHelper = document.createElement('div');
DomHandler.addClass(this.dragSelectionHelper, 'p-datatable-drag-selection-helper');
this.initialDragPosition = {
x: event.clientX,
y: event.clientY
};
this.dragSelectionHelper.style.top = "".concat(event.pageY, "px");
this.dragSelectionHelper.style.left = "".concat(event.pageX, "px");
this.bindDragSelectionEvents();
}
}
}, {
key: "focusOnElement",
value: function focusOnElement(event, isFocused) {
var target = event.currentTarget;
if (!this.allowCellSelection() && this.props.selectionAutoFocus) {
if (this.isCheckboxSelectionModeInColumn()) {
var checkbox = DomHandler.findSingle(target, 'td.p-selection-column .p-checkbox-box');
checkbox && checkbox.focus();
} else if (this.isRadioSelectionModeInColumn()) {
var radio = DomHandler.findSingle(target, 'td.p-selection-column input[type="radio"]');
radio && radio.focus();
}
}
!isFocused && target && target.focus();
}
}, {
key: "changeTabIndex",
value: function changeTabIndex(event, type) {
var target = event.currentTarget;
var isSelectable = DomHandler.hasClass(target, type === 'cell' ? 'p-selectable-cell' : 'p-selectable-row');
if (isSelectable) {
var selector = type === 'cell' ? 'tr > td' : 'tr';
var tabbableEl = DomHandler.findSingle(this.el, "".concat(selector, "[tabindex=\"").concat(this.props.tabIndex, "\"]"));
if (tabbableEl && target) {
tabbableEl.tabIndex = -1;
target.tabIndex = this.props.tabIndex;
}
}
}
}, {
key: "onRowClick",
value: function onRowClick(event) {
if (this.allowCellSelection() || !this.allowSelection(event)) {
return;
}
this.props.onRowClick && this.props.onRowClick(event);
if (this.allowRowSelection()) {
if (this.allowRangeSelection(event)) {
this.onRangeSelection(event, 'row');
} else {
var toggleable = this.isRadioSelectionModeInColumn() || this.isCheckboxSelectionModeInColumn() || this.allowMetaKeySelection(event);
this.anchorRowIndex = event.index;
this.rangeRowIndex = event.index;
this.anchorRowFirst = this.props.first;
if (this.isSingleSelection()) {
this.onSingleSelection(_objectSpread$x(_objectSpread$x({}, event), {}, {
toggleable: toggleable,
type: 'row'
}));
} else {
this.onMultipleSelection(_objectSpread$x(_objectSpread$x({}, event), {}, {
toggleable: toggleable,
type: 'row'
}));
}
}
this.changeTabIndex(event.originalEvent, 'row');
} else {
this.focusOnElement(event.originalEvent);
}
this.rowTouched = false;
}
}, {
key: "onRowDoubleClick",
value: function onRowDoubleClick(e) {
var event = e.originalEvent;
if (DomHandler.isClickable(event.target)) {
return;
}
if (this.props.onRowDoubleClick) {
this.props.onRowDoubleClick(e);
}
}
}, {
key: "onRowRightClick",
value: function onRowRightClick(event) {
if (this.props.onContextMenu || this.props.onContextMenuSelectionChange) {
DomHandler.clearSelection();
if (this.props.onContextMenuSelectionChange) {
this.props.onContextMenuSelectionChange({
originalEvent: event.originalEvent,
value: event.data
});
}
if (this.props.onContextMenu) {
this.props.onContextMenu({
originalEvent: event.originalEvent,
data: event.data
});
}
event.originalEvent.preventDefault();
}
}
}, {
key: "onRowTouchEnd",
value: function onRowTouchEnd() {
this.rowTouched = true;
}
}, {
key: "onRowMouseDown",
value: function onRowMouseDown(e) {
DomHandler.clearSelection();
var event = e.originalEvent;
if (DomHandler.hasClass(event.target, 'p-datatable-reorderablerow-handle')) event.currentTarget.draggable = true;else event.currentTarget.draggable = false;
if (this.allowRowDrag(e)) {
this.enableDragSelection(event, 'row');
this.anchorRowIndex = e.index;
this.rangeRowIndex = e.index;
this.anchorRowFirst = this.props.first;
}
}
}, {
key: "onRowMouseUp",
value: function onRowMouseUp(event) {
var isSameRow = event.index === this.anchorRowIndex;
if (this.allowRowDrag(event) && !isSameRow) {
this.onRangeSelection(event, 'row');
}
}
}, {
key: "onRowToggle",
value: function onRowToggle(event) {
var expandedRows;
var dataKey = this.props.dataKey;
var hasDataKey = this.props.groupRowsBy ? dataKey === this.props.groupRowsBy : !!dataKey;
if (hasDataKey) {
var dataKeyValue = String(ObjectUtils.resolveFieldData(event.data, dataKey));
expandedRows = this.props.expandedRows ? _objectSpread$x({}, this.props.expandedRows) : {};
if (expandedRows[dataKeyValue] != null) {
delete expandedRows[dataKeyValue];
if (this.props.onRowCollapse) {
this.props.onRowCollapse({
originalEvent: event,
data: event.data
});
}
} else {
expandedRows[dataKeyValue] = true;
if (this.props.onRowExpand) {
this.props.onRowExpand({
originalEvent: event,
data: event.data
});
}
}
} else {
var expandedRowIndex = this.findIndex(this.props.expandedRows, event.data);
expandedRows = this.props.expandedRows ? _toConsumableArray(this.props.expandedRows) : [];
if (expandedRowIndex !== -1) {
expandedRows = expandedRows.filter(function (val, i) {
return i !== expandedRowIndex;
});
if (this.props.onRowCollapse) {
this.props.onRowCollapse({
originalEvent: event,
data: event.data
});
}
} else {
expandedRows.push(event.data);
if (this.props.onRowExpand) {
this.props.onRowExpand({
originalEvent: event,
data: event.data
});
}
}
}
if (this.props.onRowToggle) {
this.props.onRowToggle({
data: expandedRows
});
}
}
}, {
key: "onRowDragStart",
value: function onRowDragStart(e) {
var event = e.originalEvent,
index = e.index;
this.rowDragging = true;
this.draggedRowIndex = index;
event.dataTransfer.setData('text', 'b'); // For firefox
}
}, {
key: "onRowDragOver",
value: function onRowDragOver(e) {
var event = e.originalEvent,
index = e.index;
if (this.rowDragging && this.draggedRowIndex !== index) {
var rowElement = event.currentTarget;
var rowY = DomHandler.getOffset(rowElement).top + DomHandler.getWindowScrollTop();
var pageY = event.pageY;
var rowMidY = rowY + DomHandler.getOuterHeight(rowElement) / 2;
var prevRowElement = rowElement.previousElementSibling;
if (pageY < rowMidY) {
DomHandler.removeClass(rowElement, 'p-datatable-dragpoint-bottom');
this.droppedRowIndex = index;
if (prevRowElement) DomHandler.addClass(prevRowElement, 'p-datatable-dragpoint-bottom');else DomHandler.addClass(rowElement, 'p-datatable-dragpoint-top');
} else {
if (prevRowElement) DomHandler.removeClass(prevRowElement, 'p-datatable-dragpoint-bottom');else DomHandler.addClass(rowElement, 'p-datatable-dragpoint-top');
this.droppedRowIndex = index + 1;
DomHandler.addClass(rowElement, 'p-datatable-dragpoint-bottom');
}
}
event.preventDefault();
}
}, {
key: "onRowDragLeave",
value: function onRowDragLeave(e) {
var event = e.originalEvent;
var rowElement = event.currentTarget;
var prevRowElement = rowElement.previousElementSibling;
if (prevRowElement) {
DomHandler.removeClass(prevRowElement, 'p-datatable-dragpoint-bottom');
}
DomHandler.removeClass(rowElement, 'p-datatable-dragpoint-bottom');
DomHandler.removeClass(rowElement, 'p-datatable-dragpoint-top');
}
}, {
key: "onRowDragEnd",
value: function onRowDragEnd(e) {
var event = e.originalEvent;
this.rowDragging = false;
this.draggedRowIndex = null;
this.droppedRowIndex = null;
event.currentTarget.draggable = false;
}
}, {
key: "onRowDrop",
value: function onRowDrop(e) {
var event = e.originalEvent;
if (this.droppedRowIndex != null) {
var dropIndex = this.draggedRowIndex > this.droppedRowIndex ? this.droppedRowIndex : this.droppedRowIndex === 0 ? 0 : this.droppedRowIndex - 1;
var val = _toConsumableArray(this.props.value);
ObjectUtils.reorderArray(val, this.draggedRowIndex, dropIndex);
if (this.props.onRowReorder) {
this.props.onRowReorder({
originalEvent: event,
value: val,
dragIndex: this.draggedRowIndex,
dropIndex: this.droppedRowIndex
});
}
} //cleanup
this.onRowDragLeave(e);
this.onRowDragEnd(e);
event.preventDefault();
}
}, {
key: "onRadioChange",
value: function onRadioChange(event) {
this.onSingleSelection(_objectSpread$x(_objectSpread$x({}, event), {}, {
toggleable: true,
type: 'radio'
}));
}
}, {
key: "onCheckboxChange",
value: function onCheckboxChange(event) {
this.onMultipleSelection(_objectSpread$x(_objectSpread$x({}, event), {}, {
toggleable: true,
type: 'checkbox'
}));
}
}, {
key: "onDragSelectionMouseMove",
value: function onDragSelectionMouseMove(event) {
var _this$initialDragPosi = this.initialDragPosition,
x = _this$initialDragPosi.x,
y = _this$initialDragPosi.y;
var dx = event.clientX - x;
var dy = event.clientY - y;
if (dy < 0) this.dragSelectionHelper.style.top = "".concat(event.pageY + 5, "px");
if (dx < 0) this.dragSelectionHelper.style.left = "".concat(event.pageX + 5, "px");
this.dragSelectionHelper.style.height = "".concat(Math.abs(dy), "px");
this.dragSelectionHelper.style.width = "".concat(Math.abs(dx), "px");
event.preventDefault();
}
}, {
key: "onDragSelectionMouseUp",
value: function onDragSelectionMouseUp() {
if (this.dragSelectionHelper) {
this.dragSelectionHelper.remove();
this.dragSelectionHelper = null;
}
document.removeEventListener('mousemove', this.onDragSelectionMouseMove);
document.removeEventListener('mouseup', this.onDragSelectionMouseUp);
}
}, {
key: "onCellClick",
value: function onCellClick(event) {
if (!this.allowSelection(event)) {
return;
}
this.props.onCellClick && this.props.onCellClick(event);
if (this.allowCellSelection()) {
if (this.allowRangeSelection(event)) {
this.onRangeSelection(event, 'cell');
} else {
var toggleable = this.allowMetaKeySelection(event);
var originalEvent = event.originalEvent,
data = _objectWithoutProperties(event, _excluded);
this.anchorRowIndex = event.rowIndex;
this.rangeRowIndex = event.rowIndex;
this.anchorRowFirst = this.props.first;
this.anchorCellIndex = event.cellIndex;
if (this.isSingleSelection()) {
this.onSingleSelection({
originalEvent: originalEvent,
data: data,
index: event.rowIndex,
toggleable: toggleable,
type: 'cell'
});
} else {
this.onMultipleSelection({
originalEvent: originalEvent,
data: data,
index: event.rowIndex,
toggleable: toggleable,
type: 'cell'
});
}
}
this.changeTabIndex(event.originalEvent, 'cell');
}
this.rowTouched = false;
}
}, {
key: "onCellMouseDown",
value: function onCellMouseDown(event) {
if (this.allowCellDrag(event)) {
this.enableDragSelection(event.originalEvent);
this.anchorRowIndex = event.rowIndex;
this.rangeRowIndex = event.rowIndex;
this.anchorRowFirst = this.props.first;
this.anchorCellIndex = event.cellIndex;
}
}
}, {
key: "onCellMouseUp",
value: function onCellMouseUp(event) {
var isSameCell = event.rowIndex === this.anchorRowIndex && event.cellIndex === this.anchorCellIndex;
if (this.allowCellDrag(event) && !isSameCell) {
this.onRangeSelection(event, 'cell');
}
}
}, {
key: "bindDragSelectionEvents",
value: function bindDragSelectionEvents() {
document.addEventListener('mousemove', this.onDragSelectionMouseMove);
document.addEventListener('mouseup', this.onDragSelectionMouseUp);
document.body.appendChild(this.dragSelectionHelper);
}
}, {
key: "unbindDragSelectionEvents",
value: function unbindDragSelectionEvents() {
this.onDragSelectionMouseUp();
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
if (this.props.frozenRow) {
this.updateFrozenRowStickyPosition();
}
if (this.props.scrollable && this.props.rowGroupMode === 'subheader') {
this.updateFrozenRowGroupHeaderStickyPosition();
}
if (!this.props.isVirtualScrollerDisabled && this.getVirtualScrollerOption('vertical')) {
this.updateVirtualScrollerPosition();
}
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps, prevState) {
if (this.props.frozenRow) {
this.updateFrozenRowStickyPosition();
}
if (this.props.scrollable && this.props.rowGroupMode === 'subheader') {
this.updateFrozenRowGroupHeaderStickyPosition();
}
if (!this.props.isVirtualScrollerDisabled && this.getVirtualScrollerOption('vertical') && this.getVirtualScrollerOption('itemSize', prevProps.virtualScrollerOptions) !== this.getVirtualScrollerOption('itemSize')) {
this.updateVirtualScrollerPosition();
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
if (this.props.dragSelection) {
this.unbindDragSelectionEvents();
}
}
}, {
key: "renderEmptyContent",
value: function renderEmptyContent() {
if (!this.props.loading) {
var colSpan = this.getColumnsLength();
var content = ObjectUtils.getJSXElement(this.props.emptyMessage, {
props: this.props,
frozen: this.props.frozenRow
}) || localeOption('emptyMessage');
return /*#__PURE__*/React__default["default"].createElement("tr", {
className: "p-datatable-emptymessage",
role: "row"
}, /*#__PURE__*/React__default["default"].createElement("td", {
colSpan: colSpan,
role: "cell"
}, content));
}
return null;
}
}, {
key: "renderGroupHeader",
value: function renderGroupHeader(rowData, index, expanded, isSubheaderGrouping, colSpan) {
if (isSubheaderGrouping && this.shouldRenderRowGroupHeader(this.props.value, rowData, index - this.props.first)) {
var style = this.rowGroupHeaderStyle();
var toggler = this.props.expandableRowGroups && /*#__PURE__*/React__default["default"].createElement(RowTogglerButton, {
onClick: this.onRowToggle,
rowData: rowData,
expanded: expanded,
expandedRowIcon: this.props.expandedRowIcon,
collapsedRowIcon: this.props.collapsedRowIcon
});
var content = ObjectUtils.getJSXElement(this.props.rowGroupHeaderTemplate, rowData, {
index: index,
props: this.props.tableProps
});
return /*#__PURE__*/React__default["default"].createElement("tr", {
className: "p-rowgroup-header",
style: style,
role: "row"
}, /*#__PURE__*/React__default["default"].createElement("td", {
colSpan: colSpan
}, toggler, /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-rowgroup-header-name"
}, content)));
}
return null;
}
}, {
key: "renderRow",
value: function renderRow(rowData, index, expanded) {
if (!this.props.expandableRowGroups || expanded) {
var selected = this.isSelectionEnabled() ? this.isSelected(rowData) : false;
var contextMenuSelected = this.isContextMenuSelected(rowData);
var allowRowSelection = this.allowRowSelection();
var allowCellSelection = this.allowCellSelection();
var editing = this.isRowEditing(rowData);
return /*#__PURE__*/React__default["default"].createElement(BodyRow, {
tableProps: this.props.tableProps,
tableSelector: this.props.tableSelector,
value: this.props.value,
columns: this.props.columns,
rowData: rowData,
index: index,
selected: selected,
contextMenuSelected: contextMenuSelected,
onRowClick: this.onRowClick,
onRowDoubleClick: this.onRowDoubleClick,
onRowRightClick: this.onRowRightClick,
tabIndex: this.props.tabIndex,
isSelectable: this.isSelectable,
onRowTouchEnd: this.onRowTouchEnd,
onRowMouseDown: this.onRowMouseDown,
onRowMouseUp: this.onRowMouseUp,
onRowToggle: this.onRowToggle,
onRowDragStart: this.onRowDragStart,
onRowDragOver: this.onRowDragOver,
onRowDragLeave: this.onRowDragLeave,
onRowDragEnd: this.onRowDragEnd,
onRowDrop: this.onRowDrop,
onRadioChange: this.onRadioChange,
onCheckboxChange: this.onCheckboxChange,
onCellClick: this.onCellClick,
onCellMouseDown: this.onCellMouseDown,
onCellMouseUp: this.onCellMouseUp,
editing: editing,
editingRows: this.props.editingRows,
editingMeta: this.props.editingMeta,
editMode: this.props.editMode,
onRowEditChange: this.props.onRowEditChange,
onEditingMetaChange: this.props.onEditingMetaChange,
groupRowsBy: this.props.groupRowsBy,
compareSelectionBy: this.props.compareSelectionBy,
dataKey: this.props.dataKey,
rowGroupMode: this.props.rowGroupMode,
onRowEditInit: this.props.onRowEditInit,
rowEditValidator: this.props.rowEditValidator,
onRowEditSave: this.props.onRowEditSave,
onRowEditComplete: this.props.onRowEditComplete,
onRowEditCancel: this.props.onRowEditCancel,
selection: this.props.selection,
allowRowSelection: allowRowSelection,
allowCellSelection: allowCellSelection,
selectOnEdit: this.props.selectOnEdit,
selectionMode: this.props.selectionMode,
selectionModeInColumn: this.props.selectionModeInColumn,
cellClassName: this.props.cellClassName,
responsiveLayout: this.props.responsiveLayout,
frozenRow: this.props.frozenRow,
showSelectionElement: this.props.showSelectionElement,
showRowReorderElement: this.props.showRowReorderElement,
expanded: expanded,
expandedRowIcon: this.props.expandedRowIcon,
collapsedRowIcon: this.props.collapsedRowIcon,
rowClassName: this.props.rowClassName,
virtualScrollerOptions: this.props.virtualScrollerOptions
});
}
}
}, {
key: "renderExpansion",
value: function renderExpansion(rowData, index, expanded, isSubheaderGrouping, colSpan) {
if (expanded && !(isSubheaderGrouping && this.props.expandableRowGroups)) {
var content = ObjectUtils.getJSXElement(this.props.rowExpansionTemplate, rowData, {
index: index
});
var id = "".concat(this.props.tableSelector, "_content_").concat(index, "_expanded");
return /*#__PURE__*/React__default["default"].createElement("tr", {
id: id,
className: "p-datatable-row-expansion",
role: "row"
}, /*#__PURE__*/React__default["default"].createElement("td", {
role: "cell",
colSpan: colSpan
}, content));
}
return null;
}
}, {
key: "renderGroupFooter",
value: function renderGroupFooter(rowData, index, expanded, isSubheaderGrouping, colSpan) {
if (isSubheaderGrouping && this.shouldRenderRowGroupFooter(this.props.value, rowData, index - this.props.first, expanded)) {
var content = ObjectUtils.getJSXElement(this.props.rowGroupFooterTemplate, rowData, {
index: index,
colSpan: colSpan,
props: this.props.tableProps
});
return /*#__PURE__*/React__default["default"].createElement("tr", {
className: "p-rowgroup-footer",
role: "row"
}, content);
}
return null;
}
}, {
key: "renderContent",
value: function renderContent() {
var _this5 = this;
return this.props.value.map(function (rowData, i) {
var index = _this5.getVirtualScrollerOption('getItemOptions') ? _this5.getVirtualScrollerOption('getItemOptions')(i).index : _this5.props.first + i;
var key = _this5.getRowKey(rowData, index);
var expanded = _this5.isRowExpanded(rowData);
var isSubheaderGrouping = _this5.isSubheaderGrouping();
var colSpan = _this5.getColumnsLength();
var groupHeader = _this5.renderGroupHeader(rowData, index, expanded, isSubheaderGrouping, colSpan);
var row = _this5.renderRow(rowData, index, expanded);
var expansion = _this5.renderExpansion(rowData, index, expanded, isSubheaderGrouping, colSpan);
var groupFooter = _this5.renderGroupFooter(rowData, index, expanded, isSubheaderGrouping, colSpan);
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, {
key: key
}, groupHeader, row, expansion, groupFooter);
});
}
}, {
key: "render",
value: function render() {
var className = classNames('p-datatable-tbody', this.props.className);
var content = this.props.empty ? this.renderEmptyContent() : this.renderContent();
return /*#__PURE__*/React__default["default"].createElement("tbody", {
ref: this.ref,
className: className
}, content);
}
}]);
return TableBody;
}(React.Component);
function ownKeys$w(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$w(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$w(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$w(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createSuper$1w(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1w(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1w() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var FooterCell = /*#__PURE__*/function (_Component) {
_inherits(FooterCell, _Component);
var _super = _createSuper$1w(FooterCell);
function FooterCell(props) {
var _this;
_classCallCheck(this, FooterCell);
_this = _super.call(this, props);
_this.state = {
styleObject: {}
};
return _this;
}
_createClass(FooterCell, [{
key: "getColumnProp",
value: function getColumnProp(prop) {
return this.props.column.props[prop];
}
}, {
key: "getStyle",
value: function getStyle() {
var footerStyle = this.getColumnProp('footerStyle');
var columnStyle = this.getColumnProp('style');
return this.getColumnProp('frozen') ? Object.assign({}, columnStyle, footerStyle, this.state.styleObject) : Object.assign({}, columnStyle, footerStyle);
}
}, {
key: "updateStickyPosition",
value: function updateStickyPosition() {
if (this.getColumnProp('frozen')) {
var styleObject = _objectSpread$w({}, this.state.styleObject);
var align = this.getColumnProp('alignFrozen');
if (align === 'right') {
var right = 0;
var next = this.el.nextElementSibling;
if (next) {
right = DomHandler.getOuterWidth(next) + parseFloat(next.style.right || 0);
}
styleObject['right'] = right + 'px';
} else {
var left = 0;
var prev = this.el.previousElementSibling;
if (prev) {
left = DomHandler.getOuterWidth(prev) + parseFloat(prev.style.left || 0);
}
styleObject['left'] = left + 'px';
}
this.setState({
styleObject: styleObject
});
}
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
if (this.getColumnProp('frozen')) {
this.updateStickyPosition();
}
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps, prevState) {
if (this.getColumnProp('frozen')) {
this.updateStickyPosition();
}
}
}, {
key: "render",
value: function render() {
var _this2 = this;
var style = this.getStyle();
var align = this.getColumnProp('align');
var className = classNames(this.getColumnProp('footerClassName'), this.getColumnProp('className'), _defineProperty({
'p-frozen-column': this.getColumnProp('frozen')
}, "p-align-".concat(align), !!align));
var colSpan = this.getColumnProp('colSpan');
var rowSpan = this.getColumnProp('rowSpan');
var content = ObjectUtils.getJSXElement(this.getColumnProp('footer'), {
props: this.props.tableProps
});
return /*#__PURE__*/React__default["default"].createElement("td", {
ref: function ref(el) {
return _this2.el = el;
},
style: style,
className: className,
role: "cell",
colSpan: colSpan,
rowSpan: rowSpan
}, content);
}
}]);
return FooterCell;
}(React.Component);
function _createSuper$1v(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1v(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1v() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var TableFooter = /*#__PURE__*/function (_Component) {
_inherits(TableFooter, _Component);
var _super = _createSuper$1v(TableFooter);
function TableFooter() {
_classCallCheck(this, TableFooter);
return _super.apply(this, arguments);
}
_createClass(TableFooter, [{
key: "hasFooter",
value: function hasFooter() {
return this.props.footerColumnGroup ? true : this.props.columns ? this.props.columns.some(function (col) {
return col && col.props.footer;
}) : false;
}
}, {
key: "renderGroupFooterCells",
value: function renderGroupFooterCells(row) {
var columns = React__default["default"].Children.toArray(row.props.children);
return this.renderFooterCells(columns);
}
}, {
key: "renderFooterCells",
value: function renderFooterCells(columns) {
var _this = this;
return React__default["default"].Children.map(columns, function (col, i) {
var isVisible = col ? !col.props.hidden : true;
var key = col ? col.props.columnKey || col.props.field || i : i;
return isVisible && /*#__PURE__*/React__default["default"].createElement(FooterCell, {
key: key,
tableProps: _this.props.tableProps,
column: col
});
});
}
}, {
key: "renderContent",
value: function renderContent() {
var _this2 = this;
if (this.props.footerColumnGroup) {
var rows = React__default["default"].Children.toArray(this.props.footerColumnGroup.props.children);
return rows.map(function (row, i) {
return /*#__PURE__*/React__default["default"].createElement("tr", {
key: i,
role: "row"
}, _this2.renderGroupFooterCells(row));
});
}
return /*#__PURE__*/React__default["default"].createElement("tr", {
role: "row"
}, this.renderFooterCells(this.props.columns));
}
}, {
key: "render",
value: function render() {
if (this.hasFooter()) {
var content = this.renderContent();
return /*#__PURE__*/React__default["default"].createElement("tfoot", {
className: "p-datatable-tfoot"
}, content);
}
return null;
}
}]);
return TableFooter;
}(React.Component);
function _createSuper$1u(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1u(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1u() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var HeaderCheckbox = /*#__PURE__*/function (_Component) {
_inherits(HeaderCheckbox, _Component);
var _super = _createSuper$1u(HeaderCheckbox);
function HeaderCheckbox(props) {
var _this;
_classCallCheck(this, HeaderCheckbox);
_this = _super.call(this, props);
_this.state = {
focused: false
};
_this.onFocus = _this.onFocus.bind(_assertThisInitialized(_this));
_this.onBlur = _this.onBlur.bind(_assertThisInitialized(_this));
_this.onClick = _this.onClick.bind(_assertThisInitialized(_this));
_this.onKeyDown = _this.onKeyDown.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(HeaderCheckbox, [{
key: "onFocus",
value: function onFocus() {
this.setState({
focused: true
});
}
}, {
key: "onBlur",
value: function onBlur() {
this.setState({
focused: false
});
}
}, {
key: "onClick",
value: function onClick(event) {
if (!this.props.disabled) {
this.setState({
focused: true
});
this.props.onChange({
originalEvent: event,
checked: !this.props.checked
});
}
}
}, {
key: "onKeyDown",
value: function onKeyDown(event) {
if (event.code === 'Space') {
this.onClick(event);
event.preventDefault();
}
}
}, {
key: "render",
value: function render() {
var boxClassName = classNames('p-checkbox-box p-component', {
'p-highlight': this.props.checked,
'p-disabled': this.props.disabled,
'p-focus': this.state.focused
});
var iconClassName = classNames('p-checkbox-icon', {
'pi pi-check': this.props.checked
});
var tabIndex = this.props.disabled ? null : 0;
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-checkbox p-component",
onClick: this.onClick
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: boxClassName,
role: "checkbox",
"aria-checked": this.props.checked,
tabIndex: tabIndex,
onFocus: this.onFocus,
onBlur: this.onBlur,
onKeyDown: this.onKeyDown
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: iconClassName
})));
}
}]);
return HeaderCheckbox;
}(React.Component);
function ownKeys$v(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$v(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$v(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$v(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createSuper$1t(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1t(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1t() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var ColumnFilter = /*#__PURE__*/function (_Component) {
_inherits(ColumnFilter, _Component);
var _super = _createSuper$1t(ColumnFilter);
function ColumnFilter(props) {
var _this;
_classCallCheck(this, ColumnFilter);
_this = _super.call(this, props);
_this.state = {
overlayVisible: false
};
_this.overlayRef = /*#__PURE__*/React__default["default"].createRef();
_this.filterCallback = _this.filterCallback.bind(_assertThisInitialized(_this));
_this.filterApplyCallback = _this.filterApplyCallback.bind(_assertThisInitialized(_this));
_this.onOperatorChange = _this.onOperatorChange.bind(_assertThisInitialized(_this));
_this.addConstraint = _this.addConstraint.bind(_assertThisInitialized(_this));
_this.clearFilter = _this.clearFilter.bind(_assertThisInitialized(_this));
_this.applyFilter = _this.applyFilter.bind(_assertThisInitialized(_this));
_this.onInputChange = _this.onInputChange.bind(_assertThisInitialized(_this));
_this.toggleMenu = _this.toggleMenu.bind(_assertThisInitialized(_this));
_this.onOverlayEnter = _this.onOverlayEnter.bind(_assertThisInitialized(_this));
_this.onOverlayExit = _this.onOverlayExit.bind(_assertThisInitialized(_this));
_this.onOverlayExited = _this.onOverlayExited.bind(_assertThisInitialized(_this));
_this.onContentKeyDown = _this.onContentKeyDown.bind(_assertThisInitialized(_this));
_this.onContentClick = _this.onContentClick.bind(_assertThisInitialized(_this));
_this.onContentMouseDown = _this.onContentMouseDown.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(ColumnFilter, [{
key: "field",
get: function get() {
return this.getColumnProp('filterField') || this.getColumnProp('field');
}
}, {
key: "overlay",
get: function get() {
return this.overlayRef ? this.overlayRef.current : null;
}
}, {
key: "filterModel",
get: function get() {
return this.props.filters[this.field];
}
}, {
key: "filterStoreModel",
get: function get() {
return this.props.filtersStore[this.field];
}
}, {
key: "hasFilter",
value: function hasFilter() {
if (this.props.filtersStore) {
var fieldFilter = this.props.filtersStore[this.field];
return fieldFilter && (fieldFilter.operator ? !this.isFilterBlank(fieldFilter.constraints[0].value) : !this.isFilterBlank(fieldFilter.value));
}
return false;
}
}, {
key: "hasRowFilter",
value: function hasRowFilter() {
return this.filterModel && !this.isFilterBlank(this.filterModel.value);
}
}, {
key: "isFilterBlank",
value: function isFilterBlank(filter) {
return ObjectUtils.isEmpty(filter);
}
}, {
key: "isRowMatchModeSelected",
value: function isRowMatchModeSelected(matchMode) {
return this.filterModel && this.filterModel.matchMode === matchMode;
}
}, {
key: "showMenuButton",
value: function showMenuButton() {
return this.getColumnProp('showFilterMenu') && (this.props.display === 'row' ? this.getColumnProp('dataType') !== 'boolean' : true);
}
}, {
key: "matchModes",
value: function matchModes() {
return this.getColumnProp('filterMatchModeOptions') || PrimeReact.filterMatchModeOptions[this.findDataType()].map(function (key) {
return {
label: localeOption(key),
value: key
};
});
}
}, {
key: "isShowMatchModes",
value: function isShowMatchModes() {
return this.getColumnProp('dataType') !== 'boolean' && this.getColumnProp('showFilterMatchModes') && this.matchModes() && this.getColumnProp('showFilterMenuOptions');
}
}, {
key: "isShowOperator",
value: function isShowOperator() {
return this.getColumnProp('showFilterOperator') && this.filterModel && this.filterModel.operator && this.getColumnProp('showFilterMenuOptions');
}
}, {
key: "showRemoveIcon",
value: function showRemoveIcon() {
return this.fieldConstraints().length > 1;
}
}, {
key: "isShowAddConstraint",
value: function isShowAddConstraint() {
return this.getColumnProp('showAddButton') && this.filterModel && this.filterModel.operator && this.fieldConstraints() && this.fieldConstraints().length < this.getColumnProp('maxConstraints') && this.getColumnProp('showFilterMenuOptions');
}
}, {
key: "isOutsideClicked",
value: function isOutsideClicked(target) {
return !this.isTargetClicked(target) && this.overlayRef && this.overlayRef.current && !(this.overlayRef.current.isSameNode(target) || this.overlayRef.current.contains(target));
}
}, {
key: "isTargetClicked",
value: function isTargetClicked(target) {
return this.icon && (this.icon.isSameNode(target) || this.icon.contains(target));
}
}, {
key: "getColumnProp",
value: function getColumnProp(prop) {
return this.props.column.props[prop];
}
}, {
key: "getDefaultConstraint",
value: function getDefaultConstraint() {
if (this.props.filtersStore && this.filterStoreModel) {
if (this.filterStoreModel.operator) {
return {
matchMode: this.filterStoreModel.constraints[0].matchMode,
operator: this.filterStoreModel.operator
};
} else {
return {
matchMode: this.filterStoreModel.matchMode
};
}
}
}
}, {
key: "findDataType",
value: function findDataType() {
var dataType = this.getColumnProp('dataType');
var matchMode = this.getColumnProp('filterMatchMode');
var hasMatchMode = function hasMatchMode(key) {
return PrimeReact.filterMatchModeOptions[key].some(function (mode) {
return mode === matchMode;
});
};
if (matchMode === 'custom' && !hasMatchMode(dataType)) {
PrimeReact.filterMatchModeOptions[dataType].push(FilterMatchMode.CUSTOM);
return dataType;
} else if (matchMode) {
return Object.keys(PrimeReact.filterMatchModeOptions).find(function (key) {
return hasMatchMode(key);
}) || dataType;
}
return dataType;
}
}, {
key: "clearFilter",
value: function clearFilter() {
var field = this.field;
var filterClearCallback = this.getColumnProp('onFilterClear');
var defaultConstraint = this.getDefaultConstraint();
var filters = _objectSpread$v({}, this.props.filters);
if (filters[field].operator) {
filters[field].constraints.splice(1);
filters[field].operator = defaultConstraint.operator;
filters[field].constraints[0] = {
value: null,
matchMode: defaultConstraint.matchMode
};
} else {
filters[field].value = null;
filters[field].matchMode = defaultConstraint.matchMode;
}
filterClearCallback && filterClearCallback();
this.props.onFilterChange(filters);
this.props.onFilterApply();
this.hide();
}
}, {
key: "applyFilter",
value: function applyFilter() {
var filterApplyClickCallback = this.getColumnProp('onFilterApplyClick');
filterApplyClickCallback && filterApplyClickCallback({
field: this.field,
constraints: this.filterModel
});
this.props.onFilterApply();
this.hide();
}
}, {
key: "toggleMenu",
value: function toggleMenu() {
this.setState(function (prevState) {
return {
overlayVisible: !prevState.overlayVisible
};
});
}
}, {
key: "onToggleButtonKeyDown",
value: function onToggleButtonKeyDown(event) {
switch (event.key) {
case 'Escape':
case 'Tab':
this.hide();
break;
case 'ArrowDown':
if (this.state.overlayVisible) {
var focusable = DomHandler.getFirstFocusableElement(this.overlay);
focusable && focusable.focus();
event.preventDefault();
} else if (event.altKey) {
this.setState({
overlayVisible: true
});
event.preventDefault();
}
break;
}
}
}, {
key: "onContentKeyDown",
value: function onContentKeyDown(event) {
if (event.key === 'Escape') {
this.hide();
this.icon && this.icon.focus();
}
}
}, {
key: "onInputChange",
value: function onInputChange(event, index) {
var filters = _objectSpread$v({}, this.props.filters);
var value = event.target.value;
if (this.props.display === 'menu') {
filters[this.field].constraints[index].value = value;
} else {
filters[this.field].value = value;
}
this.props.onFilterChange(filters);
if (!this.getColumnProp('showApplyButton') || this.props.display === 'row') {
this.props.onFilterApply();
}
}
}, {
key: "onRowMatchModeChange",
value: function onRowMatchModeChange(matchMode) {
var filterMatchModeChangeCallback = this.getColumnProp('onFilterMatchModeChange');
var filters = _objectSpread$v({}, this.props.filters);
filters[this.field].matchMode = matchMode;
filterMatchModeChangeCallback && filterMatchModeChangeCallback({
field: this.field,
matchMode: matchMode
});
this.props.onFilterChange(filters);
this.props.onFilterApply();
this.hide();
}
}, {
key: "onRowMatchModeKeyDown",
value: function onRowMatchModeKeyDown(event, matchMode, clear) {
var item = event.target;
switch (event.key) {
case 'ArrowDown':
var nextItem = this.findNextItem(item);
if (nextItem) {
item.removeAttribute('tabindex');
nextItem.tabIndex = 0;
nextItem.focus();
}
event.preventDefault();
break;
case 'ArrowUp':
var prevItem = this.findPrevItem(item);
if (prevItem) {
item.removeAttribute('tabindex');
prevItem.tabIndex = 0;
prevItem.focus();
}
event.preventDefault();
break;
case 'Enter':
clear ? this.clearFilter() : this.onRowMatchModeChange(matchMode.value);
event.preventDefault();
break;
}
}
}, {
key: "onOperatorChange",
value: function onOperatorChange(e) {
var filterOperationChangeCallback = this.getColumnProp('onFilterOperatorChange');
var value = e.value;
var filters = _objectSpread$v({}, this.props.filters);
filters[this.field].operator = value;
this.props.onFilterChange(filters);
filterOperationChangeCallback && filterOperationChangeCallback({
field: this.field,
operator: value
});
if (!this.getColumnProp('showApplyButton')) {
this.props.onFilterApply();
}
}
}, {
key: "onMenuMatchModeChange",
value: function onMenuMatchModeChange(value, index) {
var filterMatchModeChangeCallback = this.getColumnProp('onFilterMatchModeChange');
var filters = _objectSpread$v({}, this.props.filters);
filters[this.field].constraints[index].matchMode = value;
this.props.onFilterChange(filters);
filterMatchModeChangeCallback && filterMatchModeChangeCallback({
field: this.field,
matchMode: value,
index: index
});
if (!this.getColumnProp('showApplyButton')) {
this.props.onFilterApply();
}
}
}, {
key: "addConstraint",
value: function addConstraint() {
var filterConstraintAddCallback = this.getColumnProp('onFilterConstraintAdd');
var defaultConstraint = this.getDefaultConstraint();
var filters = _objectSpread$v({}, this.props.filters);
var newConstraint = {
value: null,
matchMode: defaultConstraint.matchMode
};
filters[this.field].constraints.push(newConstraint);
filterConstraintAddCallback && filterConstraintAddCallback({
field: this.field,
constraint: newConstraint
});
this.props.onFilterChange(filters);
if (!this.getColumnProp('showApplyButton')) {
this.props.onFilterApply();
}
}
}, {
key: "removeConstraint",
value: function removeConstraint(index) {
var filterConstraintRemoveCallback = this.getColumnProp('onFilterConstraintRemove');
var filters = _objectSpread$v({}, this.props.filters);
var removedConstraint = filters[this.field].constraints.splice(index, 1);
filterConstraintRemoveCallback && filterConstraintRemoveCallback({
field: this.field,
constraint: removedConstraint
});
this.props.onFilterChange(filters);
if (!this.getColumnProp('showApplyButton')) {
this.props.onFilterApply();
}
}
}, {
key: "findNextItem",
value: function findNextItem(item) {
var nextItem = item.nextElementSibling;
if (nextItem) return DomHandler.hasClass(nextItem, 'p-column-filter-separator') ? this.findNextItem(nextItem) : nextItem;else return item.parentElement.firstElementChild;
}
}, {
key: "findPrevItem",
value: function findPrevItem(item) {
var prevItem = item.previousElementSibling;
if (prevItem) return DomHandler.hasClass(prevItem, 'p-column-filter-separator') ? this.findPrevItem(prevItem) : prevItem;else return item.parentElement.lastElementChild;
}
}, {
key: "hide",
value: function hide() {
this.setState({
overlayVisible: false
});
}
}, {
key: "onContentClick",
value: function onContentClick(event) {
this.selfClick = true;
OverlayService.emit('overlay-click', {
originalEvent: event,
target: this.overlay
});
}
}, {
key: "onContentMouseDown",
value: function onContentMouseDown() {
this.selfClick = true;
}
}, {
key: "onOverlayEnter",
value: function onOverlayEnter() {
var _this2 = this;
ZIndexUtils.set('overlay', this.overlay, PrimeReact.autoZIndex, PrimeReact.zIndex['overlay']);
DomHandler.alignOverlay(this.overlay, this.icon, PrimeReact.appendTo, false);
this.bindOutsideClickListener();
this.bindScrollListener();
this.bindResizeListener();
this.overlayEventListener = function (e) {
if (!_this2.isOutsideClicked(e.target)) {
_this2.selfClick = true;
}
};
OverlayService.on('overlay-click', this.overlayEventListener);
}
}, {
key: "onOverlayExit",
value: function onOverlayExit() {
this.onOverlayHide();
}
}, {
key: "onOverlayExited",
value: function onOverlayExited() {
ZIndexUtils.clear(this.overlay);
}
}, {
key: "onOverlayHide",
value: function onOverlayHide() {
this.unbindOutsideClickListener();
this.unbindResizeListener();
this.unbindScrollListener();
OverlayService.off('overlay-click', this.overlayEventListener);
this.overlayEventListener = null;
}
}, {
key: "bindOutsideClickListener",
value: function bindOutsideClickListener() {
var _this3 = this;
if (!this.outsideClickListener) {
this.outsideClickListener = function (event) {
if (!_this3.selfClick && _this3.isOutsideClicked(event.target)) {
_this3.hide();
}
_this3.selfClick = false;
};
document.addEventListener('click', this.outsideClickListener);
}
}
}, {
key: "unbindOutsideClickListener",
value: function unbindOutsideClickListener() {
if (this.outsideClickListener) {
document.removeEventListener('click', this.outsideClickListener);
this.outsideClickListener = null;
this.selfClick = false;
}
}
}, {
key: "bindScrollListener",
value: function bindScrollListener() {
var _this4 = this;
if (!this.scrollHandler) {
this.scrollHandler = new ConnectedOverlayScrollHandler(this.icon, function () {
if (_this4.state.overlayVisible) {
_this4.hide();
}
});
}
this.scrollHandler.bindScrollListener();
}
}, {
key: "unbindScrollListener",
value: function unbindScrollListener() {
if (this.scrollHandler) {
this.scrollHandler.unbindScrollListener();
}
}
}, {
key: "bindResizeListener",
value: function bindResizeListener() {
var _this5 = this;
if (!this.resizeListener) {
this.resizeListener = function () {
if (_this5.state.overlayVisible && !DomHandler.isTouchDevice()) {
_this5.hide();
}
};
window.addEventListener('resize', this.resizeListener);
}
}
}, {
key: "unbindResizeListener",
value: function unbindResizeListener() {
if (this.resizeListener) {
window.removeEventListener('resize', this.resizeListener);
this.resizeListener = null;
}
}
}, {
key: "fieldConstraints",
value: function fieldConstraints() {
return this.filterModel ? this.filterModel.constraints || [this.filterModel] : [];
}
}, {
key: "operator",
value: function operator() {
return this.filterModel.operator;
}
}, {
key: "operatorOptions",
value: function operatorOptions() {
return [{
label: localeOption('matchAll'),
value: FilterOperator.AND
}, {
label: localeOption('matchAny'),
value: FilterOperator.OR
}];
}
}, {
key: "noFilterLabel",
value: function noFilterLabel() {
return localeOption('noFilter');
}
}, {
key: "removeRuleButtonLabel",
value: function removeRuleButtonLabel() {
return localeOption('removeRule');
}
}, {
key: "addRuleButtonLabel",
value: function addRuleButtonLabel() {
return localeOption('addRule');
}
}, {
key: "clearButtonLabel",
value: function clearButtonLabel() {
return localeOption('clear');
}
}, {
key: "applyButtonLabel",
value: function applyButtonLabel() {
return localeOption('apply');
}
}, {
key: "filterCallback",
value: function filterCallback(value) {
var index = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
var filters = _objectSpread$v({}, this.props.filters);
var meta = filters[this.field];
this.props.display === 'menu' && meta && meta.operator ? filters[this.field].constraints[index].value = value : filters[this.field].value = value;
this.props.onFilterChange(filters);
}
}, {
key: "filterApplyCallback",
value: function filterApplyCallback() {
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
args && this.filterCallback(args[0], args[1]);
this.props.onFilterApply();
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps, prevState) {
if (this.props.display === 'menu' && this.state.overlayVisible) {
DomHandler.alignOverlay(this.overlay, this.icon, PrimeReact.appendTo, false);
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
if (this.overlayEventListener) {
OverlayService.off('overlay-click', this.overlayEventListener);
this.overlayEventListener = null;
}
if (this.overlay) {
ZIndexUtils.clear(this.overlay);
this.onOverlayHide();
}
}
}, {
key: "renderFilterElement",
value: function renderFilterElement(model, index) {
var _this6 = this;
var value = model ? model.value : null;
return this.getColumnProp('filterElement') ? ObjectUtils.getJSXElement(this.getColumnProp('filterElement'), {
field: this.field,
index: index,
filterModel: model,
value: value,
filterApplyCallback: this.filterApplyCallback,
filterCallback: this.filterCallback
}) : /*#__PURE__*/React__default["default"].createElement(InputText, {
type: this.getColumnProp('filterType'),
value: value || '',
onChange: function onChange(e) {
return _this6.onInputChange(e, index);
},
className: "p-column-filter",
placeholder: this.getColumnProp('filterPlaceholder'),
maxLength: this.getColumnProp('filterMaxLength')
});
}
}, {
key: "renderRowFilterElement",
value: function renderRowFilterElement() {
if (this.props.display === 'row') {
var content = this.renderFilterElement(this.filterModel, 0);
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-fluid p-column-filter-element"
}, content);
}
return null;
}
}, {
key: "renderMenuFilterElement",
value: function renderMenuFilterElement(fieldConstraint, index) {
if (this.props.display === 'menu') {
return this.renderFilterElement(fieldConstraint, index);
}
return null;
}
}, {
key: "renderMenuButton",
value: function renderMenuButton() {
var _this7 = this;
if (this.showMenuButton()) {
var className = classNames('p-column-filter-menu-button p-link', {
'p-column-filter-menu-button-open': this.state.overlayVisible,
'p-column-filter-menu-button-active': this.hasFilter()
});
return /*#__PURE__*/React__default["default"].createElement("button", {
ref: function ref(el) {
return _this7.icon = el;
},
type: "button",
className: className,
"aria-haspopup": true,
"aria-expanded": this.state.overlayVisible,
onClick: this.toggleMenu,
onKeyDown: this.onToggleButtonKeyDown
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: "pi pi-filter-icon pi-filter"
}));
}
return null;
}
}, {
key: "renderClearButton",
value: function renderClearButton() {
if (this.getColumnProp('showClearButton') && this.props.display === 'row') {
var className = classNames('p-column-filter-clear-button p-link', {
'p-hidden-space': !this.hasRowFilter()
});
return /*#__PURE__*/React__default["default"].createElement("button", {
className: className,
type: "button",
onClick: this.clearFilter
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: "pi pi-filter-slash"
}));
}
return null;
}
}, {
key: "renderRowItems",
value: function renderRowItems() {
var _this8 = this;
if (this.isShowMatchModes()) {
var matchModes = this.matchModes();
var noFilterLabel = this.noFilterLabel();
return /*#__PURE__*/React__default["default"].createElement("ul", {
className: "p-column-filter-row-items"
}, matchModes.map(function (matchMode, i) {
var value = matchMode.value,
label = matchMode.label;
var className = classNames('p-column-filter-row-item', {
'p-highlight': _this8.isRowMatchModeSelected(value)
});
var tabIndex = i === 0 ? 0 : null;
return /*#__PURE__*/React__default["default"].createElement("li", {
className: className,
key: label,
onClick: function onClick() {
return _this8.onRowMatchModeChange(value);
},
onKeyDown: function onKeyDown(e) {
return _this8.onRowMatchModeKeyDown(e, matchMode);
},
tabIndex: tabIndex
}, label);
}), /*#__PURE__*/React__default["default"].createElement("li", {
className: "p-column-filter-separator"
}), /*#__PURE__*/React__default["default"].createElement("li", {
className: "p-column-filter-row-item",
onClick: this.clearFilter,
onKeyDown: function onKeyDown(e) {
return _this8.onRowMatchModeKeyDown(e, null, true);
}
}, noFilterLabel));
}
return null;
}
}, {
key: "renderOperator",
value: function renderOperator() {
if (this.isShowOperator()) {
var options = this.operatorOptions();
var value = this.operator();
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-column-filter-operator"
}, /*#__PURE__*/React__default["default"].createElement(Dropdown, {
options: options,
value: value,
onChange: this.onOperatorChange,
className: "p-column-filter-operator-dropdown"
}));
}
return null;
}
}, {
key: "renderMatchModeDropdown",
value: function renderMatchModeDropdown(constraint, index) {
var _this9 = this;
if (this.isShowMatchModes()) {
var options = this.matchModes();
return /*#__PURE__*/React__default["default"].createElement(Dropdown, {
options: options,
value: constraint.matchMode,
onChange: function onChange(e) {
return _this9.onMenuMatchModeChange(e.value, index);
},
className: "p-column-filter-matchmode-dropdown"
});
}
return null;
}
}, {
key: "renderRemoveButton",
value: function renderRemoveButton(index) {
var _this10 = this;
if (this.showRemoveIcon()) {
var removeRuleLabel = this.removeRuleButtonLabel();
return /*#__PURE__*/React__default["default"].createElement(Button, {
type: "button",
icon: "pi pi-trash",
className: "p-column-filter-remove-button p-button-text p-button-danger p-button-sm",
onClick: function onClick() {
return _this10.removeConstraint(index);
},
label: removeRuleLabel
});
}
return null;
}
}, {
key: "renderConstraints",
value: function renderConstraints() {
var _this11 = this;
var fieldConstraints = this.fieldConstraints();
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-column-filter-constraints"
}, fieldConstraints.map(function (fieldConstraint, i) {
var matchModeDropdown = _this11.renderMatchModeDropdown(fieldConstraint, i);
var menuFilterElement = _this11.renderMenuFilterElement(fieldConstraint, i);
var removeButton = _this11.renderRemoveButton(i);
return /*#__PURE__*/React__default["default"].createElement("div", {
key: i,
className: "p-column-filter-constraint"
}, matchModeDropdown, menuFilterElement, /*#__PURE__*/React__default["default"].createElement("div", null, removeButton));
}));
}
}, {
key: "renderAddRule",
value: function renderAddRule() {
if (this.isShowAddConstraint()) {
var addRuleLabel = this.addRuleButtonLabel();
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-column-filter-add-rule"
}, /*#__PURE__*/React__default["default"].createElement(Button, {
type: "button",
label: addRuleLabel,
icon: "pi pi-plus",
className: "p-column-filter-add-button p-button-text p-button-sm",
onClick: this.addConstraint
}));
}
return null;
}
}, {
key: "renderFilterClearButton",
value: function renderFilterClearButton() {
if (this.getColumnProp('showClearButton')) {
if (!this.getColumnProp('filterClear')) {
var clearLabel = this.clearButtonLabel();
return /*#__PURE__*/React__default["default"].createElement(Button, {
type: "button",
className: "p-button-outlined p-button-sm",
onClick: this.clearFilter,
label: clearLabel
});
}
return ObjectUtils.getJSXElement(this.getColumnProp('filterClear'), {
field: this.field,
filterModel: this.filterModel,
filterClearCallback: this.clearFilter
});
}
return null;
}
}, {
key: "renderFilterApplyButton",
value: function renderFilterApplyButton() {
if (this.getColumnProp('showApplyButton')) {
if (!this.getColumnProp('filterApply')) {
var applyLabel = this.applyButtonLabel();
return /*#__PURE__*/React__default["default"].createElement(Button, {
type: "button",
className: "p-button-sm",
onClick: this.applyFilter,
label: applyLabel
});
}
return ObjectUtils.getJSXElement(this.getColumnProp('filterApply'), {
field: this.field,
filterModel: this.filterModel,
filterApplyCallback: this.applyFilter
});
}
return null;
}
}, {
key: "renderButtonBar",
value: function renderButtonBar() {
var clearButton = this.renderFilterClearButton();
var applyButton = this.renderFilterApplyButton();
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-column-filter-buttonbar"
}, clearButton, applyButton);
}
}, {
key: "renderItems",
value: function renderItems() {
var operator = this.renderOperator();
var constraints = this.renderConstraints();
var addRule = this.renderAddRule();
var buttonBar = this.renderButtonBar();
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, operator, constraints, addRule, buttonBar);
}
}, {
key: "renderOverlay",
value: function renderOverlay() {
var style = this.getColumnProp('filterMenuStyle');
var className = classNames('p-column-filter-overlay p-component p-fluid', this.getColumnProp('filterMenuClassName'), {
'p-column-filter-overlay-menu': this.props.display === 'menu',
'p-input-filled': PrimeReact.inputStyle === 'filled',
'p-ripple-disabled': PrimeReact.ripple === false
});
var filterHeader = ObjectUtils.getJSXElement(this.getColumnProp('filterHeader'), {
field: this.field,
filterModel: this.filterModel,
filterApplyCallback: this.filterApplyCallback
});
var filterFooter = ObjectUtils.getJSXElement(this.getColumnProp('filterFooter'), {
field: this.field,
filterModel: this.filterModel,
filterApplyCallback: this.filterApplyCallback
});
var items = this.props.display === 'row' ? this.renderRowItems() : this.renderItems();
return /*#__PURE__*/React__default["default"].createElement(Portal, null, /*#__PURE__*/React__default["default"].createElement(CSSTransition, {
nodeRef: this.overlayRef,
classNames: "p-connected-overlay",
"in": this.state.overlayVisible,
timeout: {
enter: 120,
exit: 100
},
unmountOnExit: true,
onEnter: this.onOverlayEnter,
onExit: this.onOverlayExit,
onExited: this.onOverlayExited
}, /*#__PURE__*/React__default["default"].createElement("div", {
ref: this.overlayRef,
style: style,
className: className,
onKeyDown: this.onContentKeyDown,
onClick: this.onContentClick,
onMouseDown: this.onContentMouseDown
}, filterHeader, items, filterFooter)));
}
}, {
key: "render",
value: function render() {
var className = classNames('p-column-filter p-fluid', {
'p-column-filter-row': this.props.display === 'row',
'p-column-filter-menu': this.props.display === 'menu'
});
var rowFilterElement = this.renderRowFilterElement();
var menuButton = this.renderMenuButton();
var clearButton = this.renderClearButton();
var overlay = this.renderOverlay();
return /*#__PURE__*/React__default["default"].createElement("div", {
className: className
}, rowFilterElement, menuButton, clearButton, overlay);
}
}]);
return ColumnFilter;
}(React.Component);
function ownKeys$u(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$u(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$u(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$u(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createSuper$1s(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1s(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1s() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var HeaderCell = /*#__PURE__*/function (_Component) {
_inherits(HeaderCell, _Component);
var _super = _createSuper$1s(HeaderCell);
function HeaderCell(props) {
var _this;
_classCallCheck(this, HeaderCell);
_this = _super.call(this, props);
_this.state = {
styleObject: {}
};
_this.onClick = _this.onClick.bind(_assertThisInitialized(_this));
_this.onMouseDown = _this.onMouseDown.bind(_assertThisInitialized(_this));
_this.onKeyDown = _this.onKeyDown.bind(_assertThisInitialized(_this)); // drag
_this.onDragStart = _this.onDragStart.bind(_assertThisInitialized(_this));
_this.onDragOver = _this.onDragOver.bind(_assertThisInitialized(_this));
_this.onDragLeave = _this.onDragLeave.bind(_assertThisInitialized(_this));
_this.onDrop = _this.onDrop.bind(_assertThisInitialized(_this)); // resize
_this.onResizerMouseDown = _this.onResizerMouseDown.bind(_assertThisInitialized(_this));
_this.onResizerClick = _this.onResizerClick.bind(_assertThisInitialized(_this));
_this.onResizerDoubleClick = _this.onResizerDoubleClick.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(HeaderCell, [{
key: "isBadgeVisible",
value: function isBadgeVisible() {
return this.props.multiSortMeta && this.props.multiSortMeta.length > 1;
}
}, {
key: "isSortableDisabled",
value: function isSortableDisabled() {
return !this.getColumnProp('sortable') || this.getColumnProp('sortable') && (this.props.allSortableDisabled || this.getColumnProp('sortableDisabled'));
}
}, {
key: "getColumnProp",
value: function getColumnProp() {
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return this.props.column ? typeof args[0] === 'string' ? this.props.column.props[args[0]] : (args[0] || this.props.column).props[args[1]] : null;
}
}, {
key: "getStyle",
value: function getStyle() {
var headerStyle = this.getColumnProp('headerStyle');
var columnStyle = this.getColumnProp('style');
return this.getColumnProp('frozen') ? Object.assign({}, columnStyle, headerStyle, this.state.styleObject) : Object.assign({}, columnStyle, headerStyle);
}
}, {
key: "getMultiSortMetaIndex",
value: function getMultiSortMetaIndex() {
var _this2 = this;
return this.props.multiSortMeta.findIndex(function (meta) {
return meta.field === _this2.getColumnProp('field') || meta.field === _this2.getColumnProp('sortField');
});
}
}, {
key: "getSortMeta",
value: function getSortMeta() {
var sorted = false;
var sortOrder = 0;
var metaIndex = -1;
if (this.props.sortMode === 'single') {
sorted = this.props.sortField && (this.props.sortField === this.getColumnProp('field') || this.props.sortField === this.getColumnProp('sortField'));
sortOrder = sorted ? this.props.sortOrder : 0;
} else if (this.props.sortMode === 'multiple') {
metaIndex = this.getMultiSortMetaIndex();
if (metaIndex > -1) {
sorted = true;
sortOrder = this.props.multiSortMeta[metaIndex].order;
}
}
return {
sorted: sorted,
sortOrder: sortOrder,
metaIndex: metaIndex
};
}
}, {
key: "getAriaSort",
value: function getAriaSort(_ref) {
var sorted = _ref.sorted,
sortOrder = _ref.sortOrder;
if (this.getColumnProp('sortable')) {
var sortIcon = sorted ? sortOrder < 0 ? 'pi-sort-amount-down' : 'pi-sort-amount-up-alt' : 'pi-sort-alt';
if (sortIcon === 'pi-sort-amount-down') return 'descending';else if (sortIcon === 'pi-sort-amount-up-alt') return 'ascending';else return 'none';
}
return null;
}
}, {
key: "updateStickyPosition",
value: function updateStickyPosition() {
if (this.getColumnProp('frozen')) {
var styleObject = _objectSpread$u({}, this.state.styleObject);
var align = this.getColumnProp('alignFrozen');
if (align === 'right') {
var right = 0;
var next = this.el.nextElementSibling;
if (next) {
right = DomHandler.getOuterWidth(next) + parseFloat(next.style.right || 0);
}
styleObject['right'] = right + 'px';
} else {
var left = 0;
var prev = this.el.previousElementSibling;
if (prev) {
left = DomHandler.getOuterWidth(prev) + parseFloat(prev.style.left || 0);
}
styleObject['left'] = left + 'px';
}
var filterRow = this.el.parentElement.nextElementSibling;
if (filterRow) {
var index = DomHandler.index(this.el);
filterRow.children[index].style.left = styleObject['left'];
filterRow.children[index].style.right = styleObject['right'];
}
var isSameStyle = this.state.styleObject['left'] === styleObject['left'] && this.state.styleObject['right'] === styleObject['right'];
!isSameStyle && this.setState({
styleObject: styleObject
});
}
}
}, {
key: "updateSortableDisabled",
value: function updateSortableDisabled(prevColumn) {
if (this.getColumnProp(prevColumn, 'sortableDisabled') !== this.getColumnProp('sortableDisabled') || this.getColumnProp(prevColumn, 'sortable') !== this.getColumnProp('sortable')) {
this.props.onSortableChange();
}
}
}, {
key: "onClick",
value: function onClick(event) {
if (!this.isSortableDisabled()) {
var targetNode = event.target;
if (DomHandler.hasClass(targetNode, 'p-sortable-column') || DomHandler.hasClass(targetNode, 'p-column-title') || DomHandler.hasClass(targetNode, 'p-column-header-content') || DomHandler.hasClass(targetNode, 'p-sortable-column-icon') || DomHandler.hasClass(targetNode.parentElement, 'p-sortable-column-icon')) {
DomHandler.clearSelection();
this.props.onSortChange({
originalEvent: event,
column: this.props.column,
sortableDisabledFields: this.props.sortableDisabledFields
});
}
}
}
}, {
key: "onMouseDown",
value: function onMouseDown(event) {
this.props.onColumnMouseDown({
originalEvent: event,
column: this.props.column
});
}
}, {
key: "onKeyDown",
value: function onKeyDown(event) {
if (event.key === 'Enter' && event.currentTarget === this.el && DomHandler.hasClass(event.currentTarget, 'p-sortable-column')) {
this.onClick(event);
event.preventDefault();
}
}
}, {
key: "onDragStart",
value: function onDragStart(event) {
this.props.onColumnDragStart({
originalEvent: event,
column: this.props.column
});
}
}, {
key: "onDragOver",
value: function onDragOver(event) {
this.props.onColumnDragOver({
originalEvent: event,
column: this.props.column
});
}
}, {
key: "onDragLeave",
value: function onDragLeave(event) {
this.props.onColumnDragLeave({
originalEvent: event,
column: this.props.column
});
}
}, {
key: "onDrop",
value: function onDrop(event) {
this.props.onColumnDrop({
originalEvent: event,
column: this.props.column
});
}
}, {
key: "onResizerMouseDown",
value: function onResizerMouseDown(event) {
this.props.onColumnResizeStart({
originalEvent: event,
column: this.props.column
});
}
}, {
key: "onResizerClick",
value: function onResizerClick(event) {
if (this.props.onColumnResizerClick) {
this.props.onColumnResizerClick({
originalEvent: event,
element: event.currentTarget.parentElement,
column: this.props.column
});
event.preventDefault();
}
}
}, {
key: "onResizerDoubleClick",
value: function onResizerDoubleClick(event) {
if (this.props.onColumnResizerDoubleClick) {
this.props.onColumnResizerDoubleClick({
originalEvent: event,
element: event.currentTarget.parentElement,
column: this.props.column
});
event.preventDefault();
}
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
if (this.getColumnProp('frozen')) {
this.updateStickyPosition();
}
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps) {
if (this.getColumnProp('frozen')) {
this.updateStickyPosition();
}
this.updateSortableDisabled(prevProps.column);
}
}, {
key: "renderResizer",
value: function renderResizer() {
if (this.props.resizableColumns && !this.getColumnProp('frozen')) {
return /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-column-resizer",
onMouseDown: this.onResizerMouseDown,
onClick: this.onResizerClick,
onDoubleClick: this.onResizerDoubleClick
});
}
return null;
}
}, {
key: "renderTitle",
value: function renderTitle() {
var title = ObjectUtils.getJSXElement(this.getColumnProp('header'), {
props: this.props.tableProps
});
return /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-column-title"
}, title);
}
}, {
key: "renderSortIcon",
value: function renderSortIcon(_ref2) {
var sorted = _ref2.sorted,
sortOrder = _ref2.sortOrder;
if (this.getColumnProp('sortable')) {
var sortIcon = sorted ? sortOrder < 0 ? 'pi-sort-amount-down' : 'pi-sort-amount-up-alt' : 'pi-sort-alt';
var className = classNames('p-sortable-column-icon pi pi-fw', sortIcon);
return /*#__PURE__*/React__default["default"].createElement("span", {
className: className
});
}
return null;
}
}, {
key: "renderBadge",
value: function renderBadge(_ref3) {
var metaIndex = _ref3.metaIndex;
if (metaIndex !== -1 && this.isBadgeVisible()) {
var value = this.props.groupRowsBy && this.props.groupRowsBy === this.props.groupRowSortField ? metaIndex : metaIndex + 1;
return /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-sortable-column-badge"
}, value);
}
return null;
}
}, {
key: "renderCheckbox",
value: function renderCheckbox() {
if (this.props.showSelectAll && this.getColumnProp('selectionMode') === 'multiple' && this.props.filterDisplay !== 'row') {
var allRowsSelected = this.props.allRowsSelected(this.props.value);
return /*#__PURE__*/React__default["default"].createElement(HeaderCheckbox, {
checked: allRowsSelected,
onChange: this.props.onColumnCheckboxChange,
disabled: this.props.empty
});
}
return null;
}
}, {
key: "renderFilter",
value: function renderFilter() {
if (this.props.filterDisplay === 'menu' && this.getColumnProp('filter')) {
return /*#__PURE__*/React__default["default"].createElement(ColumnFilter, {
display: "menu",
column: this.props.column,
filters: this.props.filters,
onFilterChange: this.props.onFilterChange,
onFilterApply: this.props.onFilterApply,
filtersStore: this.props.filtersStore
});
}
return null;
}
}, {
key: "renderHeader",
value: function renderHeader(sortMeta) {
var title = this.renderTitle();
var sortIcon = this.renderSortIcon(sortMeta);
var badge = this.renderBadge(sortMeta);
var checkbox = this.renderCheckbox();
var filter = this.renderFilter();
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-column-header-content"
}, title, sortIcon, badge, checkbox, filter);
}
}, {
key: "renderElement",
value: function renderElement() {
var _this3 = this;
var isSortableDisabled = this.isSortableDisabled();
var sortMeta = this.getSortMeta();
var style = this.getStyle();
var align = this.getColumnProp('alignHeader') || this.getColumnProp('align');
var className = classNames(this.getColumnProp('headerClassName'), this.getColumnProp('className'), _defineProperty({
'p-sortable-column': this.getColumnProp('sortable'),
'p-resizable-column': this.props.resizableColumns,
'p-highlight': sortMeta.sorted,
'p-frozen-column': this.getColumnProp('frozen'),
'p-selection-column': this.getColumnProp('selectionMode'),
'p-sortable-disabled': this.getColumnProp('sortable') && isSortableDisabled,
'p-reorderable-column': this.props.reorderableColumns && this.getColumnProp('reorderable')
}, "p-align-".concat(align), !!align));
var tabIndex = this.getColumnProp('sortable') && !isSortableDisabled ? this.props.tabIndex : null;
var colSpan = this.getColumnProp('colSpan');
var rowSpan = this.getColumnProp('rowSpan');
var ariaSort = this.getAriaSort(sortMeta);
var resizer = this.renderResizer();
var header = this.renderHeader(sortMeta);
return /*#__PURE__*/React__default["default"].createElement("th", {
ref: function ref(el) {
return _this3.el = el;
},
style: style,
className: className,
tabIndex: tabIndex,
role: "columnheader",
onClick: this.onClick,
onKeyDown: this.onKeyDown,
onMouseDown: this.onMouseDown,
onDragStart: this.onDragStart,
onDragOver: this.onDragOver,
onDragLeave: this.onDragLeave,
onDrop: this.onDrop,
colSpan: colSpan,
rowSpan: rowSpan,
"aria-sort": ariaSort
}, resizer, header);
}
}, {
key: "render",
value: function render() {
return this.renderElement();
}
}]);
return HeaderCell;
}(React.Component);
function ownKeys$t(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$t(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$t(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$t(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createSuper$1r(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1r(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1r() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var TableHeader = /*#__PURE__*/function (_Component) {
_inherits(TableHeader, _Component);
var _super = _createSuper$1r(TableHeader);
function TableHeader(props) {
var _this;
_classCallCheck(this, TableHeader);
_this = _super.call(this, props);
_this.state = {
sortableDisabledFields: [],
allSortableDisabled: false,
styleObject: {}
};
_this.onSortableChange = _this.onSortableChange.bind(_assertThisInitialized(_this));
_this.onCheckboxChange = _this.onCheckboxChange.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(TableHeader, [{
key: "isSingleSort",
value: function isSingleSort() {
return this.props.sortMode === 'single';
}
}, {
key: "isMultipleSort",
value: function isMultipleSort() {
return this.props.sortMode === 'multiple';
}
}, {
key: "isAllSortableDisabled",
value: function isAllSortableDisabled() {
return this.isSingleSort() && this.state.allSortableDisabled;
}
}, {
key: "isColumnSorted",
value: function isColumnSorted(column) {
return this.props.sortField !== null ? column.props.field === this.props.sortField || column.props.sortField === this.props.sortField : false;
}
}, {
key: "updateSortableDisabled",
value: function updateSortableDisabled() {
var _this2 = this;
if (this.isSingleSort() || this.isMultipleSort() && this.props.onSortChange) {
var sortableDisabledFields = [];
var allSortableDisabled = false;
this.props.columns.forEach(function (column) {
if (column.props.sortableDisabled) {
sortableDisabledFields.push(column.props.sortField || column.props.field);
if (!allSortableDisabled && _this2.isColumnSorted(column)) {
allSortableDisabled = true;
}
}
});
this.setState({
sortableDisabledFields: sortableDisabledFields,
allSortableDisabled: allSortableDisabled
});
}
}
}, {
key: "onSortableChange",
value: function onSortableChange() {
this.updateSortableDisabled();
}
}, {
key: "onCheckboxChange",
value: function onCheckboxChange(e) {
this.props.onColumnCheckboxChange(e, this.props.value);
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
this.updateSortableDisabled();
}
}, {
key: "renderGroupHeaderCells",
value: function renderGroupHeaderCells(row) {
var columns = React__default["default"].Children.toArray(row.props.children);
return this.renderHeaderCells(columns);
}
}, {
key: "renderHeaderCells",
value: function renderHeaderCells(columns) {
var _this3 = this;
return React__default["default"].Children.map(columns, function (col, i) {
var isVisible = col ? !col.props.hidden : true;
var key = col ? col.props.columnKey || col.props.field || i : i;
return isVisible && /*#__PURE__*/React__default["default"].createElement(HeaderCell, {
key: key,
value: _this3.props.value,
tableProps: _this3.props.tableProps,
column: col,
tabIndex: _this3.props.tabIndex,
empty: _this3.props.empty,
resizableColumns: _this3.props.resizableColumns,
groupRowsBy: _this3.props.groupRowsBy,
groupRowSortField: _this3.props.groupRowSortField,
sortMode: _this3.props.sortMode,
sortField: _this3.props.sortField,
sortOrder: _this3.props.sortOrder,
multiSortMeta: _this3.props.multiSortMeta,
allSortableDisabled: _this3.isAllSortableDisabled(),
onSortableChange: _this3.onSortableChange,
sortableDisabledFields: _this3.state.sortableDisabledFields,
filterDisplay: _this3.props.filterDisplay,
filters: _this3.props.filters,
filtersStore: _this3.props.filtersStore,
onFilterChange: _this3.props.onFilterChange,
onFilterApply: _this3.props.onFilterApply,
onColumnMouseDown: _this3.props.onColumnMouseDown,
onColumnDragStart: _this3.props.onColumnDragStart,
onColumnDragOver: _this3.props.onColumnDragOver,
onColumnDragLeave: _this3.props.onColumnDragLeave,
onColumnDrop: _this3.props.onColumnDrop,
onColumnResizeStart: _this3.props.onColumnResizeStart,
onColumnResizerClick: _this3.props.onColumnResizerClick,
onColumnResizerDoubleClick: _this3.props.onColumnResizerDoubleClick,
showSelectAll: _this3.props.showSelectAll,
allRowsSelected: _this3.props.allRowsSelected,
onColumnCheckboxChange: _this3.onCheckboxChange,
reorderableColumns: _this3.props.reorderableColumns,
onSortChange: _this3.props.onSortChange
});
});
}
}, {
key: "renderCheckbox",
value: function renderCheckbox(selectionMode) {
if (this.props.showSelectAll && selectionMode === 'multiple') {
var allRowsSelected = this.props.allRowsSelected(this.props.value);
return /*#__PURE__*/React__default["default"].createElement(HeaderCheckbox, {
checked: allRowsSelected,
onChange: this.onCheckboxChange,
disabled: this.props.empty
});
}
return null;
}
}, {
key: "renderFilter",
value: function renderFilter(column, filter) {
if (filter) {
return /*#__PURE__*/React__default["default"].createElement(ColumnFilter, {
display: "row",
column: column,
filters: this.props.filters,
filtersStore: this.props.filtersStore,
onFilterChange: this.props.onFilterChange,
onFilterApply: this.props.onFilterApply
});
}
return null;
}
}, {
key: "renderFilterCells",
value: function renderFilterCells() {
var _this4 = this;
return React__default["default"].Children.map(this.props.columns, function (col, i) {
var isVisible = !col.props.hidden;
if (isVisible) {
var _col$props = col.props,
filterHeaderStyle = _col$props.filterHeaderStyle,
style = _col$props.style,
filterHeaderClassName = _col$props.filterHeaderClassName,
className = _col$props.className,
frozen = _col$props.frozen,
columnKey = _col$props.columnKey,
field = _col$props.field,
selectionMode = _col$props.selectionMode,
filter = _col$props.filter;
var colStyle = _objectSpread$t(_objectSpread$t({}, filterHeaderStyle || {}), style || {});
var colClassName = classNames('p-filter-column', filterHeaderClassName, className, {
'p-frozen-column': frozen
});
var colKey = columnKey || field || i;
var checkbox = _this4.renderCheckbox(selectionMode);
var filterRow = _this4.renderFilter(col, filter);
return /*#__PURE__*/React__default["default"].createElement("th", {
key: colKey,
style: colStyle,
className: colClassName
}, checkbox, filterRow);
}
return null;
});
}
}, {
key: "renderContent",
value: function renderContent() {
var _this5 = this;
if (this.props.headerColumnGroup) {
var rows = React__default["default"].Children.toArray(this.props.headerColumnGroup.props.children);
return rows.map(function (row, i) {
return /*#__PURE__*/React__default["default"].createElement("tr", {
key: i,
role: "row"
}, _this5.renderGroupHeaderCells(row));
});
} else {
var headerRow = /*#__PURE__*/React__default["default"].createElement("tr", {
role: "row"
}, this.renderHeaderCells(this.props.columns));
var filterRow = this.props.filterDisplay === 'row' && /*#__PURE__*/React__default["default"].createElement("tr", {
role: "row"
}, this.renderFilterCells());
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, headerRow, filterRow);
}
}
}, {
key: "render",
value: function render() {
var content = this.renderContent();
return /*#__PURE__*/React__default["default"].createElement("thead", {
className: "p-datatable-thead"
}, content);
}
}]);
return TableHeader;
}(React.Component);
function ownKeys$s(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$s(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$s(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$s(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createSuper$1q(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1q(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1q() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var DataTable = /*#__PURE__*/function (_Component) {
_inherits(DataTable, _Component);
var _super = _createSuper$1q(DataTable);
function DataTable(props) {
var _this;
_classCallCheck(this, DataTable);
_this = _super.call(this, props);
_this.state = {
d_rows: props.rows,
columnOrder: [],
groupRowsSortMeta: null,
editingMeta: {},
attributeSelector: null
};
if (!_this.props.onPage) {
_this.state.first = props.first;
_this.state.rows = props.rows;
}
if (!_this.props.onSort) {
_this.state.sortField = props.sortField;
_this.state.sortOrder = props.sortOrder;
_this.state.multiSortMeta = props.multiSortMeta;
}
_this.state.d_filters = _this.cloneFilters(props.filters);
if (!_this.props.onFilter) {
_this.state.filters = props.filters;
} // header
_this.onSortChange = _this.onSortChange.bind(_assertThisInitialized(_this));
_this.onFilterChange = _this.onFilterChange.bind(_assertThisInitialized(_this));
_this.onFilterApply = _this.onFilterApply.bind(_assertThisInitialized(_this));
_this.onColumnHeaderMouseDown = _this.onColumnHeaderMouseDown.bind(_assertThisInitialized(_this));
_this.onColumnHeaderDragStart = _this.onColumnHeaderDragStart.bind(_assertThisInitialized(_this));
_this.onColumnHeaderDragOver = _this.onColumnHeaderDragOver.bind(_assertThisInitialized(_this));
_this.onColumnHeaderDragLeave = _this.onColumnHeaderDragLeave.bind(_assertThisInitialized(_this));
_this.onColumnHeaderDrop = _this.onColumnHeaderDrop.bind(_assertThisInitialized(_this));
_this.onColumnResizeStart = _this.onColumnResizeStart.bind(_assertThisInitialized(_this));
_this.onColumnHeaderCheckboxChange = _this.onColumnHeaderCheckboxChange.bind(_assertThisInitialized(_this));
_this.allRowsSelected = _this.allRowsSelected.bind(_assertThisInitialized(_this)); // body
_this.onEditingMetaChange = _this.onEditingMetaChange.bind(_assertThisInitialized(_this)); //paginator
_this.onPageChange = _this.onPageChange.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(DataTable, [{
key: "isCustomStateStorage",
value: function isCustomStateStorage() {
return this.props.stateStorage === 'custom';
}
}, {
key: "isStateful",
value: function isStateful() {
return this.props.stateKey != null || this.isCustomStateStorage();
}
}, {
key: "isVirtualScrollerDisabled",
value: function isVirtualScrollerDisabled() {
return ObjectUtils.isEmpty(this.props.virtualScrollerOptions) || !this.props.scrollable;
}
}, {
key: "isEquals",
value: function isEquals(data1, data2) {
return this.props.compareSelectionBy === 'equals' ? data1 === data2 : ObjectUtils.equals(data1, data2, this.props.dataKey);
}
}, {
key: "hasFilter",
value: function hasFilter() {
return ObjectUtils.isNotEmpty(this.getFilters()) || this.props.globalFilter;
}
}, {
key: "getFirst",
value: function getFirst() {
return this.props.onPage ? this.props.first : this.state.first;
}
}, {
key: "getRows",
value: function getRows() {
return this.props.onPage ? this.props.rows : this.state.rows;
}
}, {
key: "getSortField",
value: function getSortField() {
return this.props.onSort ? this.props.sortField : this.state.sortField;
}
}, {
key: "getSortOrder",
value: function getSortOrder() {
return this.props.onSort ? this.props.sortOrder : this.state.sortOrder;
}
}, {
key: "getMultiSortMeta",
value: function getMultiSortMeta() {
return (this.props.onSort ? this.props.multiSortMeta : this.state.multiSortMeta) || [];
}
}, {
key: "getFilters",
value: function getFilters() {
return this.props.onFilter ? this.props.filters : this.state.filters;
}
}, {
key: "getColumnProp",
value: function getColumnProp(col, prop) {
return col.props[prop];
}
}, {
key: "getColumns",
value: function getColumns(ignoreReorderable) {
var _this2 = this;
var columns = React__default["default"].Children.toArray(this.props.children);
if (!columns) {
return null;
}
if (!ignoreReorderable && this.props.reorderableColumns && this.state.columnOrder) {
var orderedColumns = this.state.columnOrder.reduce(function (arr, columnKey) {
var column = _this2.findColumnByKey(columns, columnKey);
column && arr.push(column);
return arr;
}, []);
return [].concat(_toConsumableArray(orderedColumns), _toConsumableArray(columns.filter(function (col) {
return orderedColumns.indexOf(col) < 0;
})));
}
return columns;
}
}, {
key: "getStorage",
value: function getStorage() {
switch (this.props.stateStorage) {
case 'local':
return window.localStorage;
case 'session':
return window.sessionStorage;
case 'custom':
return null;
default:
throw new Error(this.props.stateStorage + ' is not a valid value for the state storage, supported values are "local", "session" and "custom".');
}
}
}, {
key: "saveState",
value: function saveState() {
var state = {};
if (this.props.paginator) {
state.first = this.getFirst();
state.rows = this.getRows();
}
var sortField = this.getSortField();
if (sortField) {
state.sortField = sortField;
state.sortOrder = this.getSortOrder();
}
var multiSortMeta = this.getMultiSortMeta();
if (multiSortMeta) {
state.multiSortMeta = multiSortMeta;
}
if (this.hasFilter()) {
state.filters = this.getFilters();
}
if (this.props.resizableColumns) {
this.saveColumnWidths(state);
}
if (this.props.reorderableColumns) {
state.columnOrder = this.state.columnOrder;
}
if (this.props.expandedRows) {
state.expandedRows = this.props.expandedRows;
}
if (this.props.selection && this.props.onSelectionChange) {
state.selection = this.props.selection;
}
if (this.isCustomStateStorage()) {
if (this.props.customSaveState) {
this.props.customSaveState(state);
}
} else {
var storage = this.getStorage();
if (ObjectUtils.isNotEmpty(state)) {
storage.setItem(this.props.stateKey, JSON.stringify(state));
}
}
if (this.props.onStateSave) {
this.props.onStateSave(state);
}
}
}, {
key: "clearState",
value: function clearState() {
var storage = this.getStorage();
if (storage && this.props.stateKey) {
storage.removeItem(this.props.stateKey);
}
}
}, {
key: "restoreState",
value: function restoreState(state) {
var restoredState = {};
if (this.isCustomStateStorage()) {
if (this.props.customRestoreState) {
restoredState = this.props.customRestoreState();
}
} else {
var storage = this.getStorage();
var stateString = storage.getItem(this.props.stateKey);
var dateFormat = /\d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}.\d{3}Z/;
var reviver = function reviver(key, value) {
return typeof value === "string" && dateFormat.test(value) ? new Date(value) : value;
};
if (stateString) {
restoredState = JSON.parse(stateString, reviver);
}
}
this._restoreState(restoredState, state);
}
}, {
key: "restoreTableState",
value: function restoreTableState(restoredState) {
var state = this._restoreState(restoredState);
if (ObjectUtils.isNotEmpty(state)) {
this.setState(state);
}
}
}, {
key: "_restoreState",
value: function _restoreState(restoredState) {
var _this3 = this;
var state = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
if (ObjectUtils.isNotEmpty(restoredState)) {
if (this.props.paginator) {
if (this.props.onPage) {
var getOnPageParams = function getOnPageParams(first, rows) {
var totalRecords = _this3.getTotalRecords(_this3.processedData());
var pageCount = Math.ceil(totalRecords / rows) || 1;
var page = Math.floor(first / rows);
return {
first: first,
rows: rows,
page: page,
pageCount: pageCount
};
};
this.props.onPage(this.createEvent(getOnPageParams(restoredState.first, restoredState.rows)));
} else {
state.first = restoredState.first;
state.rows = restoredState.rows;
}
}
if (restoredState.sortField) {
if (this.props.onSort) {
this.props.onSort(this.createEvent({
sortField: restoredState.sortField,
sortOrder: restoredState.sortOrder
}));
} else {
state.sortField = restoredState.sortField;
state.sortOrder = restoredState.sortOrder;
}
}
if (restoredState.multiSortMeta) {
if (this.props.onSort) {
this.props.onSort(this.createEvent({
multiSortMeta: restoredState.multiSortMeta
}));
} else {
state.multiSortMeta = restoredState.multiSortMeta;
}
}
if (restoredState.filters) {
state.d_filters = this.cloneFilters(restoredState.filters);
if (this.props.onFilter) {
this.props.onFilter(this.createEvent({
filters: restoredState.filters
}));
} else {
state.filters = this.cloneFilters(restoredState.filters);
}
}
if (this.props.resizableColumns) {
this.columnWidthsState = restoredState.columnWidths;
this.tableWidthState = restoredState.tableWidth;
}
if (this.props.reorderableColumns) {
state.columnOrder = restoredState.columnOrder;
}
if (restoredState.expandedRows && this.props.onRowToggle) {
this.props.onRowToggle({
data: restoredState.expandedRows
});
}
if (restoredState.selection && this.props.onSelectionChange) {
this.props.onSelectionChange({
value: restoredState.selection
});
}
if (this.props.onStateRestore) {
this.props.onStateRestore(restoredState);
}
}
return state;
}
}, {
key: "saveColumnWidths",
value: function saveColumnWidths(state) {
var widths = [];
var headers = DomHandler.find(this.el, '.p-datatable-thead > tr > th');
headers.forEach(function (header) {
return widths.push(DomHandler.getOuterWidth(header));
});
state.columnWidths = widths.join(',');
if (this.props.columnResizeMode === 'expand') {
state.tableWidth = DomHandler.getOuterWidth(this.table) + 'px';
}
}
}, {
key: "restoreColumnWidths",
value: function restoreColumnWidths() {
var _this4 = this;
if (this.columnWidthsState) {
var widths = this.columnWidthsState.split(',');
if (this.props.columnResizeMode === 'expand' && this.tableWidthState) {
this.table.style.width = this.tableWidthState;
this.table.style.minWidth = this.tableWidthState;
this.el.style.width = this.tableWidthState;
}
if (ObjectUtils.isNotEmpty(widths)) {
this.createStyleElement();
var innerHTML = '';
widths.forEach(function (width, index) {
var style = _this4.props.scrollable ? "flex: 1 1 ".concat(width, "px !important") : "width: ".concat(width, "px !important");
innerHTML += "\n .p-datatable[".concat(_this4.state.attributeSelector, "] .p-datatable-thead > tr > th:nth-child(").concat(index + 1, "),\n .p-datatable[").concat(_this4.state.attributeSelector, "] .p-datatable-tbody > tr > td:nth-child(").concat(index + 1, "),\n .p-datatable[").concat(_this4.state.attributeSelector, "] .p-datatable-tfoot > tr > td:nth-child(").concat(index + 1, ") {\n ").concat(style, "\n }\n ");
});
this.styleElement.innerHTML = innerHTML;
}
}
}
}, {
key: "findParentHeader",
value: function findParentHeader(element) {
if (element.nodeName === 'TH') {
return element;
} else {
var parent = element.parentElement;
while (parent.nodeName !== 'TH') {
parent = parent.parentElement;
if (!parent) break;
}
return parent;
}
}
}, {
key: "getGroupRowSortField",
value: function getGroupRowSortField() {
return this.props.sortMode === 'single' ? this.props.sortField : this.state.groupRowsSortMeta ? this.state.groupRowsSortMeta.field : null;
}
}, {
key: "getSelectableData",
value: function getSelectableData(val) {
var _this5 = this;
if (this.props.showSelectionElement || this.props.isDataSelectable) {
return val.filter(function (data, index) {
var isSelectable = true;
if (_this5.props.showSelectionElement) isSelectable = _this5.props.showSelectionElement({
rowIndex: index,
props: _this5.props
});
if (_this5.props.isDataSelectable && isSelectable) isSelectable = _this5.props.isDataSelectable({
data: data,
index: index
});
return isSelectable;
});
}
return val;
}
}, {
key: "allRowsSelected",
value: function allRowsSelected(processedData) {
var _this6 = this;
if (this.props.onSelectAllChange) {
return this.props.selectAll;
} else {
var data = this.props.selectionPageOnly ? this.dataToRender(processedData) : processedData;
var val = this.props.frozenValue ? [].concat(_toConsumableArray(this.props.frozenValue), _toConsumableArray(data)) : data;
var selectableVal = this.getSelectableData(val);
return selectableVal && this.props.selection && selectableVal.every(function (sv) {
return _this6.props.selection.some(function (s) {
return _this6.isEquals(s, sv);
});
});
}
}
}, {
key: "getSelectionModeInColumn",
value: function getSelectionModeInColumn(columns) {
if (columns) {
var col = columns.find(function (c) {
return !!c.props.selectionMode;
});
return col ? col.props.selectionMode : null;
}
return null;
}
}, {
key: "findColumnByKey",
value: function findColumnByKey(columns, key) {
return ObjectUtils.isNotEmpty(columns) ? columns.find(function (col) {
return col.props.columnKey === key || col.props.field === key;
}) : null;
}
}, {
key: "getTotalRecords",
value: function getTotalRecords(data) {
return this.props.lazy ? this.props.totalRecords : data ? data.length : 0;
}
}, {
key: "onEditingMetaChange",
value: function onEditingMetaChange(e) {
var rowData = e.rowData,
field = e.field,
rowIndex = e.rowIndex,
editing = e.editing;
var editingMeta = _objectSpread$s({}, this.state.editingMeta);
var meta = editingMeta[rowIndex];
if (editing) {
!meta && (meta = editingMeta[rowIndex] = {
data: _objectSpread$s({}, rowData),
fields: []
});
meta['fields'].push(field);
} else if (meta) {
var fields = meta['fields'].filter(function (f) {
return f !== field;
});
!fields.length ? delete editingMeta[rowIndex] : meta['fields'] = fields;
}
this.setState({
editingMeta: editingMeta
});
}
}, {
key: "clearEditingMetaData",
value: function clearEditingMetaData() {
if (this.props.editMode && ObjectUtils.isNotEmpty(this.state.editingMeta)) {
this.setState({
editingMeta: {}
});
}
}
}, {
key: "onColumnResizeStart",
value: function onColumnResizeStart(e) {
var event = e.originalEvent,
column = e.column;
var containerLeft = DomHandler.getOffset(this.el).left;
this.resizeColumn = column;
this.resizeColumnElement = event.currentTarget.parentElement;
this.columnResizing = true;
this.lastResizeHelperX = event.pageX - containerLeft + this.el.scrollLeft;
this.bindColumnResizeEvents();
}
}, {
key: "onColumnResize",
value: function onColumnResize(event) {
var containerLeft = DomHandler.getOffset(this.el).left;
DomHandler.addClass(this.el, 'p-unselectable-text');
this.resizeHelper.style.height = this.el.offsetHeight + 'px';
this.resizeHelper.style.top = 0 + 'px';
this.resizeHelper.style.left = event.pageX - containerLeft + this.el.scrollLeft + 'px';
this.resizeHelper.style.display = 'block';
}
}, {
key: "onColumnResizeEnd",
value: function onColumnResizeEnd() {
var delta = this.resizeHelper.offsetLeft - this.lastResizeHelperX;
var columnWidth = this.resizeColumnElement.offsetWidth;
var newColumnWidth = columnWidth + delta;
var minWidth = this.resizeColumnElement.style.minWidth || 15;
if (columnWidth + delta > parseInt(minWidth, 10)) {
if (this.props.columnResizeMode === 'fit') {
var nextColumn = this.resizeColumnElement.nextElementSibling;
var nextColumnWidth = nextColumn.offsetWidth - delta;
if (newColumnWidth > 15 && nextColumnWidth > 15) {
this.resizeTableCells(newColumnWidth, nextColumnWidth);
}
} else if (this.props.columnResizeMode === 'expand') {
var tableWidth = this.table.offsetWidth + delta + 'px';
this.table.style.width = tableWidth;
this.table.style.minWidth = tableWidth;
this.resizeTableCells(newColumnWidth);
}
if (this.props.onColumnResizeEnd) {
this.props.onColumnResizeEnd({
element: this.resizeColumnElement,
column: this.resizeColumn,
delta: delta
});
}
if (this.isStateful()) {
this.saveState();
}
}
this.resizeHelper.style.display = 'none';
this.resizeColumn = null;
this.resizeColumnElement = null;
DomHandler.removeClass(this.el, 'p-unselectable-text');
this.unbindColumnResizeEvents();
}
}, {
key: "resizeTableCells",
value: function resizeTableCells(newColumnWidth, nextColumnWidth) {
var _this7 = this;
var widths = [];
var colIndex = DomHandler.index(this.resizeColumnElement);
var headers = DomHandler.find(this.table, '.p-datatable-thead > tr > th');
headers.forEach(function (header) {
return widths.push(DomHandler.getOuterWidth(header));
});
this.destroyStyleElement();
this.createStyleElement();
var innerHTML = '';
widths.forEach(function (width, index) {
var colWidth = index === colIndex ? newColumnWidth : nextColumnWidth && index === colIndex + 1 ? nextColumnWidth : width;
var style = _this7.props.scrollable ? "flex: 1 1 ".concat(colWidth, "px !important") : "width: ".concat(colWidth, "px !important");
innerHTML += "\n .p-datatable[".concat(_this7.state.attributeSelector, "] .p-datatable-thead > tr > th:nth-child(").concat(index + 1, "),\n .p-datatable[").concat(_this7.state.attributeSelector, "] .p-datatable-tbody > tr > td:nth-child(").concat(index + 1, "),\n .p-datatable[").concat(_this7.state.attributeSelector, "] .p-datatable-tfoot > tr > td:nth-child(").concat(index + 1, ") {\n ").concat(style, "\n }\n ");
});
this.styleElement.innerHTML = innerHTML;
}
}, {
key: "bindColumnResizeEvents",
value: function bindColumnResizeEvents() {
var _this8 = this;
if (!this.documentColumnResizeListener) {
this.documentColumnResizeListener = document.addEventListener('mousemove', function (event) {
if (_this8.columnResizing) {
_this8.onColumnResize(event);
}
});
}
if (!this.documentColumnResizeEndListener) {
this.documentColumnResizeEndListener = document.addEventListener('mouseup', function () {
if (_this8.columnResizing) {
_this8.columnResizing = false;
_this8.onColumnResizeEnd();
}
});
}
}
}, {
key: "unbindColumnResizeEvents",
value: function unbindColumnResizeEvents() {
if (this.documentColumnResizeListener) {
document.removeEventListener('document', this.documentColumnResizeListener);
this.documentColumnResizeListener = null;
}
if (this.documentColumnResizeEndListener) {
document.removeEventListener('document', this.documentColumnResizeEndListener);
this.documentColumnResizeEndListener = null;
}
}
}, {
key: "onColumnHeaderMouseDown",
value: function onColumnHeaderMouseDown(e) {
DomHandler.clearSelection();
var event = e.originalEvent,
column = e.column;
if (this.props.reorderableColumns && this.getColumnProp(column, 'reorderable') !== false) {
if (event.target.nodeName === 'INPUT' || event.target.nodeName === 'TEXTAREA' || DomHandler.hasClass(event.target, 'p-column-resizer')) event.currentTarget.draggable = false;else event.currentTarget.draggable = true;
}
}
}, {
key: "onColumnHeaderCheckboxChange",
value: function onColumnHeaderCheckboxChange(e, processedData) {
var _this9 = this;
if (this.props.onSelectAllChange) {
this.props.onSelectAllChange(e);
} else {
var originalEvent = e.originalEvent,
checked = e.checked;
var data = this.props.selectionPageOnly ? this.dataToRender(processedData) : processedData;
var selection = this.props.selectionPageOnly && this.props.selection ? this.props.selection.filter(function (s) {
return !data.some(function (d) {
return _this9.isEquals(s, d);
});
}) : [];
if (checked) {
selection = this.props.frozenValue ? [].concat(_toConsumableArray(selection), _toConsumableArray(this.props.frozenValue), _toConsumableArray(data)) : [].concat(_toConsumableArray(selection), _toConsumableArray(data));
selection = this.getSelectableData(selection);
this.props.onAllRowsSelect && this.props.onAllRowsSelect({
originalEvent: originalEvent,
data: selection,
type: 'all'
});
} else {
this.props.onAllRowsUnselect && this.props.onAllRowsUnselect({
originalEvent: originalEvent,
data: selection,
type: 'all'
});
}
if (this.props.onSelectionChange) {
this.props.onSelectionChange({
originalEvent: originalEvent,
value: selection,
type: 'all'
});
}
}
}
}, {
key: "onColumnHeaderDragStart",
value: function onColumnHeaderDragStart(e) {
var event = e.originalEvent,
column = e.column;
if (this.columnResizing) {
event.preventDefault();
return;
}
this.colReorderIconWidth = DomHandler.getHiddenElementOuterWidth(this.reorderIndicatorUp);
this.colReorderIconHeight = DomHandler.getHiddenElementOuterHeight(this.reorderIndicatorUp);
this.draggedColumn = column;
this.draggedColumnElement = this.findParentHeader(event.currentTarget);
event.dataTransfer.setData('text', 'b'); // Firefox requires this to make dragging possible
}
}, {
key: "onColumnHeaderDragOver",
value: function onColumnHeaderDragOver(e) {
var event = e.originalEvent;
var dropHeader = this.findParentHeader(event.currentTarget);
if (this.props.reorderableColumns && this.draggedColumnElement && dropHeader) {
event.preventDefault();
if (this.draggedColumnElement !== dropHeader) {
var containerOffset = DomHandler.getOffset(this.el);
var dropHeaderOffset = DomHandler.getOffset(dropHeader);
var targetLeft = dropHeaderOffset.left - containerOffset.left;
var columnCenter = dropHeaderOffset.left + dropHeader.offsetWidth / 2;
this.reorderIndicatorUp.style.top = dropHeaderOffset.top - containerOffset.top - (this.colReorderIconHeight - 1) + 'px';
this.reorderIndicatorDown.style.top = dropHeaderOffset.top - containerOffset.top + dropHeader.offsetHeight + 'px';
if (event.pageX > columnCenter) {
this.reorderIndicatorUp.style.left = targetLeft + dropHeader.offsetWidth - Math.ceil(this.colReorderIconWidth / 2) + 'px';
this.reorderIndicatorDown.style.left = targetLeft + dropHeader.offsetWidth - Math.ceil(this.colReorderIconWidth / 2) + 'px';
this.dropPosition = 1;
} else {
this.reorderIndicatorUp.style.left = targetLeft - Math.ceil(this.colReorderIconWidth / 2) + 'px';
this.reorderIndicatorDown.style.left = targetLeft - Math.ceil(this.colReorderIconWidth / 2) + 'px';
this.dropPosition = -1;
}
this.reorderIndicatorUp.style.display = 'block';
this.reorderIndicatorDown.style.display = 'block';
}
}
}
}, {
key: "onColumnHeaderDragLeave",
value: function onColumnHeaderDragLeave(e) {
var event = e.originalEvent;
if (this.props.reorderableColumns && this.draggedColumnElement) {
event.preventDefault();
this.reorderIndicatorUp.style.display = 'none';
this.reorderIndicatorDown.style.display = 'none';
}
}
}, {
key: "onColumnHeaderDrop",
value: function onColumnHeaderDrop(e) {
var _this10 = this;
var event = e.originalEvent,
column = e.column;
event.preventDefault();
if (this.draggedColumnElement) {
var dragIndex = DomHandler.index(this.draggedColumnElement);
var dropIndex = DomHandler.index(this.findParentHeader(event.currentTarget));
var allowDrop = dragIndex !== dropIndex;
if (allowDrop && (dropIndex - dragIndex === 1 && this.dropPosition === -1 || dragIndex - dropIndex === 1 && this.dropPosition === 1)) {
allowDrop = false;
}
if (allowDrop) {
var columns = this.getColumns();
var isSameColumn = function isSameColumn(col1, col2) {
return col1.props.columnKey || col2.props.columnKey ? ObjectUtils.equals(col1.props, col2.props, 'columnKey') : ObjectUtils.equals(col1.props, col2.props, 'field');
};
var dragColIndex = columns.findIndex(function (child) {
return isSameColumn(child, _this10.draggedColumn);
});
var dropColIndex = columns.findIndex(function (child) {
return isSameColumn(child, column);
});
if (dropColIndex < dragColIndex && this.dropPosition === 1) {
dropColIndex++;
}
if (dropColIndex > dragColIndex && this.dropPosition === -1) {
dropColIndex--;
}
ObjectUtils.reorderArray(columns, dragColIndex, dropColIndex);
var columnOrder = columns.reduce(function (orders, col) {
orders.push(col.props.columnKey || col.props.field);
return orders;
}, []);
this.setState({
columnOrder: columnOrder
});
if (this.props.onColReorder) {
this.props.onColReorder({
originalEvent: event,
dragIndex: dragColIndex,
dropIndex: dropColIndex,
columns: columns
});
}
}
this.reorderIndicatorUp.style.display = 'none';
this.reorderIndicatorDown.style.display = 'none';
this.draggedColumnElement.draggable = false;
this.draggedColumnElement = null;
this.draggedColumn = null;
this.dropPosition = null;
}
}
}, {
key: "createStyleElement",
value: function createStyleElement() {
this.styleElement = DomHandler.createInlineStyle(PrimeReact.nonce);
}
}, {
key: "createResponsiveStyle",
value: function createResponsiveStyle() {
if (!this.responsiveStyleElement) {
this.responsiveStyleElement = DomHandler.createInlineStyle(PrimeReact.nonce);
var innerHTML = "\n@media screen and (max-width: ".concat(this.props.breakpoint, ") {\n .p-datatable[").concat(this.state.attributeSelector, "] .p-datatable-thead > tr > th,\n .p-datatable[").concat(this.state.attributeSelector, "] .p-datatable-tfoot > tr > td {\n display: none !important;\n }\n\n .p-datatable[").concat(this.state.attributeSelector, "] .p-datatable-tbody > tr > td {\n display: flex;\n width: 100% !important;\n align-items: center;\n justify-content: space-between;\n }\n\n .p-datatable[").concat(this.state.attributeSelector, "] .p-datatable-tbody > tr > td:not(:last-child) {\n border: 0 none;\n }\n\n .p-datatable[").concat(this.state.attributeSelector, "].p-datatable-gridlines .p-datatable-tbody > tr > td:last-child {\n border-top: 0;\n border-right: 0;\n border-left: 0;\n }\n\n .p-datatable[").concat(this.state.attributeSelector, "] .p-datatable-tbody > tr > td > .p-column-title {\n display: block;\n }\n}\n");
this.responsiveStyleElement.innerHTML = innerHTML;
}
}
}, {
key: "destroyResponsiveStyle",
value: function destroyResponsiveStyle() {
this.responsiveStyleElement = DomHandler.removeInlineStyle(this.responsiveStyleElement);
}
}, {
key: "destroyStyleElement",
value: function destroyStyleElement() {
this.styleElement = DomHandler.removeInlineStyle(this.styleElement);
}
}, {
key: "onPageChange",
value: function onPageChange(e) {
this.clearEditingMetaData();
if (this.props.onPage) this.props.onPage(this.createEvent(e));else this.setState({
first: e.first,
rows: e.rows
});
if (this.props.onValueChange) {
this.props.onValueChange(this.processedData());
}
}
}, {
key: "onSortChange",
value: function onSortChange(e) {
this.clearEditingMetaData();
var event = e.originalEvent,
column = e.column,
sortableDisabledFields = e.sortableDisabledFields;
var sortField = column.props.sortField || column.props.field;
var sortOrder = this.props.defaultSortOrder;
var multiSortMeta;
var eventMeta;
this.columnSortable = column.props.sortable;
this.columnSortFunction = column.props.sortFunction;
this.columnField = column.props.sortField;
if (this.props.sortMode === 'multiple') {
var metaKey = event.metaKey || event.ctrlKey;
multiSortMeta = _toConsumableArray(this.getMultiSortMeta());
var sortMeta = multiSortMeta.find(function (sortMeta) {
return sortMeta.field === sortField;
});
sortOrder = sortMeta ? this.getCalculatedSortOrder(sortMeta.order) : sortOrder;
var newMetaData = {
field: sortField,
order: sortOrder
};
if (sortOrder) {
multiSortMeta = metaKey ? multiSortMeta : multiSortMeta.filter(function (meta) {
return sortableDisabledFields.some(function (field) {
return field === meta.field;
});
});
this.addSortMeta(newMetaData, multiSortMeta);
} else if (this.props.removableSort) {
this.removeSortMeta(newMetaData, multiSortMeta);
}
eventMeta = {
multiSortMeta: multiSortMeta
};
} else {
sortOrder = this.getSortField() === sortField ? this.getCalculatedSortOrder(this.getSortOrder()) : sortOrder;
if (this.props.removableSort) {
sortField = sortOrder ? sortField : null;
}
eventMeta = {
sortField: sortField,
sortOrder: sortOrder
};
}
if (this.props.onSort) {
this.props.onSort(this.createEvent(eventMeta));
} else {
eventMeta.first = 0;
this.setState(eventMeta);
}
if (this.props.onValueChange) {
this.props.onValueChange(this.processedData({
sortField: sortField,
sortOrder: sortOrder,
multiSortMeta: multiSortMeta
}));
}
}
}, {
key: "getCalculatedSortOrder",
value: function getCalculatedSortOrder(currentOrder) {
return this.props.removableSort ? this.props.defaultSortOrder === currentOrder ? currentOrder * -1 : 0 : currentOrder * -1;
}
}, {
key: "compareValuesOnSort",
value: function compareValuesOnSort(value1, value2) {
var result = null;
if (value1 == null && value2 != null) result = -1;else if (value1 != null && value2 == null) result = 1;else if (value1 == null && value2 == null) result = 0;else if (typeof value1 === 'string' && typeof value2 === 'string') result = value1.localeCompare(value2, undefined, {
numeric: true
});else result = value1 < value2 ? -1 : value1 > value2 ? 1 : 0;
return result;
}
}, {
key: "addSortMeta",
value: function addSortMeta(meta, multiSortMeta) {
var index = multiSortMeta.findIndex(function (sortMeta) {
return sortMeta.field === meta.field;
});
if (index >= 0) multiSortMeta[index] = meta;else multiSortMeta.push(meta);
}
}, {
key: "removeSortMeta",
value: function removeSortMeta(meta, multiSortMeta) {
var index = multiSortMeta.findIndex(function (sortMeta) {
return sortMeta.field === meta.field;
});
if (index >= 0) {
multiSortMeta.splice(index, 1);
}
multiSortMeta = multiSortMeta.length > 0 ? multiSortMeta : null;
}
}, {
key: "sortSingle",
value: function sortSingle(data, field, order) {
var _this11 = this;
if (this.props.groupRowsBy && this.props.groupRowsBy === this.props.sortField) {
var multiSortMeta = [{
field: this.props.sortField,
order: this.props.sortOrder || this.props.defaultSortOrder
}];
this.props.sortField !== field && multiSortMeta.push({
field: field,
order: order
});
return this.sortMultiple(data, multiSortMeta);
}
var value = _toConsumableArray(data);
if (this.columnSortable && this.columnSortFunction) {
value = this.columnSortFunction({
field: field,
order: order
});
} else {
value.sort(function (data1, data2) {
var value1 = ObjectUtils.resolveFieldData(data1, field);
var value2 = ObjectUtils.resolveFieldData(data2, field);
var result = _this11.compareValuesOnSort(value1, value2);
return order * result;
});
}
return value;
}
}, {
key: "sortMultiple",
value: function sortMultiple(data) {
var _this12 = this;
var multiSortMeta = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
if (this.props.groupRowsBy && (this.groupRowsSortMeta || multiSortMeta.length && this.props.groupRowsBy === multiSortMeta[0].field)) {
var firstSortMeta = multiSortMeta[0];
!this.groupRowsSortMeta && (this.groupRowsSortMeta = firstSortMeta);
if (firstSortMeta.field !== this.groupRowsSortMeta.field) {
multiSortMeta = [this.groupRowsSortMeta].concat(_toConsumableArray(multiSortMeta));
}
}
var value = _toConsumableArray(data);
if (this.columnSortable && this.columnSortFunction) {
var meta = multiSortMeta.find(function (meta) {
return meta.field === _this12.columnField;
});
var field = this.columnField;
var order = meta ? meta.order : this.defaultSortOrder;
value = this.columnSortFunction({
field: field,
order: order
});
} else {
value.sort(function (data1, data2) {
return _this12.multisortField(data1, data2, multiSortMeta, 0);
});
}
return value;
}
}, {
key: "multisortField",
value: function multisortField(data1, data2, multiSortMeta, index) {
var value1 = ObjectUtils.resolveFieldData(data1, multiSortMeta[index].field);
var value2 = ObjectUtils.resolveFieldData(data2, multiSortMeta[index].field);
if (value1 === value2) {
return multiSortMeta.length - 1 > index ? this.multisortField(data1, data2, multiSortMeta, index + 1) : 0;
}
var result = this.compareValuesOnSort(value1, value2);
return multiSortMeta[index].order * result;
}
}, {
key: "onFilterChange",
value: function onFilterChange(filters) {
this.clearEditingMetaData();
this.setState({
d_filters: filters
});
}
}, {
key: "onFilterApply",
value: function onFilterApply() {
var _this13 = this;
clearTimeout(this.filterTimeout);
this.filterTimeout = setTimeout(function () {
var filters = _this13.cloneFilters(_this13.state.d_filters);
if (_this13.props.onFilter) {
_this13.props.onFilter(_this13.createEvent({
filters: filters
}));
} else {
_this13.setState({
first: 0,
filters: filters
});
}
if (_this13.props.onValueChange) {
_this13.props.onValueChange(_this13.processedData({
filters: filters
}));
}
}, this.props.filterDelay);
}
}, {
key: "filterLocal",
value: function filterLocal(data, filters) {
if (!data) return;
filters = filters || {};
var columns = this.getColumns();
var filteredValue = [];
var isGlobalFilter = filters['global'] || this.props.globalFilter;
var globalFilterFieldsArray;
if (isGlobalFilter) {
globalFilterFieldsArray = this.props.globalFilterFields || columns.filter(function (col) {
return !col.props.excludeGlobalFilter;
}).map(function (col) {
return col.props.filterField || col.props.field;
});
}
for (var i = 0; i < data.length; i++) {
var localMatch = true;
var globalMatch = false;
var localFiltered = false;
for (var prop in filters) {
if (Object.prototype.hasOwnProperty.call(filters, prop) && prop !== 'global') {
localFiltered = true;
var filterField = prop;
var filterMeta = filters[filterField];
if (filterMeta.operator) {
for (var j = 0; j < filterMeta.constraints.length; j++) {
var filterConstraint = filterMeta.constraints[j];
localMatch = this.executeLocalFilter(filterField, data[i], filterConstraint, j);
if (filterMeta.operator === FilterOperator.OR && localMatch || filterMeta.operator === FilterOperator.AND && !localMatch) {
break;
}
}
} else {
localMatch = this.executeLocalFilter(filterField, data[i], filterMeta, 0);
}
if (!localMatch) {
break;
}
}
}
if (isGlobalFilter && !globalMatch && globalFilterFieldsArray) {
for (var _j = 0; _j < globalFilterFieldsArray.length; _j++) {
var globalFilterField = globalFilterFieldsArray[_j];
var matchMode = filters['global'] ? filters['global'].matchMode : FilterMatchMode.CONTAINS;
var value = filters['global'] ? filters['global'].value : this.props.globalFilter;
globalMatch = FilterService.filters[matchMode](ObjectUtils.resolveFieldData(data[i], globalFilterField), value, this.props.filterLocale);
if (globalMatch) {
break;
}
}
}
var matches = void 0;
if (isGlobalFilter) {
matches = localFiltered ? localFiltered && localMatch && globalMatch : globalMatch;
} else {
matches = localFiltered && localMatch;
}
if (matches) {
filteredValue.push(data[i]);
}
}
if (filteredValue.length === this.props.value.length) {
filteredValue = data;
}
return filteredValue;
}
}, {
key: "executeLocalFilter",
value: function executeLocalFilter(field, rowData, filterMeta, index) {
var filterValue = filterMeta.value;
var filterMatchMode = filterMeta.matchMode === 'custom' ? "custom_".concat(field) : filterMeta.matchMode || FilterMatchMode.STARTS_WITH;
var dataFieldValue = ObjectUtils.resolveFieldData(rowData, field);
var filterConstraint = FilterService.filters[filterMatchMode];
return filterConstraint(dataFieldValue, filterValue, this.props.filterLocale, index);
}
}, {
key: "cloneFilters",
value: function cloneFilters(filters) {
var _this14 = this;
filters = filters || this.props.filters;
var cloned = {};
if (filters) {
Object.entries(filters).forEach(function (_ref) {
var _ref2 = _slicedToArray(_ref, 2),
prop = _ref2[0],
value = _ref2[1];
cloned[prop] = value.operator ? {
operator: value.operator,
constraints: value.constraints.map(function (constraint) {
return _objectSpread$s({}, constraint);
})
} : _objectSpread$s({}, value);
});
} else {
var columns = this.getColumns();
cloned = columns.reduce(function (_filters, col) {
var field = col.props.filterField || col.props.field;
var filterFunction = col.props.filterFunction;
var dataType = col.props.dataType;
var matchMode = col.props.filterMatchMode || (PrimeReact.filterMatchModeOptions[dataType] ? PrimeReact.filterMatchModeOptions[dataType][0] : FilterMatchMode.STARTS_WITH);
var constraint = {
value: null,
matchMode: matchMode
};
if (filterFunction) {
FilterService.register("custom_".concat(field), function () {
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return filterFunction.apply(void 0, args.concat([{
column: col
}]));
});
}
_filters[field] = _this14.props.filterDisplay === 'menu' ? {
operator: FilterOperator.AND,
constraints: [constraint]
} : constraint;
return _filters;
}, {});
}
return cloned;
}
}, {
key: "filter",
value: function filter(value, field, matchMode) {
var index = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 0;
var filters = _objectSpread$s({}, this.state.d_filters);
var meta = filters[field];
var constraint = meta && meta.operator ? meta.constraints[index] : meta;
constraint = meta ? {
value: value,
matchMode: matchMode || constraint.matchMode
} : {
value: value,
matchMode: matchMode
};
this.props.filterDisplay === 'menu' && meta && meta.operator ? filters[field].constraints[index] = constraint : filters[field] = constraint;
this.setState({
d_filters: filters
}, this.onFilterApply);
}
}, {
key: "reset",
value: function reset() {
var state = {
d_rows: this.props.rows,
d_filters: this.cloneFilters(this.props.filters),
groupRowsSortMeta: null,
editingMeta: {}
};
if (!this.props.onPage) {
state.first = this.props.first;
state.rows = this.props.rows;
}
if (!this.props.onSort) {
state.sortField = this.props.sortField;
state.sortOrder = this.props.sortOrder;
state.multiSortMeta = this.props.multiSortMeta;
}
if (!this.props.onFilter) {
state.filters = this.props.filters;
}
this.resetColumnOrder();
this.setState(state);
}
}, {
key: "resetColumnOrder",
value: function resetColumnOrder() {
var columns = this.getColumns(true);
var columnOrder = [];
if (columns) {
columnOrder = columns.reduce(function (orders, col) {
orders.push(col.props.columnKey || col.props.field);
return orders;
}, []);
}
this.setState({
columnOrder: columnOrder
});
}
}, {
key: "exportCSV",
value: function exportCSV(options) {
var _this15 = this;
var data;
var csv = "\uFEFF";
var columns = this.getColumns();
if (options && options.selectionOnly) {
data = this.props.selection || [];
} else {
data = [].concat(_toConsumableArray(this.props.frozenValue || []), _toConsumableArray(this.processedData() || []));
} //headers
columns.forEach(function (column, i) {
var _column$props = column.props,
field = _column$props.field,
header = _column$props.header,
exportable = _column$props.exportable;
if (exportable && field) {
csv += '"' + (header || field) + '"';
if (i < columns.length - 1) {
csv += _this15.props.csvSeparator;
}
}
}); //body
data.forEach(function (record) {
csv += '\n';
columns.forEach(function (column, i) {
var _column$props2 = column.props,
columnField = _column$props2.field,
exportField = _column$props2.exportField,
exportable = _column$props2.exportable;
var field = exportField || columnField;
if (exportable && field) {
var cellData = ObjectUtils.resolveFieldData(record, field);
if (cellData != null) {
cellData = _this15.props.exportFunction ? _this15.props.exportFunction({
data: cellData,
field: field,
rowData: record,
column: column
}) : String(cellData).replace(/"/g, '""');
} else cellData = '';
csv += '"' + cellData + '"';
if (i < columns.length - 1) {
csv += _this15.props.csvSeparator;
}
}
});
});
DomHandler.exportCSV(csv, this.props.exportFilename);
}
}, {
key: "closeEditingCell",
value: function closeEditingCell() {
if (this.props.editMode !== "row") {
document.body.click();
}
}
}, {
key: "createEvent",
value: function createEvent(event) {
return _objectSpread$s({
first: this.getFirst(),
rows: this.getRows(),
sortField: this.getSortField(),
sortOrder: this.getSortOrder(),
multiSortMeta: this.getMultiSortMeta(),
filters: this.getFilters()
}, event);
}
}, {
key: "processedData",
value: function processedData(localState) {
var data = this.props.value || [];
if (!this.props.lazy) {
if (data && data.length) {
var filters = localState && localState.filters || this.getFilters();
var sortField = localState && localState.sortField || this.getSortField();
var sortOrder = localState && localState.sortOrder || this.getSortOrder();
var multiSortMeta = localState && localState.multiSortMeta || this.getMultiSortMeta();
if (ObjectUtils.isNotEmpty(filters) || this.props.globalFilter) {
data = this.filterLocal(data, filters);
}
if (sortField || ObjectUtils.isNotEmpty(multiSortMeta)) {
if (this.props.sortMode === 'single') data = this.sortSingle(data, sortField, sortOrder);else if (this.props.sortMode === 'multiple') data = this.sortMultiple(data, multiSortMeta);
}
}
}
return data;
}
}, {
key: "dataToRender",
value: function dataToRender(data) {
if (data && this.props.paginator) {
var first = this.props.lazy ? 0 : this.getFirst();
return data.slice(first, first + this.getRows());
}
return data;
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
var _this16 = this;
this.setState({
attributeSelector: UniqueComponentId()
}, function () {
_this16.el.setAttribute(_this16.state.attributeSelector, '');
});
if (this.props.responsiveLayout === 'stack' && !this.props.scrollable) {
this.createResponsiveStyle();
}
if (this.isStateful()) {
this.setState(this.restoreState(this.state));
if (this.props.resizableColumns) {
this.restoreColumnWidths();
}
}
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps, prevState) {
if (this.isStateful()) {
this.saveState();
}
if (prevProps.responsiveLayout !== this.props.responsiveLayout) {
this.destroyResponsiveStyle();
if (this.props.responsiveLayout === 'stack' && !this.props.scrollable) {
this.createResponsiveStyle();
}
}
if (prevProps.filters !== this.props.filters) {
this.setState({
filters: this.cloneFilters(this.props.filters),
d_filters: this.cloneFilters(this.props.filters)
});
}
if (prevProps.globalFilter !== this.props.globalFilter) {
this.filter(this.props.globalFilter, 'global', 'contains');
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
this.unbindColumnResizeEvents();
this.destroyStyleElement();
this.destroyResponsiveStyle();
}
}, {
key: "renderLoader",
value: function renderLoader() {
if (this.props.loading) {
var iconClassName = classNames('p-datatable-loading-icon pi-spin', this.props.loadingIcon);
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-datatable-loading-overlay p-component-overlay"
}, /*#__PURE__*/React__default["default"].createElement("i", {
className: iconClassName
}));
}
return null;
}
}, {
key: "renderHeader",
value: function renderHeader() {
if (this.props.header) {
var content = ObjectUtils.getJSXElement(this.props.header, {
props: this.props
});
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-datatable-header"
}, content);
}
return null;
}
}, {
key: "renderTableHeader",
value: function renderTableHeader(options, empty) {
var sortField = this.getSortField();
var sortOrder = this.getSortOrder();
var multiSortMeta = _toConsumableArray(this.getMultiSortMeta());
var groupRowSortField = this.getGroupRowSortField();
var filters = this.state.d_filters;
var filtersStore = this.getFilters();
var processedData = options.items,
columns = options.columns;
return /*#__PURE__*/React__default["default"].createElement(TableHeader, {
value: processedData,
tableProps: this.props,
columns: columns,
tabIndex: this.props.tabIndex,
empty: empty,
headerColumnGroup: this.props.headerColumnGroup,
resizableColumns: this.props.resizableColumns,
onColumnResizeStart: this.onColumnResizeStart,
onColumnResizerClick: this.props.onColumnResizerClick,
onColumnResizerDoubleClick: this.props.onColumnResizerDoubleClick,
sortMode: this.props.sortMode,
sortField: sortField,
sortOrder: sortOrder,
multiSortMeta: multiSortMeta,
groupRowsBy: this.props.groupRowsBy,
groupRowSortField: groupRowSortField,
onSortChange: this.onSortChange,
filterDisplay: this.props.filterDisplay,
filters: filters,
filtersStore: filtersStore,
onFilterChange: this.onFilterChange,
onFilterApply: this.onFilterApply,
showSelectAll: this.props.showSelectAll,
allRowsSelected: this.allRowsSelected,
onColumnCheckboxChange: this.onColumnHeaderCheckboxChange,
onColumnMouseDown: this.onColumnHeaderMouseDown,
onColumnDragStart: this.onColumnHeaderDragStart,
onColumnDragOver: this.onColumnHeaderDragOver,
onColumnDragLeave: this.onColumnHeaderDragLeave,
onColumnDrop: this.onColumnHeaderDrop,
rowGroupMode: this.props.rowGroupMode,
reorderableColumns: this.props.reorderableColumns
});
}
}, {
key: "renderTableBody",
value: function renderTableBody(options, selectionModeInColumn, empty, isVirtualScrollerDisabled) {
var tableSelector = this.state.attributeSelector;
var first = this.getFirst();
var editingMeta = this.state.editingMeta;
var rows = options.rows,
columns = options.columns,
contentRef = options.contentRef,
className = options.className;
var frozenBody = this.props.frozenValue && /*#__PURE__*/React__default["default"].createElement(TableBody, {
value: this.props.frozenValue,
className: "p-datatable-frozen-tbody",
frozenRow: true,
tableProps: this.props,
tableSelector: tableSelector,
columns: columns,
selectionModeInColumn: selectionModeInColumn,
first: first,
editingMeta: editingMeta,
onEditingMetaChange: this.onEditingMetaChange,
tabIndex: this.props.tabIndex,
onRowClick: this.props.onRowClick,
onRowDoubleClick: this.props.onRowDoubleClick,
onCellClick: this.props.onCellClick,
selection: this.props.selection,
onSelectionChange: this.props.onSelectionChange,
lazy: this.props.lazy,
paginator: this.props.paginator,
onCellSelect: this.props.onCellSelect,
onCellUnselect: this.props.onCellUnselect,
onRowSelect: this.props.onRowSelect,
onRowUnselect: this.props.onRowUnselect,
dragSelection: this.props.dragSelection,
onContextMenu: this.props.onContextMenu,
onContextMenuSelectionChange: this.props.onContextMenuSelectionChange,
metaKeySelection: this.props.metaKeySelection,
selectionMode: this.props.selectionMode,
cellSelection: this.props.cellSelection,
contextMenuSelection: this.props.contextMenuSelection,
dataKey: this.props.dataKey,
expandedRows: this.props.expandedRows,
onRowCollapse: this.props.onRowCollapse,
onRowExpand: this.props.onRowExpand,
onRowToggle: this.props.onRowToggle,
editMode: this.props.editMode,
editingRows: this.props.editingRows,
onRowReorder: this.props.onRowReorder,
scrollable: this.props.scrollable,
rowGroupMode: this.props.rowGroupMode,
groupRowsBy: this.props.groupRowsBy,
expandableRowGroups: this.props.expandableRowGroups,
loading: this.props.loading,
emptyMessage: this.props.emptyMessage,
rowGroupHeaderTemplate: this.props.rowGroupHeaderTemplate,
rowExpansionTemplate: this.props.rowExpansionTemplate,
rowGroupFooterTemplate: this.props.rowGroupFooterTemplate,
onRowEditChange: this.props.onRowEditChange,
compareSelectionBy: this.props.compareSelectionBy,
selectOnEdit: this.props.selectOnEdit,
onRowEditInit: this.props.onRowEditInit,
rowEditValidator: this.props.rowEditValidator,
onRowEditSave: this.props.onRowEditSave,
onRowEditComplete: this.props.onRowEditComplete,
onRowEditCancel: this.props.onRowEditCancel,
cellClassName: this.props.cellClassName,
responsiveLayout: this.props.responsiveLayout,
selectionAutoFocus: this.props.selectionAutoFocus,
isDataSelectable: this.props.isDataSelectable,
showSelectionElement: this.props.showSelectionElement,
showRowReorderElement: this.props.showRowReorderElement,
expandedRowIcon: this.props.expandedRowIcon,
collapsedRowIcon: this.props.collapsedRowIcon,
rowClassName: this.props.rowClassName,
isVirtualScrollerDisabled: true
});
var body = /*#__PURE__*/React__default["default"].createElement(TableBody, {
value: this.dataToRender(rows),
className: className,
empty: empty,
frozenRow: false,
tableProps: this.props,
tableSelector: tableSelector,
columns: columns,
selectionModeInColumn: selectionModeInColumn,
first: first,
editingMeta: editingMeta,
onEditingMetaChange: this.onEditingMetaChange,
tabIndex: this.props.tabIndex,
onRowClick: this.props.onRowClick,
onRowDoubleClick: this.props.onRowDoubleClick,
onCellClick: this.props.onCellClick,
selection: this.props.selection,
onSelectionChange: this.props.onSelectionChange,
lazy: this.props.lazy,
paginator: this.props.paginator,
onCellSelect: this.props.onCellSelect,
onCellUnselect: this.props.onCellUnselect,
onRowSelect: this.props.onRowSelect,
onRowUnselect: this.props.onRowUnselect,
dragSelection: this.props.dragSelection,
onContextMenu: this.props.onContextMenu,
onContextMenuSelectionChange: this.props.onContextMenuSelectionChange,
metaKeySelection: this.props.metaKeySelection,
selectionMode: this.props.selectionMode,
cellSelection: this.props.cellSelection,
contextMenuSelection: this.props.contextMenuSelection,
dataKey: this.props.dataKey,
expandedRows: this.props.expandedRows,
onRowCollapse: this.props.onRowCollapse,
onRowExpand: this.props.onRowExpand,
onRowToggle: this.props.onRowToggle,
editMode: this.props.editMode,
editingRows: this.props.editingRows,
onRowReorder: this.props.onRowReorder,
scrollable: this.props.scrollable,
rowGroupMode: this.props.rowGroupMode,
groupRowsBy: this.props.groupRowsBy,
expandableRowGroups: this.props.expandableRowGroups,
loading: this.props.loading,
emptyMessage: this.props.emptyMessage,
rowGroupHeaderTemplate: this.props.rowGroupHeaderTemplate,
rowExpansionTemplate: this.props.rowExpansionTemplate,
rowGroupFooterTemplate: this.props.rowGroupFooterTemplate,
onRowEditChange: this.props.onRowEditChange,
compareSelectionBy: this.props.compareSelectionBy,
selectOnEdit: this.props.selectOnEdit,
onRowEditInit: this.props.onRowEditInit,
rowEditValidator: this.props.rowEditValidator,
onRowEditSave: this.props.onRowEditSave,
onRowEditComplete: this.props.onRowEditComplete,
onRowEditCancel: this.props.onRowEditCancel,
cellClassName: this.props.cellClassName,
responsiveLayout: this.props.responsiveLayout,
selectionAutoFocus: this.props.selectionAutoFocus,
isDataSelectable: this.props.isDataSelectable,
showSelectionElement: this.props.showSelectionElement,
showRowReorderElement: this.props.showRowReorderElement,
expandedRowIcon: this.props.expandedRowIcon,
collapsedRowIcon: this.props.collapsedRowIcon,
rowClassName: this.props.rowClassName,
virtualScrollerContentRef: contentRef,
virtualScrollerOptions: options,
isVirtualScrollerDisabled: isVirtualScrollerDisabled
});
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, frozenBody, body);
}
}, {
key: "renderTableFooter",
value: function renderTableFooter(options) {
var columns = options.columns;
return /*#__PURE__*/React__default["default"].createElement(TableFooter, {
tableProps: this.props,
columns: columns,
footerColumnGroup: this.props.footerColumnGroup
});
}
}, {
key: "renderContent",
value: function renderContent(processedData, columns, selectionModeInColumn, empty) {
var _this17 = this;
if (!columns) return;
var isVirtualScrollerDisabled = this.isVirtualScrollerDisabled();
var virtualScrollerOptions = this.props.virtualScrollerOptions || {};
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-datatable-wrapper",
style: {
maxHeight: isVirtualScrollerDisabled ? this.props.scrollHeight : null
}
}, /*#__PURE__*/React__default["default"].createElement(VirtualScroller, _extends({}, virtualScrollerOptions, {
items: processedData,
columns: columns,
scrollHeight: this.props.scrollHeight,
disabled: isVirtualScrollerDisabled,
loaderDisabled: true,
showSpacer: false,
contentTemplate: function contentTemplate(options) {
var ref = function ref(el) {
_this17.table = el;
options.spacerRef && options.spacerRef(el);
};
var tableClassName = classNames('p-datatable-table', _this17.props.tableClassName);
var tableHeader = _this17.renderTableHeader(options, empty);
var tableBody = _this17.renderTableBody(options, selectionModeInColumn, empty, isVirtualScrollerDisabled);
var tableFooter = _this17.renderTableFooter(options);
return /*#__PURE__*/React__default["default"].createElement("table", {
ref: ref,
style: _this17.props.tableStyle,
className: tableClassName,
role: "table"
}, tableHeader, tableBody, tableFooter);
}
})));
}
}, {
key: "renderFooter",
value: function renderFooter() {
if (this.props.footer) {
var content = ObjectUtils.getJSXElement(this.props.footer, {
props: this.props
});
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-datatable-footer"
}, content);
}
return null;
}
}, {
key: "renderPaginator",
value: function renderPaginator(position, totalRecords) {
var className = classNames('p-paginator-' + position, this.props.paginatorClassName);
return /*#__PURE__*/React__default["default"].createElement(Paginator, {
first: this.getFirst(),
rows: this.getRows(),
pageLinkSize: this.props.pageLinkSize,
className: className,
onPageChange: this.onPageChange,
template: this.props.paginatorTemplate,
totalRecords: totalRecords,
rowsPerPageOptions: this.props.rowsPerPageOptions,
currentPageReportTemplate: this.props.currentPageReportTemplate,
leftContent: this.props.paginatorLeft,
rightContent: this.props.paginatorRight,
alwaysShow: this.props.alwaysShowPaginator,
dropdownAppendTo: this.props.paginatorDropdownAppendTo
});
}
}, {
key: "renderPaginatorTop",
value: function renderPaginatorTop(totalRecords) {
if (this.props.paginator && this.props.paginatorPosition !== 'bottom') {
return this.renderPaginator('top', totalRecords);
}
return null;
}
}, {
key: "renderPaginatorBottom",
value: function renderPaginatorBottom(totalRecords) {
if (this.props.paginator && this.props.paginatorPosition !== 'top') {
return this.renderPaginator('bottom', totalRecords);
}
return null;
}
}, {
key: "renderResizeHelper",
value: function renderResizeHelper() {
var _this18 = this;
if (this.props.resizableColumns) {
return /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this18.resizeHelper = el;
},
className: "p-column-resizer-helper",
style: {
display: 'none'
}
});
}
return null;
}
}, {
key: "renderReorderIndicators",
value: function renderReorderIndicators() {
var _this19 = this;
if (this.props.reorderableColumns) {
var style = {
position: 'absolute',
display: 'none'
};
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("span", {
ref: function ref(el) {
return _this19.reorderIndicatorUp = el;
},
className: "pi pi-arrow-down p-datatable-reorder-indicator-up",
style: style
}), /*#__PURE__*/React__default["default"].createElement("span", {
ref: function ref(el) {
return _this19.reorderIndicatorDown = el;
},
className: "pi pi-arrow-up p-datatable-reorder-indicator-down",
style: style
}));
}
return null;
}
}, {
key: "render",
value: function render() {
var _this20 = this;
var processedData = this.processedData();
var columns = this.getColumns();
var totalRecords = this.getTotalRecords(processedData);
var empty = ObjectUtils.isEmpty(processedData);
var selectionModeInColumn = this.getSelectionModeInColumn(columns);
var selectable = this.props.selectionMode || selectionModeInColumn;
var className = classNames('p-datatable p-component', {
'p-datatable-hoverable-rows': this.props.rowHover,
'p-datatable-selectable': selectable && !this.props.cellSelection,
'p-datatable-selectable-cell': selectable && this.props.cellSelection,
'p-datatable-auto-layout': this.props.autoLayout,
'p-datatable-resizable': this.props.resizableColumns,
'p-datatable-resizable-fit': this.props.resizableColumns && this.props.columnResizeMode === 'fit',
'p-datatable-scrollable': this.props.scrollable,
'p-datatable-scrollable-vertical': this.props.scrollable && this.props.scrollDirection === 'vertical',
'p-datatable-scrollable-horizontal': this.props.scrollable && this.props.scrollDirection === 'horizontal',
'p-datatable-scrollable-both': this.props.scrollable && this.props.scrollDirection === 'both',
'p-datatable-flex-scrollable': this.props.scrollable && this.props.scrollHeight === 'flex',
'p-datatable-responsive-stack': this.props.responsiveLayout === 'stack',
'p-datatable-responsive-scroll': this.props.responsiveLayout === 'scroll',
'p-datatable-striped': this.props.stripedRows,
'p-datatable-gridlines': this.props.showGridlines,
'p-datatable-grouped-header': this.props.headerColumnGroup != null,
'p-datatable-grouped-footer': this.props.footerColumnGroup != null,
'p-datatable-sm': this.props.size === 'small',
'p-datatable-lg': this.props.size === 'large'
}, this.props.className);
var loader = this.renderLoader();
var header = this.renderHeader();
var paginatorTop = this.renderPaginatorTop(totalRecords);
var content = this.renderContent(processedData, columns, selectionModeInColumn, empty);
var paginatorBottom = this.renderPaginatorBottom(totalRecords);
var footer = this.renderFooter();
var resizeHelper = this.renderResizeHelper();
var reorderIndicators = this.renderReorderIndicators();
return /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this20.el = el;
},
id: this.props.id,
className: className,
style: this.props.style,
"data-scrollselectors": ".p-datatable-wrapper"
}, loader, header, paginatorTop, content, paginatorBottom, footer, resizeHelper, reorderIndicators);
}
}], [{
key: "getDerivedStateFromProps",
value: function getDerivedStateFromProps(nextProps, prevState) {
if (nextProps.rows !== prevState.d_rows && !nextProps.onPage) {
return {
rows: nextProps.rows,
d_rows: nextProps.rows
};
}
return null;
}
}]);
return DataTable;
}(React.Component);
_defineProperty(DataTable, "defaultProps", {
id: null,
value: null,
header: null,
footer: null,
style: null,
className: null,
tableStyle: null,
tableClassName: null,
paginator: false,
paginatorPosition: 'bottom',
alwaysShowPaginator: true,
paginatorClassName: null,
paginatorTemplate: 'FirstPageLink PrevPageLink PageLinks NextPageLink LastPageLink RowsPerPageDropdown',
paginatorLeft: null,
paginatorRight: null,
paginatorDropdownAppendTo: null,
pageLinkSize: 5,
rowsPerPageOptions: null,
currentPageReportTemplate: '({currentPage} of {totalPages})',
first: 0,
rows: null,
totalRecords: null,
lazy: false,
sortField: null,
sortOrder: null,
multiSortMeta: null,
sortMode: 'single',
defaultSortOrder: 1,
removableSort: false,
emptyMessage: null,
selectionMode: null,
dragSelection: false,
cellSelection: false,
selection: null,
onSelectionChange: null,
contextMenuSelection: null,
onContextMenuSelectionChange: null,
compareSelectionBy: 'deepEquals',
dataKey: null,
metaKeySelection: true,
selectOnEdit: true,
selectionPageOnly: false,
selectionAutoFocus: true,
showSelectAll: true,
selectAll: false,
onSelectAllChange: null,
headerColumnGroup: null,
footerColumnGroup: null,
rowExpansionTemplate: null,
expandedRows: null,
onRowToggle: null,
resizableColumns: false,
columnResizeMode: 'fit',
reorderableColumns: false,
filters: null,
globalFilter: null,
filterDelay: 300,
filterLocale: undefined,
scrollable: false,
scrollHeight: null,
scrollDirection: 'vertical',
virtualScrollerOptions: null,
frozenWidth: null,
frozenValue: null,
csvSeparator: ',',
exportFilename: 'download',
rowGroupMode: null,
autoLayout: false,
rowClassName: null,
cellClassName: null,
rowGroupHeaderTemplate: null,
rowGroupFooterTemplate: null,
loading: false,
loadingIcon: 'pi pi-spinner',
tabIndex: 0,
stateKey: null,
stateStorage: 'session',
groupRowsBy: null,
editMode: 'cell',
editingRows: null,
expandableRowGroups: false,
rowHover: false,
showGridlines: false,
stripedRows: false,
size: 'normal',
responsiveLayout: 'stack',
breakpoint: '960px',
filterDisplay: 'menu',
expandedRowIcon: 'pi pi-chevron-down',
collapsedRowIcon: 'pi pi-chevron-right',
onRowEditComplete: null,
globalFilterFields: null,
showSelectionElement: null,
showRowReorderElement: null,
isDataSelectable: null,
onColumnResizeEnd: null,
onColumnResizerClick: null,
onColumnResizerDoubleClick: null,
onSort: null,
onPage: null,
onFilter: null,
onAllRowsSelect: null,
onAllRowsUnselect: null,
onRowClick: null,
onRowDoubleClick: null,
onRowSelect: null,
onRowUnselect: null,
onRowExpand: null,
onRowCollapse: null,
onContextMenu: null,
onColReorder: null,
onCellClick: null,
onCellSelect: null,
onCellUnselect: null,
onRowReorder: null,
onValueChange: null,
rowEditValidator: null,
onRowEditInit: null,
onRowEditSave: null,
onRowEditCancel: null,
onRowEditChange: null,
exportFunction: null,
customSaveState: null,
customRestoreState: null,
onStateSave: null,
onStateRestore: null
});
function _createSuper$1p(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1p(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1p() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var DataViewLayoutOptions = /*#__PURE__*/function (_Component) {
_inherits(DataViewLayoutOptions, _Component);
var _super = _createSuper$1p(DataViewLayoutOptions);
function DataViewLayoutOptions(props) {
var _this;
_classCallCheck(this, DataViewLayoutOptions);
_this = _super.call(this, props);
_this.changeLayout = _this.changeLayout.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(DataViewLayoutOptions, [{
key: "changeLayout",
value: function changeLayout(event, layoutMode) {
this.props.onChange({
originalEvent: event,
value: layoutMode
});
event.preventDefault();
}
}, {
key: "render",
value: function render() {
var _this2 = this;
var className = classNames('p-dataview-layout-options p-selectbutton p-buttonset', this.props.className);
var buttonListClass = classNames('p-button p-button-icon-only', {
'p-highlight': this.props.layout === 'list'
});
var buttonGridClass = classNames('p-button p-button-icon-only', {
'p-highlight': this.props.layout === 'grid'
});
return /*#__PURE__*/React__default["default"].createElement("div", {
id: this.props.id,
style: this.props.style,
className: className
}, /*#__PURE__*/React__default["default"].createElement("button", {
type: "button",
className: buttonListClass,
onClick: function onClick(event) {
return _this2.changeLayout(event, 'list');
}
}, /*#__PURE__*/React__default["default"].createElement("i", {
className: "pi pi-bars"
}), /*#__PURE__*/React__default["default"].createElement(Ripple, null)), /*#__PURE__*/React__default["default"].createElement("button", {
type: "button",
className: buttonGridClass,
onClick: function onClick(event) {
return _this2.changeLayout(event, 'grid');
}
}, /*#__PURE__*/React__default["default"].createElement("i", {
className: "pi pi-th-large"
}), /*#__PURE__*/React__default["default"].createElement(Ripple, null)));
}
}]);
return DataViewLayoutOptions;
}(React.Component);
_defineProperty(DataViewLayoutOptions, "defaultProps", {
id: null,
style: null,
className: null,
layout: null,
onChange: null
});
var DataViewItem = /*#__PURE__*/function (_Component2) {
_inherits(DataViewItem, _Component2);
var _super2 = _createSuper$1p(DataViewItem);
function DataViewItem() {
_classCallCheck(this, DataViewItem);
return _super2.apply(this, arguments);
}
_createClass(DataViewItem, [{
key: "render",
value: function render() {
return this.props.template(this.props.item, this.props.layout);
}
}]);
return DataViewItem;
}(React.Component);
_defineProperty(DataViewItem, "defaultProps", {
template: null,
item: null,
layout: null
});
var DataView = /*#__PURE__*/function (_Component3) {
_inherits(DataView, _Component3);
var _super3 = _createSuper$1p(DataView);
function DataView(props) {
var _this3;
_classCallCheck(this, DataView);
_this3 = _super3.call(this, props);
if (!_this3.props.onPage) {
_this3.state = {
first: _this3.props.first,
rows: _this3.props.rows
};
}
_this3.sortChange = false;
_this3.onPageChange = _this3.onPageChange.bind(_assertThisInitialized(_this3));
return _this3;
}
_createClass(DataView, [{
key: "getItemRenderKey",
value: function getItemRenderKey(value) {
return this.props.dataKey ? ObjectUtils.resolveFieldData(value, this.props.dataKey) : null;
}
}, {
key: "getTotalRecords",
value: function getTotalRecords() {
if (this.props.totalRecords) return this.props.totalRecords;else return this.props.value ? this.props.value.length : 0;
}
}, {
key: "createPaginator",
value: function createPaginator(position) {
var className = classNames('p-paginator-' + position, this.props.paginatorClassName);
var first = this.props.onPage ? this.props.first : this.state.first;
var rows = this.props.onPage ? this.props.rows : this.state.rows;
var totalRecords = this.getTotalRecords();
return /*#__PURE__*/React__default["default"].createElement(Paginator, {
first: first,
rows: rows,
pageLinkSize: this.props.pageLinkSize,
className: className,
onPageChange: this.onPageChange,
template: this.props.paginatorTemplate,
totalRecords: totalRecords,
rowsPerPageOptions: this.props.rowsPerPageOptions,
currentPageReportTemplate: this.props.currentPageReportTemplate,
leftContent: this.props.paginatorLeft,
rightContent: this.props.paginatorRight,
alwaysShow: this.props.alwaysShowPaginator,
dropdownAppendTo: this.props.paginatorDropdownAppendTo
});
}
}, {
key: "onPageChange",
value: function onPageChange(event) {
if (this.props.onPage) {
this.props.onPage(event);
} else {
this.setState({
first: event.first,
rows: event.rows
});
}
}
}, {
key: "isEmpty",
value: function isEmpty() {
return !this.props.value || this.props.value.length === 0;
}
}, {
key: "sort",
value: function sort() {
var _this4 = this;
if (this.props.value) {
var value = _toConsumableArray(this.props.value);
value.sort(function (data1, data2) {
var value1 = ObjectUtils.resolveFieldData(data1, _this4.props.sortField);
var value2 = ObjectUtils.resolveFieldData(data2, _this4.props.sortField);
var result = null;
if (value1 == null && value2 != null) result = -1;else if (value1 != null && value2 == null) result = 1;else if (value1 == null && value2 == null) result = 0;else if (typeof value1 === 'string' && typeof value2 === 'string') result = value1.localeCompare(value2, undefined, {
numeric: true
});else result = value1 < value2 ? -1 : value1 > value2 ? 1 : 0;
return _this4.props.sortOrder * result;
});
return value;
} else {
return null;
}
}
}, {
key: "renderLoader",
value: function renderLoader() {
if (this.props.loading) {
var iconClassName = classNames('p-dataview-loading-icon pi-spin', this.props.loadingIcon);
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-dataview-loading-overlay p-component-overlay"
}, /*#__PURE__*/React__default["default"].createElement("i", {
className: iconClassName
}));
}
return null;
}
}, {
key: "renderTopPaginator",
value: function renderTopPaginator() {
if (this.props.paginator && (this.props.paginatorPosition !== 'bottom' || this.props.paginatorPosition === 'both')) {
return this.createPaginator('top');
}
return null;
}
}, {
key: "renderBottomPaginator",
value: function renderBottomPaginator() {
if (this.props.paginator && (this.props.paginatorPosition !== 'top' || this.props.paginatorPosition === 'both')) {
return this.createPaginator('bottom');
}
return null;
}
}, {
key: "renderEmptyMessage",
value: function renderEmptyMessage() {
if (!this.props.loading) {
var content = this.props.emptyMessage || localeOption('emptyMessage');
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-col-12 col-12 p-dataview-emptymessage"
}, content);
}
return null;
}
}, {
key: "renderHeader",
value: function renderHeader() {
if (this.props.header) {
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-dataview-header"
}, this.props.header);
}
return null;
}
}, {
key: "renderFooter",
value: function renderFooter() {
if (this.props.footer) {
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-dataview-footer"
}, " ", this.props.footer);
}
return null;
}
}, {
key: "renderItems",
value: function renderItems(value) {
var _this5 = this;
if (value && value.length) {
if (this.props.paginator) {
var rows = this.props.onPage ? this.props.rows : this.state.rows;
var first = this.props.lazy ? 0 : this.props.onPage ? this.props.first : this.state.first;
var totalRecords = this.getTotalRecords();
var last = Math.min(rows + first, totalRecords);
var items = [];
for (var i = first; i < last; i++) {
var val = value[i];
val && items.push( /*#__PURE__*/React__default["default"].createElement(DataViewItem, {
key: this.getItemRenderKey(value) || i,
template: this.props.itemTemplate,
layout: this.props.layout,
item: val
}));
}
return items;
} else {
return value.map(function (item, index) {
return /*#__PURE__*/React__default["default"].createElement(DataViewItem, {
key: _this5.getItemRenderKey(item) || index,
template: _this5.props.itemTemplate,
layout: _this5.props.layout,
item: item
});
});
}
} else {
return this.renderEmptyMessage();
}
}
}, {
key: "renderContent",
value: function renderContent(value) {
var items = this.renderItems(value);
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-dataview-content"
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-grid p-nogutter grid grid-nogutter"
}, items));
}
}, {
key: "processData",
value: function processData() {
var data = this.props.value;
if (data && data.length) {
if (this.props.sortField) {
data = this.sort();
}
}
return data;
}
}, {
key: "render",
value: function render() {
var value = this.processData();
var className = classNames('p-dataview p-component', {
'p-dataview-list': this.props.layout === 'list',
'p-dataview-grid': this.props.layout === 'grid',
'p-dataview-loading': this.props.loading
}, this.props.className);
var loader = this.renderLoader();
var topPaginator = this.renderTopPaginator();
var bottomPaginator = this.renderBottomPaginator();
var header = this.renderHeader();
var footer = this.renderFooter();
var content = this.renderContent(value);
return /*#__PURE__*/React__default["default"].createElement("div", {
id: this.props.id,
style: this.props.style,
className: className
}, loader, header, topPaginator, content, bottomPaginator, footer);
}
}]);
return DataView;
}(React.Component);
_defineProperty(DataView, "defaultProps", {
id: null,
header: null,
footer: null,
value: null,
layout: 'list',
dataKey: null,
rows: null,
first: 0,
totalRecords: null,
paginator: false,
paginatorPosition: 'bottom',
alwaysShowPaginator: true,
paginatorClassName: null,
paginatorTemplate: 'FirstPageLink PrevPageLink PageLinks NextPageLink LastPageLink RowsPerPageDropdown',
paginatorLeft: null,
paginatorRight: null,
paginatorDropdownAppendTo: null,
pageLinkSize: 5,
rowsPerPageOptions: null,
currentPageReportTemplate: '({currentPage} of {totalPages})',
emptyMessage: null,
sortField: null,
sortOrder: null,
style: null,
className: null,
lazy: false,
loading: false,
loadingIcon: 'pi pi-spinner',
itemTemplate: null,
onPage: null
});
function _createSuper$1o(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1o(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1o() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var DeferredContent = /*#__PURE__*/function (_Component) {
_inherits(DeferredContent, _Component);
var _super = _createSuper$1o(DeferredContent);
function DeferredContent(props) {
var _this;
_classCallCheck(this, DeferredContent);
_this = _super.call(this, props);
_this.state = {
loaded: false
};
return _this;
}
_createClass(DeferredContent, [{
key: "componentDidMount",
value: function componentDidMount() {
if (!this.state.loaded) {
if (this.shouldLoad()) this.load();else this.bindScrollListener();
}
}
}, {
key: "bindScrollListener",
value: function bindScrollListener() {
var _this2 = this;
this.documentScrollListener = function () {
if (_this2.shouldLoad()) {
_this2.load();
_this2.unbindScrollListener();
}
};
window.addEventListener('scroll', this.documentScrollListener);
}
}, {
key: "unbindScrollListener",
value: function unbindScrollListener() {
if (this.documentScrollListener) {
window.removeEventListener('scroll', this.documentScrollListener);
this.documentScrollListener = null;
}
}
}, {
key: "shouldLoad",
value: function shouldLoad() {
if (this.state.loaded) {
return false;
} else {
var rect = this.container.getBoundingClientRect();
var docElement = document.documentElement;
var winHeight = docElement.clientHeight;
return winHeight >= rect.top;
}
}
}, {
key: "load",
value: function load(event) {
this.setState({
loaded: true
});
if (this.props.onLoad) {
this.props.onLoad(event);
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
this.unbindScrollListener();
}
}, {
key: "render",
value: function render() {
var _this3 = this;
return /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this3.container = el;
}
}, this.state.loaded ? this.props.children : null);
}
}]);
return DeferredContent;
}(React.Component);
_defineProperty(DeferredContent, "defaultProps", {
onload: null
});
function _createSuper$1n(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1n(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1n() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var Divider = /*#__PURE__*/function (_Component) {
_inherits(Divider, _Component);
var _super = _createSuper$1n(Divider);
function Divider() {
_classCallCheck(this, Divider);
return _super.apply(this, arguments);
}
_createClass(Divider, [{
key: "isHorizontal",
get: function get() {
return this.props.layout === 'horizontal';
}
}, {
key: "isVertical",
get: function get() {
return this.props.layout === 'vertical';
}
}, {
key: "render",
value: function render() {
var dividerClassName = classNames("p-divider p-component p-divider-".concat(this.props.layout, " p-divider-").concat(this.props.type), {
'p-divider-left': this.isHorizontal && (!this.props.align || this.props.align === 'left'),
'p-divider-right': this.isHorizontal && this.props.align === 'right',
'p-divider-center': this.isHorizontal && this.props.align === 'center' || this.isVertical && (!this.props.align || this.props.align === 'center'),
'p-divider-top': this.isVertical && this.props.align === 'top',
'p-divider-bottom': this.isVertical && this.props.align === 'bottom'
}, this.props.className);
return /*#__PURE__*/React__default["default"].createElement("div", {
className: dividerClassName,
style: this.props.style,
role: "separator"
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-divider-content"
}, this.props.children));
}
}]);
return Divider;
}(React.Component);
_defineProperty(Divider, "defaultProps", {
align: null,
layout: 'horizontal',
type: 'solid',
style: null,
className: null
});
function ownKeys$r(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$r(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$r(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$r(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createSuper$1m(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1m(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1m() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var Editor = /*#__PURE__*/function (_Component) {
_inherits(Editor, _Component);
var _super = _createSuper$1m(Editor);
function Editor() {
_classCallCheck(this, Editor);
return _super.apply(this, arguments);
}
_createClass(Editor, [{
key: "getQuill",
value: function getQuill() {
return this.quill;
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
var _this = this;
Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require('quill')); }).then(function (module) {
if (module && module["default"] && DomHandler.isExist(_this.editorElement)) {
_this.quill = new module["default"](_this.editorElement, {
modules: _objectSpread$r({
toolbar: _this.props.showHeader ? _this.toolbarElement : false
}, _this.props.modules),
placeholder: _this.props.placeholder,
readOnly: _this.props.readOnly,
theme: _this.props.theme,
formats: _this.props.formats
});
if (_this.props.value) {
_this.quill.setContents(_this.quill.clipboard.convert(_this.props.value));
}
_this.quill.on('text-change', function (delta, source) {
var html = _this.editorElement.children[0].innerHTML;
var text = _this.quill.getText();
if (html === '
') {
html = null;
}
if (_this.props.onTextChange) {
_this.props.onTextChange({
htmlValue: html,
textValue: text,
delta: delta,
source: source
});
}
});
_this.quill.on('selection-change', function (range, oldRange, source) {
if (_this.props.onSelectionChange) {
_this.props.onSelectionChange({
range: range,
oldRange: oldRange,
source: source
});
}
});
}
}).then(function () {
if (_this.quill && _this.quill.getModule('toolbar')) {
_this.props.onLoad && _this.props.onLoad(_this.quill);
}
});
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps) {
if (this.props.value !== prevProps.value && this.quill && !this.quill.hasFocus()) {
if (this.props.value) this.quill.setContents(this.quill.clipboard.convert(this.props.value));else this.quill.setText('');
}
}
}, {
key: "render",
value: function render() {
var _this2 = this;
var containerClass = classNames('p-component p-editor-container', this.props.className);
var toolbarHeader = null;
if (this.props.showHeader === false) {
toolbarHeader = '';
this.toolbarElement = undefined;
} else if (this.props.headerTemplate) {
toolbarHeader = /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this2.toolbarElement = el;
},
className: "p-editor-toolbar"
}, this.props.headerTemplate);
} else {
toolbarHeader = /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this2.toolbarElement = el;
},
className: "p-editor-toolbar"
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: "ql-formats"
}, /*#__PURE__*/React__default["default"].createElement("select", {
className: "ql-header",
defaultValue: "0"
}, /*#__PURE__*/React__default["default"].createElement("option", {
value: "1"
}, "Heading"), /*#__PURE__*/React__default["default"].createElement("option", {
value: "2"
}, "Subheading"), /*#__PURE__*/React__default["default"].createElement("option", {
value: "0"
}, "Normal")), /*#__PURE__*/React__default["default"].createElement("select", {
className: "ql-font"
}, /*#__PURE__*/React__default["default"].createElement("option", null), /*#__PURE__*/React__default["default"].createElement("option", {
value: "serif"
}), /*#__PURE__*/React__default["default"].createElement("option", {
value: "monospace"
}))), /*#__PURE__*/React__default["default"].createElement("span", {
className: "ql-formats"
}, /*#__PURE__*/React__default["default"].createElement("button", {
type: "button",
className: "ql-bold",
"aria-label": "Bold"
}), /*#__PURE__*/React__default["default"].createElement("button", {
type: "button",
className: "ql-italic",
"aria-label": "Italic"
}), /*#__PURE__*/React__default["default"].createElement("button", {
type: "button",
className: "ql-underline",
"aria-label": "Underline"
})), /*#__PURE__*/React__default["default"].createElement("span", {
className: "ql-formats"
}, /*#__PURE__*/React__default["default"].createElement("select", {
className: "ql-color"
}), /*#__PURE__*/React__default["default"].createElement("select", {
className: "ql-background"
})), /*#__PURE__*/React__default["default"].createElement("span", {
className: "ql-formats"
}, /*#__PURE__*/React__default["default"].createElement("button", {
type: "button",
className: "ql-list",
value: "ordered",
"aria-label": "Ordered List"
}), /*#__PURE__*/React__default["default"].createElement("button", {
type: "button",
className: "ql-list",
value: "bullet",
"aria-label": "Unordered List"
}), /*#__PURE__*/React__default["default"].createElement("select", {
className: "ql-align"
}, /*#__PURE__*/React__default["default"].createElement("option", {
defaultValue: true
}), /*#__PURE__*/React__default["default"].createElement("option", {
value: "center"
}), /*#__PURE__*/React__default["default"].createElement("option", {
value: "right"
}), /*#__PURE__*/React__default["default"].createElement("option", {
value: "justify"
}))), /*#__PURE__*/React__default["default"].createElement("span", {
className: "ql-formats"
}, /*#__PURE__*/React__default["default"].createElement("button", {
type: "button",
className: "ql-link",
"aria-label": "Insert Link"
}), /*#__PURE__*/React__default["default"].createElement("button", {
type: "button",
className: "ql-image",
"aria-label": "Insert Image"
}), /*#__PURE__*/React__default["default"].createElement("button", {
type: "button",
className: "ql-code-block",
"aria-label": "Insert Code Block"
})), /*#__PURE__*/React__default["default"].createElement("span", {
className: "ql-formats"
}, /*#__PURE__*/React__default["default"].createElement("button", {
type: "button",
className: "ql-clean",
"aria-label": "Remove Styles"
})));
}
var content = /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this2.editorElement = el;
},
className: "p-editor-content",
style: this.props.style
});
return /*#__PURE__*/React__default["default"].createElement("div", {
id: this.props.id,
className: containerClass
}, toolbarHeader, content);
}
}]);
return Editor;
}(React.Component);
_defineProperty(Editor, "defaultProps", {
id: null,
value: null,
style: null,
className: null,
placeholder: null,
readOnly: false,
modules: null,
formats: null,
theme: 'snow',
showHeader: true,
headerTemplate: null,
onTextChange: null,
onSelectionChange: null,
onLoad: null
});
function ownKeys$q(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$q(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$q(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$q(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createSuper$1l(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1l(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1l() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var Fieldset = /*#__PURE__*/function (_Component) {
_inherits(Fieldset, _Component);
var _super = _createSuper$1l(Fieldset);
function Fieldset(props) {
var _this;
_classCallCheck(this, Fieldset);
_this = _super.call(this, props);
var state = {
id: props.id
};
if (!_this.props.onToggle) {
state = _objectSpread$q(_objectSpread$q({}, state), {}, {
collapsed: props.collapsed
});
}
_this.state = state;
_this.toggle = _this.toggle.bind(_assertThisInitialized(_this));
_this.contentRef = /*#__PURE__*/React__default["default"].createRef();
return _this;
}
_createClass(Fieldset, [{
key: "toggle",
value: function toggle(event) {
if (this.props.toggleable) {
var collapsed = this.props.onToggle ? this.props.collapsed : this.state.collapsed;
if (collapsed) this.expand(event);else this.collapse(event);
if (this.props.onToggle) {
this.props.onToggle({
originalEvent: event,
value: !collapsed
});
}
}
event.preventDefault();
}
}, {
key: "expand",
value: function expand(event) {
if (!this.props.onToggle) {
this.setState({
collapsed: false
});
}
if (this.props.onExpand) {
this.props.onExpand(event);
}
}
}, {
key: "collapse",
value: function collapse(event) {
if (!this.props.onToggle) {
this.setState({
collapsed: true
});
}
if (this.props.onCollapse) {
this.props.onCollapse(event);
}
}
}, {
key: "isCollapsed",
value: function isCollapsed() {
return this.props.toggleable ? this.props.onToggle ? this.props.collapsed : this.state.collapsed : false;
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
if (!this.state.id) {
this.setState({
id: UniqueComponentId()
});
}
}
}, {
key: "renderContent",
value: function renderContent(collapsed) {
var id = this.state.id + '_content';
return /*#__PURE__*/React__default["default"].createElement(CSSTransition, {
nodeRef: this.contentRef,
classNames: "p-toggleable-content",
timeout: {
enter: 1000,
exit: 450
},
"in": !collapsed,
unmountOnExit: true,
options: this.props.transitionOptions
}, /*#__PURE__*/React__default["default"].createElement("div", {
ref: this.contentRef,
id: id,
className: "p-toggleable-content",
"aria-hidden": collapsed,
role: "region",
"aria-labelledby": this.state.id + '_header'
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-fieldset-content"
}, this.props.children)));
}
}, {
key: "renderToggleIcon",
value: function renderToggleIcon(collapsed) {
if (this.props.toggleable) {
var className = classNames('p-fieldset-toggler pi', {
'pi-plus': collapsed,
'pi-minus': !collapsed
});
return /*#__PURE__*/React__default["default"].createElement("span", {
className: className
});
}
return null;
}
}, {
key: "renderLegendContent",
value: function renderLegendContent(collapsed) {
if (this.props.toggleable) {
var toggleIcon = this.renderToggleIcon(collapsed);
var ariaControls = this.state.id + '_content';
return /*#__PURE__*/React__default["default"].createElement("a", {
href: '#' + ariaControls,
"aria-controls": ariaControls,
id: this.state.id + '_header',
"aria-expanded": !collapsed,
tabIndex: this.props.toggleable ? null : -1
}, toggleIcon, /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-fieldset-legend-text"
}, this.props.legend), /*#__PURE__*/React__default["default"].createElement(Ripple, null));
}
return /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-fieldset-legend-text",
id: this.state.id + '_header'
}, this.props.legend);
}
}, {
key: "renderLegend",
value: function renderLegend(collapsed) {
var legendContent = this.renderLegendContent(collapsed);
if (this.props.legend != null || this.props.toggleable) {
return /*#__PURE__*/React__default["default"].createElement("legend", {
className: "p-fieldset-legend p-unselectable-text",
onClick: this.toggle
}, legendContent);
}
}
}, {
key: "render",
value: function render() {
var className = classNames('p-fieldset p-component', this.props.className, {
'p-fieldset-toggleable': this.props.toggleable
});
var collapsed = this.isCollapsed();
var legend = this.renderLegend(collapsed);
var content = this.renderContent(collapsed);
return /*#__PURE__*/React__default["default"].createElement("fieldset", {
id: this.props.id,
className: className,
style: this.props.style,
onClick: this.props.onClick
}, legend, content);
}
}]);
return Fieldset;
}(React.Component);
_defineProperty(Fieldset, "defaultProps", {
id: null,
legend: null,
className: null,
style: null,
toggleable: null,
collapsed: null,
transitionOptions: null,
onExpand: null,
onCollapse: null,
onToggle: null,
onClick: null
});
function _createSuper$1k(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1k(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1k() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var UIMessageComponent = /*#__PURE__*/function (_Component) {
_inherits(UIMessageComponent, _Component);
var _super = _createSuper$1k(UIMessageComponent);
function UIMessageComponent(props) {
var _this;
_classCallCheck(this, UIMessageComponent);
_this = _super.call(this, props);
_this.onClick = _this.onClick.bind(_assertThisInitialized(_this));
_this.onClose = _this.onClose.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(UIMessageComponent, [{
key: "componentDidMount",
value: function componentDidMount() {
var _this2 = this;
if (!this.props.message.sticky) {
this.timeout = setTimeout(function () {
_this2.onClose(null);
}, this.props.message.life || 3000);
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
if (this.timeout) {
clearTimeout(this.timeout);
}
}
}, {
key: "onClose",
value: function onClose(event) {
if (this.timeout) {
clearTimeout(this.timeout);
}
if (this.props.onClose) {
this.props.onClose(this.props.message);
}
if (event) {
event.preventDefault();
event.stopPropagation();
}
}
}, {
key: "onClick",
value: function onClick() {
if (this.props.onClick) {
this.props.onClick(this.props.message);
}
}
}, {
key: "renderCloseIcon",
value: function renderCloseIcon() {
if (this.props.message.closable !== false) {
return /*#__PURE__*/React__default["default"].createElement("button", {
type: "button",
className: "p-message-close p-link",
onClick: this.onClose
}, /*#__PURE__*/React__default["default"].createElement("i", {
className: "p-message-close-icon pi pi-times"
}), /*#__PURE__*/React__default["default"].createElement(Ripple, null));
}
return null;
}
}, {
key: "renderMessage",
value: function renderMessage() {
if (this.props.message) {
var _this$props$message = this.props.message,
severity = _this$props$message.severity,
content = _this$props$message.content,
summary = _this$props$message.summary,
detail = _this$props$message.detail;
var icon = classNames('p-message-icon pi ', {
'pi-info-circle': severity === 'info',
'pi-check': severity === 'success',
'pi-exclamation-triangle': severity === 'warn',
'pi-times-circle': severity === 'error'
});
return content || /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("span", {
className: icon
}), /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-message-summary"
}, summary), /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-message-detail"
}, detail));
}
return null;
}
}, {
key: "render",
value: function render() {
var severity = this.props.message.severity;
var className = 'p-message p-component p-message-' + severity;
var closeIcon = this.renderCloseIcon();
var message = this.renderMessage();
return /*#__PURE__*/React__default["default"].createElement("div", {
ref: this.props.forwardRef,
className: className,
onClick: this.onClick
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-message-wrapper"
}, message, closeIcon));
}
}]);
return UIMessageComponent;
}(React.Component);
_defineProperty(UIMessageComponent, "defaultProps", {
message: null,
onClose: null,
onClick: null
});
var UIMessage = /*#__PURE__*/React__default["default"].forwardRef(function (props, ref) {
return /*#__PURE__*/React__default["default"].createElement(UIMessageComponent, _extends({
forwardRef: ref
}, props));
});
function _createSuper$1j(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1j(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1j() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var messageIdx$1 = 0;
var Messages = /*#__PURE__*/function (_Component) {
_inherits(Messages, _Component);
var _super = _createSuper$1j(Messages);
function Messages(props) {
var _this;
_classCallCheck(this, Messages);
_this = _super.call(this, props);
_this.state = {
messages: []
};
_this.onClose = _this.onClose.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(Messages, [{
key: "show",
value: function show(value) {
if (value) {
var newMessages = [];
if (Array.isArray(value)) {
for (var i = 0; i < value.length; i++) {
value[i].id = messageIdx$1++;
newMessages = [].concat(_toConsumableArray(this.state.messages), _toConsumableArray(value));
}
} else {
value.id = messageIdx$1++;
newMessages = this.state.messages ? [].concat(_toConsumableArray(this.state.messages), [value]) : [value];
}
this.setState({
messages: newMessages
});
}
}
}, {
key: "clear",
value: function clear() {
this.setState({
messages: []
});
}
}, {
key: "replace",
value: function replace(value) {
var _this2 = this;
this.setState({
messages: []
}, function () {
return _this2.show(value);
});
}
}, {
key: "onClose",
value: function onClose(message) {
var newMessages = this.state.messages.filter(function (msg) {
return msg.id !== message.id;
});
this.setState({
messages: newMessages
});
if (this.props.onRemove) {
this.props.onRemove(message);
}
}
}, {
key: "render",
value: function render() {
var _this3 = this;
return /*#__PURE__*/React__default["default"].createElement("div", {
id: this.props.id,
className: this.props.className,
style: this.props.style
}, /*#__PURE__*/React__default["default"].createElement(reactTransitionGroup.TransitionGroup, null, this.state.messages.map(function (message) {
var messageRef = /*#__PURE__*/React__default["default"].createRef();
return /*#__PURE__*/React__default["default"].createElement(CSSTransition, {
nodeRef: messageRef,
key: message.id,
classNames: "p-message",
unmountOnExit: true,
timeout: {
enter: 300,
exit: 300
},
options: _this3.props.transitionOptions
}, /*#__PURE__*/React__default["default"].createElement(UIMessage, {
ref: messageRef,
message: message,
onClick: _this3.props.onClick,
onClose: _this3.onClose
}));
})));
}
}]);
return Messages;
}(React.Component);
_defineProperty(Messages, "defaultProps", {
id: null,
className: null,
style: null,
transitionOptions: null,
onRemove: null,
onClick: null
});
function _createSuper$1i(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1i(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1i() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var ProgressBar = /*#__PURE__*/function (_Component) {
_inherits(ProgressBar, _Component);
var _super = _createSuper$1i(ProgressBar);
function ProgressBar() {
_classCallCheck(this, ProgressBar);
return _super.apply(this, arguments);
}
_createClass(ProgressBar, [{
key: "renderLabel",
value: function renderLabel() {
if (this.props.showValue && this.props.value != null) {
var label = this.props.displayValueTemplate ? this.props.displayValueTemplate(this.props.value) : this.props.value + this.props.unit;
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-progressbar-label"
}, label);
}
return null;
}
}, {
key: "renderDeterminate",
value: function renderDeterminate() {
var className = classNames('p-progressbar p-component p-progressbar-determinate', this.props.className);
var label = this.renderLabel();
return /*#__PURE__*/React__default["default"].createElement("div", {
role: "progressbar",
id: this.props.id,
className: className,
style: this.props.style,
"aria-valuemin": "0",
"aria-valuenow": this.props.value,
"aria-valuemax": "100",
"aria-label": this.props.value
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-progressbar-value p-progressbar-value-animate",
style: {
width: this.props.value + '%',
display: 'block',
backgroundColor: this.props.color
}
}), label);
}
}, {
key: "renderIndeterminate",
value: function renderIndeterminate() {
var className = classNames('p-progressbar p-component p-progressbar-indeterminate', this.props.className);
return /*#__PURE__*/React__default["default"].createElement("div", {
role: "progressbar",
id: this.props.id,
className: className,
style: this.props.style
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-progressbar-indeterminate-container"
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-progressbar-value p-progressbar-value-animate",
style: {
backgroundColor: this.props.color
}
})));
}
}, {
key: "render",
value: function render() {
if (this.props.mode === 'determinate') return this.renderDeterminate();else if (this.props.mode === 'indeterminate') return this.renderIndeterminate();else throw new Error(this.props.mode + " is not a valid mode for the ProgressBar. Valid values are 'determinate' and 'indeterminate'");
}
}]);
return ProgressBar;
}(React.Component);
_defineProperty(ProgressBar, "defaultProps", {
id: null,
value: null,
showValue: true,
unit: '%',
style: null,
className: null,
mode: 'determinate',
displayValueTemplate: null,
color: null
});
function _createForOfIteratorHelper$b(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray$b(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it["return"] != null) it["return"](); } finally { if (didErr) throw err; } } }; }
function _unsupportedIterableToArray$b(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray$b(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray$b(o, minLen); }
function _arrayLikeToArray$b(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
function _createSuper$1h(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1h(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1h() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var FileUpload = /*#__PURE__*/function (_Component) {
_inherits(FileUpload, _Component);
var _super = _createSuper$1h(FileUpload);
function FileUpload(props) {
var _this;
_classCallCheck(this, FileUpload);
_this = _super.call(this, props);
_this.state = {
files: [],
msgs: [],
focused: false,
progress: 0
};
_this.choose = _this.choose.bind(_assertThisInitialized(_this));
_this.upload = _this.upload.bind(_assertThisInitialized(_this));
_this.clear = _this.clear.bind(_assertThisInitialized(_this));
_this.onFileSelect = _this.onFileSelect.bind(_assertThisInitialized(_this));
_this.onDragEnter = _this.onDragEnter.bind(_assertThisInitialized(_this));
_this.onDragOver = _this.onDragOver.bind(_assertThisInitialized(_this));
_this.onDragLeave = _this.onDragLeave.bind(_assertThisInitialized(_this));
_this.onDrop = _this.onDrop.bind(_assertThisInitialized(_this));
_this.onKeyDown = _this.onKeyDown.bind(_assertThisInitialized(_this));
_this.onFocus = _this.onFocus.bind(_assertThisInitialized(_this));
_this.onBlur = _this.onBlur.bind(_assertThisInitialized(_this));
_this.onSimpleUploaderClick = _this.onSimpleUploaderClick.bind(_assertThisInitialized(_this));
_this.duplicateIEEvent = false;
return _this;
}
_createClass(FileUpload, [{
key: "hasFiles",
value: function hasFiles() {
return this.state.files && this.state.files.length > 0;
}
}, {
key: "isImage",
value: function isImage(file) {
return /^image\//.test(file.type);
}
}, {
key: "chooseDisabled",
value: function chooseDisabled() {
return this.props.disabled || this.props.fileLimit && this.props.fileLimit <= this.state.files.length + this.uploadedFileCount;
}
}, {
key: "uploadDisabled",
value: function uploadDisabled() {
return this.props.disabled || !this.hasFiles();
}
}, {
key: "cancelDisabled",
value: function cancelDisabled() {
return this.props.disabled || !this.hasFiles();
}
}, {
key: "chooseButtonLabel",
value: function chooseButtonLabel() {
return this.props.chooseLabel || this.props.chooseOptions.label || localeOption('choose');
}
}, {
key: "uploadButtonLabel",
value: function uploadButtonLabel() {
return this.props.uploadLabel || this.props.uploadOptions.label || localeOption('upload');
}
}, {
key: "cancelButtonLabel",
value: function cancelButtonLabel() {
return this.props.cancelLabel || this.props.cancelOptions.label || localeOption('cancel');
}
}, {
key: "remove",
value: function remove(event, index) {
this.clearInputElement();
var currentFiles = _toConsumableArray(this.state.files);
var removedFile = this.state.files[index];
currentFiles.splice(index, 1);
this.setState({
files: currentFiles
});
if (this.props.onRemove) {
this.props.onRemove({
originalEvent: event,
file: removedFile
});
}
}
}, {
key: "clearInputElement",
value: function clearInputElement() {
if (this.fileInput) {
this.fileInput.value = '';
}
}
}, {
key: "clearIEInput",
value: function clearIEInput() {
if (this.fileInput) {
this.duplicateIEEvent = true; //IE11 fix to prevent onFileChange trigger again
this.fileInput.value = '';
}
}
}, {
key: "formatSize",
value: function formatSize(bytes) {
if (bytes === 0) {
return '0 B';
}
var k = 1000,
dm = 3,
sizes = ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'],
i = Math.floor(Math.log(bytes) / Math.log(k));
return parseFloat((bytes / Math.pow(k, i)).toFixed(dm)) + ' ' + sizes[i];
}
}, {
key: "onFileSelect",
value: function onFileSelect(event) {
var _this2 = this;
if (event.type !== 'drop' && this.isIE11() && this.duplicateIEEvent) {
this.duplicateIEEvent = false;
return;
}
this.setState({
msgs: []
});
this.files = this.state.files ? _toConsumableArray(this.state.files) : [];
var files = event.dataTransfer ? event.dataTransfer.files : event.target.files;
for (var i = 0; i < files.length; i++) {
var file = files[i];
if (!this.isFileSelected(file)) {
if (this.validate(file)) {
if (this.isImage(file)) {
file.objectURL = window.URL.createObjectURL(file);
}
this.files.push(file);
}
}
}
this.setState({
files: this.files
}, function () {
if (_this2.hasFiles() && _this2.props.auto) {
_this2.upload();
}
});
if (this.props.onSelect) {
this.props.onSelect({
originalEvent: event,
files: files
});
}
if (event.type !== 'drop' && this.isIE11()) {
this.clearIEInput();
} else {
this.clearInputElement();
}
if (this.props.mode === 'basic' && this.files.length > 0) {
this.fileInput.style.display = 'none';
}
}
}, {
key: "isFileSelected",
value: function isFileSelected(file) {
var _iterator = _createForOfIteratorHelper$b(this.state.files),
_step;
try {
for (_iterator.s(); !(_step = _iterator.n()).done;) {
var sFile = _step.value;
if (sFile.name + sFile.type + sFile.size === file.name + file.type + file.size) return true;
}
} catch (err) {
_iterator.e(err);
} finally {
_iterator.f();
}
return false;
}
}, {
key: "isIE11",
value: function isIE11() {
return !!window['MSInputMethodContext'] && !!document['documentMode'];
}
}, {
key: "validate",
value: function validate(file) {
if (this.props.maxFileSize && file.size > this.props.maxFileSize) {
var message = {
severity: 'error',
summary: this.props.invalidFileSizeMessageSummary.replace('{0}', file.name),
detail: this.props.invalidFileSizeMessageDetail.replace('{0}', this.formatSize(this.props.maxFileSize))
};
if (this.props.mode === 'advanced') {
this.messagesUI.show(message);
}
if (this.props.onValidationFail) {
this.props.onValidationFail(file);
}
return false;
}
return true;
}
}, {
key: "upload",
value: function upload() {
var _this3 = this;
if (this.props.customUpload) {
if (this.props.fileLimit) {
this.uploadedFileCount += this.state.files.length;
}
if (this.props.uploadHandler) {
this.props.uploadHandler({
files: this.state.files,
options: {
clear: this.clear,
props: this.props
}
});
}
} else {
this.setState({
msgs: []
});
var xhr = new XMLHttpRequest();
var formData = new FormData();
if (this.props.onBeforeUpload) {
this.props.onBeforeUpload({
'xhr': xhr,
'formData': formData
});
}
var _iterator2 = _createForOfIteratorHelper$b(this.state.files),
_step2;
try {
for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
var file = _step2.value;
formData.append(this.props.name, file, file.name);
}
} catch (err) {
_iterator2.e(err);
} finally {
_iterator2.f();
}
xhr.upload.addEventListener('progress', function (event) {
if (event.lengthComputable) {
_this3.setState({
progress: Math.round(event.loaded * 100 / event.total)
}, function () {
if (_this3.props.onProgress) {
_this3.props.onProgress({
originalEvent: event,
progress: _this3.state.progress
});
}
});
}
});
xhr.onreadystatechange = function () {
if (xhr.readyState === 4) {
_this3.setState({
progress: 0
});
if (xhr.status >= 200 && xhr.status < 300) {
if (_this3.props.fileLimit) {
_this3.uploadedFileCount += _this3.state.files.length;
}
if (_this3.props.onUpload) {
_this3.props.onUpload({
xhr: xhr,
files: _this3.state.files
});
}
} else {
if (_this3.props.onError) {
_this3.props.onError({
xhr: xhr,
files: _this3.state.files
});
}
}
_this3.clear();
}
};
xhr.open('POST', this.props.url, true);
if (this.props.onBeforeSend) {
this.props.onBeforeSend({
'xhr': xhr,
'formData': formData
});
}
xhr.withCredentials = this.props.withCredentials;
xhr.send(formData);
}
}
}, {
key: "clear",
value: function clear() {
this.setState({
files: []
});
if (this.props.onClear) {
this.props.onClear();
}
this.clearInputElement();
}
}, {
key: "choose",
value: function choose() {
this.fileInput.click();
}
}, {
key: "onFocus",
value: function onFocus() {
this.setState({
focused: true
});
}
}, {
key: "onBlur",
value: function onBlur() {
this.setState({
focused: false
});
}
}, {
key: "onKeyDown",
value: function onKeyDown(event) {
if (event.which === 13) {
// enter
this.choose();
}
}
}, {
key: "onDragEnter",
value: function onDragEnter(event) {
if (!this.props.disabled) {
event.dataTransfer.dropEffect = "copy";
event.stopPropagation();
event.preventDefault();
}
}
}, {
key: "onDragOver",
value: function onDragOver(event) {
if (!this.props.disabled) {
event.dataTransfer.dropEffect = "copy";
DomHandler.addClass(this.content, 'p-fileupload-highlight');
event.stopPropagation();
event.preventDefault();
}
}
}, {
key: "onDragLeave",
value: function onDragLeave(event) {
if (!this.props.disabled) {
event.dataTransfer.dropEffect = "copy";
DomHandler.removeClass(this.content, 'p-fileupload-highlight');
}
}
}, {
key: "onDrop",
value: function onDrop(event) {
if (!this.props.disabled) {
DomHandler.removeClass(this.content, 'p-fileupload-highlight');
event.stopPropagation();
event.preventDefault();
var files = event.dataTransfer ? event.dataTransfer.files : event.target.files;
var allowDrop = this.props.multiple || files && files.length === 0;
if (allowDrop) {
this.onFileSelect(event);
}
}
}
}, {
key: "onSimpleUploaderClick",
value: function onSimpleUploaderClick() {
if (this.hasFiles()) {
this.upload();
} else {
this.fileInput.click();
}
}
}, {
key: "renderChooseButton",
value: function renderChooseButton() {
var _this4 = this;
var _this$props$chooseOpt = this.props.chooseOptions,
className = _this$props$chooseOpt.className,
style = _this$props$chooseOpt.style,
icon = _this$props$chooseOpt.icon,
iconOnly = _this$props$chooseOpt.iconOnly;
var chooseClassName = classNames('p-button p-fileupload-choose p-component', {
'p-disabled': this.props.disabled,
'p-focus': this.state.focused,
'p-button-icon-only': iconOnly
}, className);
var labelClassName = 'p-button-label p-clickable';
var label = iconOnly ? /*#__PURE__*/React__default["default"].createElement("span", {
className: labelClassName,
dangerouslySetInnerHTML: {
__html: " "
}
}) : /*#__PURE__*/React__default["default"].createElement("span", {
className: labelClassName
}, this.chooseButtonLabel());
return /*#__PURE__*/React__default["default"].createElement("span", {
className: chooseClassName,
style: style,
onClick: this.choose,
onKeyDown: this.onKeyDown,
onFocus: this.onFocus,
onBlur: this.onBlur,
tabIndex: 0
}, /*#__PURE__*/React__default["default"].createElement("input", {
ref: function ref(el) {
return _this4.fileInput = el;
},
type: "file",
onChange: this.onFileSelect,
multiple: this.props.multiple,
accept: this.props.accept,
disabled: this.chooseDisabled()
}), IconUtils.getJSXIcon(icon || 'pi pi-fw pi-plus', {
className: 'p-button-icon p-button-icon-left p-clickable'
}, {
props: this.props
}), label, /*#__PURE__*/React__default["default"].createElement(Ripple, null));
}
}, {
key: "renderFile",
value: function renderFile(file, index) {
var _this5 = this;
var preview = this.isImage(file) ? /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement("img", {
alt: file.name,
role: "presentation",
src: file.objectURL,
width: this.props.previewWidth
})) : null;
var fileName = /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-fileupload-filename"
}, file.name);
var size = /*#__PURE__*/React__default["default"].createElement("div", null, this.formatSize(file.size));
var removeButton = /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement(Button, {
type: "button",
icon: "pi pi-times",
onClick: function onClick(e) {
return _this5.remove(e, index);
}
}));
var content = /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, preview, fileName, size, removeButton);
if (this.props.itemTemplate) {
var defaultContentOptions = {
onRemove: function onRemove(event) {
return _this5.remove(event, index);
},
previewElement: preview,
fileNameElement: fileName,
sizeElement: size,
removeElement: removeButton,
formatSize: this.formatSize(file.size),
files: this.state.files,
index: index,
element: content,
props: this.props
};
content = ObjectUtils.getJSXElement(this.props.itemTemplate, file, defaultContentOptions);
}
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-fileupload-row",
key: file.name + file.type + file.size
}, content);
}
}, {
key: "renderFiles",
value: function renderFiles() {
var _this6 = this;
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-fileupload-files"
}, this.state.files.map(function (file, index) {
return _this6.renderFile(file, index);
}));
}
}, {
key: "renderEmptyContent",
value: function renderEmptyContent() {
if (this.props.emptyTemplate && !this.hasFiles()) {
return ObjectUtils.getJSXElement(this.props.emptyTemplate, this.props);
}
return null;
}
}, {
key: "renderProgressBarContent",
value: function renderProgressBarContent() {
if (this.props.progressBarTemplate) {
return ObjectUtils.getJSXElement(this.props.progressBarTemplate, this.props);
}
return /*#__PURE__*/React__default["default"].createElement(ProgressBar, {
value: this.state.progress,
showValue: false
});
}
}, {
key: "renderAdvanced",
value: function renderAdvanced() {
var _this7 = this;
var className = classNames('p-fileupload p-fileupload-advanced p-component', this.props.className);
var headerClassName = classNames('p-fileupload-buttonbar', this.props.headerClassName);
var contentClassName = classNames('p-fileupload-content', this.props.contentClassName);
var uploadButton, cancelButton, filesList, progressBar;
var chooseButton = this.renderChooseButton();
var emptyContent = this.renderEmptyContent();
if (!this.props.auto) {
var uploadOptions = this.props.uploadOptions;
var cancelOptions = this.props.cancelOptions;
var uploadLabel = !uploadOptions.iconOnly ? this.uploadButtonLabel() : '';
var cancelLabel = !cancelOptions.iconOnly ? this.cancelButtonLabel() : '';
uploadButton = /*#__PURE__*/React__default["default"].createElement(Button, {
type: "button",
label: uploadLabel,
icon: uploadOptions.icon || 'pi pi-upload',
onClick: this.upload,
disabled: this.uploadDisabled(),
style: uploadOptions.style,
className: uploadOptions.className
});
cancelButton = /*#__PURE__*/React__default["default"].createElement(Button, {
type: "button",
label: cancelLabel,
icon: cancelOptions.icon || 'pi pi-times',
onClick: this.clear,
disabled: this.cancelDisabled(),
style: cancelOptions.style,
className: cancelOptions.className
});
}
if (this.hasFiles()) {
filesList = this.renderFiles();
progressBar = this.renderProgressBarContent();
}
var header = /*#__PURE__*/React__default["default"].createElement("div", {
className: headerClassName,
style: this.props.headerStyle
}, chooseButton, uploadButton, cancelButton);
if (this.props.headerTemplate) {
var defaultContentOptions = {
className: headerClassName,
chooseButton: chooseButton,
uploadButton: uploadButton,
cancelButton: cancelButton,
element: header,
props: this.props
};
header = ObjectUtils.getJSXElement(this.props.headerTemplate, defaultContentOptions);
}
return /*#__PURE__*/React__default["default"].createElement("div", {
id: this.props.id,
className: className,
style: this.props.style
}, header, /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
_this7.content = el;
},
className: contentClassName,
style: this.props.contentStyle,
onDragEnter: this.onDragEnter,
onDragOver: this.onDragOver,
onDragLeave: this.onDragLeave,
onDrop: this.onDrop
}, progressBar, /*#__PURE__*/React__default["default"].createElement(Messages, {
ref: function ref(el) {
return _this7.messagesUI = el;
}
}), filesList, emptyContent));
}
}, {
key: "renderBasic",
value: function renderBasic() {
var _this8 = this;
var hasFiles = this.hasFiles();
var chooseOptions = this.props.chooseOptions;
var className = classNames('p-fileupload p-fileupload-basic p-component', this.props.className);
var buttonClassName = classNames('p-button p-component p-fileupload-choose', {
'p-fileupload-choose-selected': hasFiles,
'p-disabled': this.props.disabled,
'p-focus': this.state.focused
}, chooseOptions.className);
var chooseIcon = chooseOptions.icon || classNames({
'pi pi-plus': !chooseOptions.icon && (!hasFiles || this.props.auto),
'pi pi-upload': !chooseOptions.icon && hasFiles && !this.props.auto
});
var labelClassName = 'p-button-label p-clickable';
var chooseLabel = chooseOptions.iconOnly ? /*#__PURE__*/React__default["default"].createElement("span", {
className: labelClassName,
dangerouslySetInnerHTML: {
__html: " "
}
}) : /*#__PURE__*/React__default["default"].createElement("span", {
className: labelClassName
}, this.chooseButtonLabel());
var label = this.props.auto ? chooseLabel : /*#__PURE__*/React__default["default"].createElement("span", {
className: labelClassName
}, hasFiles ? this.state.files[0].name : chooseLabel);
var icon = IconUtils.getJSXIcon(chooseIcon, {
className: 'p-button-icon p-button-icon-left'
}, {
props: this.props,
hasFiles: hasFiles
});
return /*#__PURE__*/React__default["default"].createElement("div", {
className: className,
style: this.props.style
}, /*#__PURE__*/React__default["default"].createElement(Messages, {
ref: function ref(el) {
return _this8.messagesUI = el;
}
}), /*#__PURE__*/React__default["default"].createElement("span", {
className: buttonClassName,
style: chooseOptions.style,
onMouseUp: this.onSimpleUploaderClick,
onKeyDown: this.onKeyDown,
onFocus: this.onFocus,
onBlur: this.onBlur,
tabIndex: 0
}, icon, label, !hasFiles && /*#__PURE__*/React__default["default"].createElement("input", {
ref: function ref(el) {
return _this8.fileInput = el;
},
type: "file",
accept: this.props.accept,
multiple: this.props.multiple,
disabled: this.props.disabled,
onChange: this.onFileSelect
}), /*#__PURE__*/React__default["default"].createElement(Ripple, null)));
}
}, {
key: "render",
value: function render() {
if (this.props.mode === 'advanced') return this.renderAdvanced();else if (this.props.mode === 'basic') return this.renderBasic();
}
}]);
return FileUpload;
}(React.Component);
_defineProperty(FileUpload, "defaultProps", {
id: null,
name: null,
url: null,
mode: 'advanced',
multiple: false,
accept: null,
disabled: false,
auto: false,
maxFileSize: null,
invalidFileSizeMessageSummary: '{0}: Invalid file size, ',
invalidFileSizeMessageDetail: 'maximum upload size is {0}.',
style: null,
className: null,
widthCredentials: false,
previewWidth: 50,
chooseLabel: null,
uploadLabel: null,
cancelLabel: null,
chooseOptions: {
label: null,
icon: null,
iconOnly: false,
className: null,
style: null
},
uploadOptions: {
label: null,
icon: null,
iconOnly: false,
className: null,
style: null
},
cancelOptions: {
label: null,
icon: null,
iconOnly: false,
className: null,
style: null
},
customUpload: false,
headerClassName: null,
headerStyle: null,
contentClassName: null,
contentStyle: null,
headerTemplate: null,
itemTemplate: null,
emptyTemplate: null,
progressBarTemplate: null,
onBeforeUpload: null,
onBeforeSend: null,
onUpload: null,
onError: null,
onClear: null,
onSelect: null,
onProgress: null,
onValidationFail: null,
uploadHandler: null,
onRemove: null
});
function _createSuper$1g(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1g(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1g() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var FullCalendar = /*#__PURE__*/function (_Component) {
_inherits(FullCalendar, _Component);
var _super = _createSuper$1g(FullCalendar);
function FullCalendar() {
_classCallCheck(this, FullCalendar);
return _super.apply(this, arguments);
}
_createClass(FullCalendar, [{
key: "componentDidMount",
value: function componentDidMount() {
console.warn("FullCalendar component is deprecated. Use FullCalendar component of '@fullcalendar/react' package.");
this.config = {
theme: true
};
if (this.props.options) {
for (var prop in this.props.options) {
this.config[prop] = this.props.options[prop];
}
}
this.initialize();
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps) {
if (!this.calendar) {
this.initialize();
} else {
if (!ObjectUtils.equals(prevProps.events, this.props.events)) {
this.calendar.removeAllEventSources();
this.calendar.addEventSource(this.props.events);
}
if (!ObjectUtils.equals(prevProps.options, this.props.options)) {
for (var prop in this.props.options) {
var optionValue = this.props.options[prop];
this.config[prop] = optionValue;
this.calendar.setOption(prop, optionValue);
}
}
}
}
}, {
key: "initialize",
value: function initialize() {
var _this = this;
Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require('@fullcalendar/core')); }).then(function (module) {
if (module && module.Calendar) {
_this.calendar = new module.Calendar(_this.element, _this.config);
_this.calendar.render();
if (_this.props.events) {
_this.calendar.removeAllEventSources();
_this.calendar.addEventSource(_this.props.events);
}
}
});
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
if (this.calendar) {
this.calendar.destroy();
}
}
}, {
key: "render",
value: function render() {
var _this2 = this;
return /*#__PURE__*/React__default["default"].createElement("div", {
id: this.props.id,
ref: function ref(el) {
return _this2.element = el;
},
style: this.props.style,
className: this.props.className
});
}
}]);
return FullCalendar;
}(React.Component);
_defineProperty(FullCalendar, "defaultProps", {
id: null,
events: [],
style: null,
className: null,
options: null
});
function _createSuper$1f(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1f(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1f() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var GalleriaItemComponent = /*#__PURE__*/function (_Component) {
_inherits(GalleriaItemComponent, _Component);
var _super = _createSuper$1f(GalleriaItemComponent);
function GalleriaItemComponent(props) {
var _this;
_classCallCheck(this, GalleriaItemComponent);
_this = _super.call(this, props);
_this.navForward = _this.navForward.bind(_assertThisInitialized(_this));
_this.navBackward = _this.navBackward.bind(_assertThisInitialized(_this));
_this.next = _this.next.bind(_assertThisInitialized(_this));
_this.prev = _this.prev.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(GalleriaItemComponent, [{
key: "step",
value: function step(index) {
if (this.itemsContainer) {
this.itemsContainer.style.transform = this.isVertical() ? "translate3d(0, ".concat(index * 100, "%, 0)") : "translate3d(".concat(index * 100, "%, 0, 0)");
this.itemsContainer.style.transition = 'transform 500ms ease 0s';
}
}
}, {
key: "next",
value: function next() {
var nextItemIndex = this.props.activeItemIndex + 1;
this.props.onActiveItemChange({
index: this.props.circular && this.props.value.length - 1 === this.props.activeItemIndex ? 0 : nextItemIndex
});
}
}, {
key: "prev",
value: function prev() {
var prevItemIndex = this.props.activeItemIndex !== 0 ? this.props.activeItemIndex - 1 : 0;
this.props.onActiveItemChange({
index: this.props.circular && this.props.activeItemIndex === 0 ? this.props.value.length - 1 : prevItemIndex
});
}
}, {
key: "stopSlideShow",
value: function stopSlideShow() {
if (this.props.slideShowActive && this.props.stopSlideShow) {
this.props.stopSlideShow();
}
}
}, {
key: "navBackward",
value: function navBackward(e) {
this.stopSlideShow();
this.prev();
if (e && e.cancelable) {
e.preventDefault();
}
}
}, {
key: "navForward",
value: function navForward(e) {
this.stopSlideShow();
this.next();
if (e && e.cancelable) {
e.preventDefault();
}
}
}, {
key: "onIndicatorClick",
value: function onIndicatorClick(index) {
this.stopSlideShow();
this.props.onActiveItemChange({
index: index
});
}
}, {
key: "onIndicatorMouseEnter",
value: function onIndicatorMouseEnter(index) {
if (this.props.changeItemOnIndicatorHover) {
this.stopSlideShow();
this.props.onActiveItemChange({
index: index
});
}
}
}, {
key: "onIndicatorKeyDown",
value: function onIndicatorKeyDown(event, index) {
if (event.which === 13) {
this.stopSlideShow();
this.props.onActiveItemChange({
index: index
});
}
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
if (this.props.autoPlay) {
this.props.startSlideShow();
}
}
}, {
key: "renderBackwardNavigator",
value: function renderBackwardNavigator() {
if (this.props.showItemNavigators) {
var isDisabled = !this.props.circular && this.props.activeItemIndex === 0;
var buttonClassName = classNames('p-galleria-item-prev p-galleria-item-nav p-link', {
'p-disabled': isDisabled
});
return /*#__PURE__*/React__default["default"].createElement("button", {
type: "button",
className: buttonClassName,
onClick: this.navBackward,
disabled: isDisabled
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-galleria-item-prev-icon pi pi-chevron-left"
}), /*#__PURE__*/React__default["default"].createElement(Ripple, null));
}
return null;
}
}, {
key: "renderForwardNavigator",
value: function renderForwardNavigator() {
if (this.props.showItemNavigators) {
var isDisabled = !this.props.circular && this.props.activeItemIndex === this.props.value.length - 1;
var buttonClassName = classNames('p-galleria-item-next p-galleria-item-nav p-link', {
'p-disabled': isDisabled
});
return /*#__PURE__*/React__default["default"].createElement("button", {
type: "button",
className: buttonClassName,
onClick: this.navForward,
disabled: isDisabled
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-galleria-item-next-icon pi pi-chevron-right"
}), /*#__PURE__*/React__default["default"].createElement(Ripple, null));
}
return null;
}
}, {
key: "renderCaption",
value: function renderCaption() {
if (this.props.caption) {
var content = this.props.caption(this.props.value[this.props.activeItemIndex]);
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-galleria-caption"
}, content);
}
return null;
}
}, {
key: "renderIndicator",
value: function renderIndicator(index) {
var _this2 = this;
var indicator = this.props.indicator && this.props.indicator(index);
var isActive = this.props.activeItemIndex === index;
var indicatorItemClassName = classNames('p-galleria-indicator', {
'p-highlight': isActive
});
if (!indicator) {
indicator = /*#__PURE__*/React__default["default"].createElement("button", {
type: "button",
tabIndex: -1,
className: "p-link"
}, /*#__PURE__*/React__default["default"].createElement(Ripple, null));
}
return /*#__PURE__*/React__default["default"].createElement("li", {
className: indicatorItemClassName,
key: 'p-galleria-indicator-' + index,
tabIndex: 0,
onClick: function onClick() {
return _this2.onIndicatorClick(index);
},
onMouseEnter: function onMouseEnter() {
return _this2.onIndicatorMouseEnter(index);
},
onKeyDown: function onKeyDown(e) {
return _this2.onIndicatorKeyDown(e, index);
}
}, indicator);
}
}, {
key: "renderIndicators",
value: function renderIndicators() {
if (this.props.showIndicators) {
var indicatorsContentClassName = classNames('p-galleria-indicators p-reset', this.props.indicatorsContentClassName);
var indicators = [];
for (var i = 0; i < this.props.value.length; i++) {
indicators.push(this.renderIndicator(i));
}
return /*#__PURE__*/React__default["default"].createElement("ul", {
className: indicatorsContentClassName
}, indicators);
}
return null;
}
}, {
key: "render",
value: function render() {
var _this3 = this;
var content = this.props.itemTemplate && this.props.itemTemplate(this.props.value[this.props.activeItemIndex]);
var backwardNavigator = this.renderBackwardNavigator();
var forwardNavigator = this.renderForwardNavigator();
var caption = this.renderCaption();
var indicators = this.renderIndicators();
return /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this3.props.forwardRef(el);
},
className: "p-galleria-item-wrapper"
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-galleria-item-container"
}, backwardNavigator, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-galleria-item"
}, content), forwardNavigator, caption), indicators);
}
}]);
return GalleriaItemComponent;
}(React.Component);
var GalleriaItem = /*#__PURE__*/React__default["default"].forwardRef(function (props, ref) {
return /*#__PURE__*/React__default["default"].createElement(GalleriaItemComponent, _extends({
forwardRef: ref
}, props));
});
function _createSuper$1e(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1e(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1e() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var GalleriaThumbnailItem = /*#__PURE__*/function (_Component) {
_inherits(GalleriaThumbnailItem, _Component);
var _super = _createSuper$1e(GalleriaThumbnailItem);
function GalleriaThumbnailItem(props) {
var _this;
_classCallCheck(this, GalleriaThumbnailItem);
_this = _super.call(this, props);
_this.onItemClick = _this.onItemClick.bind(_assertThisInitialized(_this));
_this.onItemKeyDown = _this.onItemKeyDown.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(GalleriaThumbnailItem, [{
key: "onItemClick",
value: function onItemClick(event) {
this.props.onItemClick({
originalEvent: event,
index: this.props.index
});
}
}, {
key: "onItemKeyDown",
value: function onItemKeyDown(event) {
if (event.which === 13) {
this.props.onItemClick({
originalEvent: event,
index: this.props.index
});
}
}
}, {
key: "render",
value: function render() {
var content = this.props.template && this.props.template(this.props.item);
var itemClassName = classNames(this.props.className, 'p-galleria-thumbnail-item', {
'p-galleria-thumbnail-item-current': this.props.current,
'p-galleria-thumbnail-item-active': this.props.active,
'p-galleria-thumbnail-item-start': this.props.start,
'p-galleria-thumbnail-item-end': this.props.end
});
return /*#__PURE__*/React__default["default"].createElement("div", {
className: itemClassName
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-galleria-thumbnail-item-content",
tabIndex: this.props.active ? 0 : null,
onClick: this.onItemClick,
onKeyDown: this.onItemKeyDown
}, content));
}
}]);
return GalleriaThumbnailItem;
}(React.Component);
_defineProperty(GalleriaThumbnailItem, "defaultProps", {
index: null,
template: null,
item: null,
current: false,
active: false,
start: false,
end: false,
className: null,
onItemClick: null
});
var GalleriaThumbnails = /*#__PURE__*/function (_Component2) {
_inherits(GalleriaThumbnails, _Component2);
var _super2 = _createSuper$1e(GalleriaThumbnails);
function GalleriaThumbnails(props) {
var _this2;
_classCallCheck(this, GalleriaThumbnails);
_this2 = _super2.call(this, props);
_this2.state = {
numVisible: props.numVisible,
totalShiftedItems: 0,
page: 0
};
_this2.navForward = _this2.navForward.bind(_assertThisInitialized(_this2));
_this2.navBackward = _this2.navBackward.bind(_assertThisInitialized(_this2));
_this2.onTransitionEnd = _this2.onTransitionEnd.bind(_assertThisInitialized(_this2));
_this2.onTouchStart = _this2.onTouchStart.bind(_assertThisInitialized(_this2));
_this2.onTouchMove = _this2.onTouchMove.bind(_assertThisInitialized(_this2));
_this2.onTouchEnd = _this2.onTouchEnd.bind(_assertThisInitialized(_this2));
_this2.onItemClick = _this2.onItemClick.bind(_assertThisInitialized(_this2));
_this2.attributeSelector = UniqueComponentId();
return _this2;
}
_createClass(GalleriaThumbnails, [{
key: "step",
value: function step(dir) {
var totalShiftedItems = this.state.totalShiftedItems + dir;
if (dir < 0 && -1 * totalShiftedItems + this.state.numVisible > this.props.value.length - 1) {
totalShiftedItems = this.state.numVisible - this.props.value.length;
} else if (dir > 0 && totalShiftedItems > 0) {
totalShiftedItems = 0;
}
if (this.props.circular) {
if (dir < 0 && this.props.value.length - 1 === this.props.activeItemIndex) {
totalShiftedItems = 0;
} else if (dir > 0 && this.props.activeItemIndex === 0) {
totalShiftedItems = this.state.numVisible - this.props.value.length;
}
}
if (this.itemsContainer) {
DomHandler.removeClass(this.itemsContainer, 'p-items-hidden');
this.itemsContainer.style.transform = this.props.isVertical ? "translate3d(0, ".concat(totalShiftedItems * (100 / this.state.numVisible), "%, 0)") : "translate3d(".concat(totalShiftedItems * (100 / this.state.numVisible), "%, 0, 0)");
this.itemsContainer.style.transition = 'transform 500ms ease 0s';
}
this.setState({
totalShiftedItems: totalShiftedItems
});
}
}, {
key: "stopSlideShow",
value: function stopSlideShow() {
if (this.props.slideShowActive && this.props.stopSlideShow) {
this.props.stopSlideShow();
}
}
}, {
key: "getMedianItemIndex",
value: function getMedianItemIndex() {
var index = Math.floor(this.state.numVisible / 2);
return this.state.numVisible % 2 ? index : index - 1;
}
}, {
key: "navBackward",
value: function navBackward(e) {
this.stopSlideShow();
var prevItemIndex = this.props.activeItemIndex !== 0 ? this.props.activeItemIndex - 1 : 0;
var diff = prevItemIndex + this.state.totalShiftedItems;
if (this.state.numVisible - diff - 1 > this.getMedianItemIndex() && (-1 * this.state.totalShiftedItems !== 0 || this.props.circular)) {
this.step(1);
}
this.props.onActiveItemChange({
index: this.props.circular && this.props.activeItemIndex === 0 ? this.props.value.length - 1 : prevItemIndex
});
if (e.cancelable) {
e.preventDefault();
}
}
}, {
key: "navForward",
value: function navForward(e) {
this.stopSlideShow();
var nextItemIndex = this.props.activeItemIndex + 1;
if (nextItemIndex + this.state.totalShiftedItems > this.getMedianItemIndex() && (-1 * this.state.totalShiftedItems < this.getTotalPageNumber() - 1 || this.props.circular)) {
this.step(-1);
}
this.props.onActiveItemChange({
index: this.props.circular && this.props.value.length - 1 === this.props.activeItemIndex ? 0 : nextItemIndex
});
if (e.cancelable) {
e.preventDefault();
}
}
}, {
key: "onItemClick",
value: function onItemClick(event) {
this.stopSlideShow();
var selectedItemIndex = event.index;
if (selectedItemIndex !== this.props.activeItemIndex) {
var diff = selectedItemIndex + this.state.totalShiftedItems;
var dir = 0;
if (selectedItemIndex < this.props.activeItemIndex) {
dir = this.state.numVisible - diff - 1 - this.getMedianItemIndex();
if (dir > 0 && -1 * this.state.totalShiftedItems !== 0) {
this.step(dir);
}
} else {
dir = this.getMedianItemIndex() - diff;
if (dir < 0 && -1 * this.state.totalShiftedItems < this.getTotalPageNumber() - 1) {
this.step(dir);
}
}
this.props.onActiveItemChange({
index: selectedItemIndex
});
}
}
}, {
key: "onTransitionEnd",
value: function onTransitionEnd(e) {
if (this.itemsContainer && e.propertyName === 'transform') {
DomHandler.addClass(this.itemsContainer, 'p-items-hidden');
this.itemsContainer.style.transition = '';
}
}
}, {
key: "onTouchStart",
value: function onTouchStart(e) {
var touchobj = e.changedTouches[0];
this.startPos = {
x: touchobj.pageX,
y: touchobj.pageY
};
}
}, {
key: "onTouchMove",
value: function onTouchMove(e) {
if (e.cancelable) {
e.preventDefault();
}
}
}, {
key: "onTouchEnd",
value: function onTouchEnd(e) {
var touchobj = e.changedTouches[0];
if (this.props.isVertical) {
this.changePageOnTouch(e, touchobj.pageY - this.startPos.y);
} else {
this.changePageOnTouch(e, touchobj.pageX - this.startPos.x);
}
}
}, {
key: "changePageOnTouch",
value: function changePageOnTouch(e, diff) {
if (diff < 0) {
// left
this.navForward(e);
} else {
// right
this.navBackward(e);
}
}
}, {
key: "getTotalPageNumber",
value: function getTotalPageNumber() {
return this.props.value.length > this.state.numVisible ? this.props.value.length - this.state.numVisible + 1 : 0;
}
}, {
key: "createStyle",
value: function createStyle() {
if (!this.thumbnailsStyle) {
this.thumbnailsStyle = DomHandler.createInlineStyle(PrimeReact.nonce);
}
var innerHTML = "\n .p-galleria-thumbnail-items[".concat(this.attributeSelector, "] .p-galleria-thumbnail-item {\n flex: 1 0 ").concat(100 / this.state.numVisible, "%\n }\n ");
if (this.props.responsiveOptions) {
this.responsiveOptions = _toConsumableArray(this.props.responsiveOptions);
this.responsiveOptions.sort(function (data1, data2) {
var value1 = data1.breakpoint;
var value2 = data2.breakpoint;
var result = null;
if (value1 == null && value2 != null) result = -1;else if (value1 != null && value2 == null) result = 1;else if (value1 == null && value2 == null) result = 0;else if (typeof value1 === 'string' && typeof value2 === 'string') result = value1.localeCompare(value2, undefined, {
numeric: true
});else result = value1 < value2 ? -1 : value1 > value2 ? 1 : 0;
return -1 * result;
});
for (var i = 0; i < this.responsiveOptions.length; i++) {
var res = this.responsiveOptions[i];
innerHTML += "\n @media screen and (max-width: ".concat(res.breakpoint, ") {\n .p-galleria-thumbnail-items[").concat(this.attributeSelector, "] .p-galleria-thumbnail-item {\n flex: 1 0 ").concat(100 / res.numVisible, "%\n }\n }\n ");
}
}
this.thumbnailsStyle.innerHTML = innerHTML;
}
}, {
key: "calculatePosition",
value: function calculatePosition() {
if (this.itemsContainer && this.responsiveOptions) {
var windowWidth = window.innerWidth;
var matchedResponsiveData = {
numVisible: this.props.numVisible
};
for (var i = 0; i < this.responsiveOptions.length; i++) {
var res = this.responsiveOptions[i];
if (parseInt(res.breakpoint, 10) >= windowWidth) {
matchedResponsiveData = res;
}
}
if (this.state.numVisible !== matchedResponsiveData.numVisible) {
this.setState({
numVisible: matchedResponsiveData.numVisible
});
}
}
}
}, {
key: "bindDocumentListeners",
value: function bindDocumentListeners() {
var _this3 = this;
if (!this.documentResizeListener) {
this.documentResizeListener = function () {
_this3.calculatePosition();
};
window.addEventListener('resize', this.documentResizeListener);
}
}
}, {
key: "unbindDocumentListeners",
value: function unbindDocumentListeners() {
if (this.documentResizeListener) {
window.removeEventListener('resize', this.documentResizeListener);
this.documentResizeListener = null;
}
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
if (this.itemsContainer) {
this.itemsContainer.setAttribute(this.attributeSelector, '');
}
this.createStyle();
this.calculatePosition();
if (this.props.responsiveOptions) {
this.bindDocumentListeners();
}
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps, prevState) {
var totalShiftedItems = this.state.totalShiftedItems;
if (prevState.numVisible !== this.state.numVisible || prevProps.activeItemIndex !== this.props.activeItemIndex) {
if (this.props.activeItemIndex <= this.getMedianItemIndex()) {
totalShiftedItems = 0;
} else if (this.props.value.length - this.state.numVisible + this.getMedianItemIndex() < this.props.activeItemIndex) {
totalShiftedItems = this.state.numVisible - this.props.value.length;
} else if (this.props.value.length - this.state.numVisible < this.props.activeItemIndex && this.state.numVisible % 2 === 0) {
totalShiftedItems = this.props.activeItemIndex * -1 + this.getMedianItemIndex() + 1;
} else {
totalShiftedItems = this.props.activeItemIndex * -1 + this.getMedianItemIndex();
}
if (totalShiftedItems !== this.state.totalShiftedItems) {
this.setState({
totalShiftedItems: totalShiftedItems
});
}
this.itemsContainer.style.transform = this.props.isVertical ? "translate3d(0, ".concat(totalShiftedItems * (100 / this.state.numVisible), "%, 0)") : "translate3d(".concat(totalShiftedItems * (100 / this.state.numVisible), "%, 0, 0)");
if (prevProps.activeItemIndex !== this.props.activeItemIndex) {
DomHandler.removeClass(this.itemsContainer, 'p-items-hidden');
this.itemsContainer.style.transition = 'transform 500ms ease 0s';
}
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
if (this.props.responsiveOptions) {
this.unbindDocumentListeners();
}
}
}, {
key: "renderItems",
value: function renderItems() {
var _this4 = this;
return this.props.value.map(function (item, index) {
var firstIndex = _this4.state.totalShiftedItems * -1,
lastIndex = firstIndex + _this4.state.numVisible - 1,
isActive = firstIndex <= index && lastIndex >= index,
start = firstIndex === index,
end = lastIndex === index,
current = _this4.props.activeItemIndex === index;
return /*#__PURE__*/React__default["default"].createElement(GalleriaThumbnailItem, {
key: index,
index: index,
template: _this4.props.itemTemplate,
item: item,
active: isActive,
start: start,
end: end,
onItemClick: _this4.onItemClick,
current: current
});
});
}
}, {
key: "renderBackwardNavigator",
value: function renderBackwardNavigator() {
if (this.props.showThumbnailNavigators) {
var isDisabled = !this.props.circular && this.props.activeItemIndex === 0 || this.props.value.length <= this.state.numVisible;
var buttonClassName = classNames('p-galleria-thumbnail-prev p-link', {
'p-disabled': isDisabled
}),
iconClassName = classNames('p-galleria-thumbnail-prev-icon pi', {
'pi-chevron-left': !this.props.isVertical,
'pi-chevron-up': this.props.isVertical
});
return /*#__PURE__*/React__default["default"].createElement("button", {
className: buttonClassName,
onClick: this.navBackward,
disabled: isDisabled
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: iconClassName
}), /*#__PURE__*/React__default["default"].createElement(Ripple, null));
}
return null;
}
}, {
key: "renderForwardNavigator",
value: function renderForwardNavigator() {
if (this.props.showThumbnailNavigators) {
var isDisabled = !this.props.circular && this.props.activeItemIndex === this.props.value.length - 1 || this.props.value.length <= this.state.numVisible;
var buttonClassName = classNames('p-galleria-thumbnail-next p-link', {
'p-disabled': isDisabled
}),
iconClassName = classNames('p-galleria-thumbnail-next-icon pi', {
'pi-chevron-right': !this.props.isVertical,
'pi-chevron-down': this.props.isVertical
});
return /*#__PURE__*/React__default["default"].createElement("button", {
className: buttonClassName,
onClick: this.navForward,
disabled: isDisabled
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: iconClassName
}), /*#__PURE__*/React__default["default"].createElement(Ripple, null));
}
return null;
}
}, {
key: "renderContent",
value: function renderContent() {
var _this5 = this;
var items = this.renderItems();
var height = this.props.isVertical ? this.props.contentHeight : '';
var backwardNavigator = this.renderBackwardNavigator();
var forwardNavigator = this.renderForwardNavigator();
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-galleria-thumbnail-container"
}, backwardNavigator, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-galleria-thumbnail-items-container",
style: {
'height': height
}
}, /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this5.itemsContainer = el;
},
className: "p-galleria-thumbnail-items",
onTransitionEnd: this.onTransitionEnd,
onTouchStart: this.onTouchStart,
onTouchMove: this.onTouchMove,
onTouchEnd: this.onTouchEnd
}, items)), forwardNavigator);
}
}, {
key: "render",
value: function render() {
var content = this.renderContent();
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-galleria-thumbnail-wrapper"
}, content);
}
}]);
return GalleriaThumbnails;
}(React.Component);
function ownKeys$p(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$p(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$p(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$p(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createSuper$1d(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1d(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1d() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var Galleria = /*#__PURE__*/function (_Component) {
_inherits(Galleria, _Component);
var _super = _createSuper$1d(Galleria);
function Galleria(props) {
var _this;
_classCallCheck(this, Galleria);
_this = _super.call(this, props);
_this.state = {
visible: false,
numVisible: props.numVisible,
slideShowActive: false
};
if (!_this.props.onItemChange) {
_this.state = _objectSpread$p(_objectSpread$p({}, _this.state), {}, {
activeIndex: props.activeIndex
});
}
_this.onActiveItemChange = _this.onActiveItemChange.bind(_assertThisInitialized(_this));
_this.show = _this.show.bind(_assertThisInitialized(_this));
_this.hide = _this.hide.bind(_assertThisInitialized(_this));
_this.startSlideShow = _this.startSlideShow.bind(_assertThisInitialized(_this));
_this.stopSlideShow = _this.stopSlideShow.bind(_assertThisInitialized(_this));
_this.onEnter = _this.onEnter.bind(_assertThisInitialized(_this));
_this.onEntering = _this.onEntering.bind(_assertThisInitialized(_this));
_this.onEntered = _this.onEntered.bind(_assertThisInitialized(_this));
_this.onExit = _this.onExit.bind(_assertThisInitialized(_this));
_this.onExited = _this.onExited.bind(_assertThisInitialized(_this));
_this.galleriaRef = /*#__PURE__*/React__default["default"].createRef();
return _this;
}
_createClass(Galleria, [{
key: "activeItemIndex",
get: function get() {
return this.props.onItemChange ? this.props.activeIndex : this.state.activeIndex;
}
}, {
key: "onActiveItemChange",
value: function onActiveItemChange(event) {
if (this.props.onItemChange) {
this.props.onItemChange(event);
} else {
this.setState({
activeIndex: event.index
});
}
}
}, {
key: "show",
value: function show() {
this.setState({
visible: true
});
}
}, {
key: "hide",
value: function hide() {
this.setState({
visible: false
});
}
}, {
key: "onEnter",
value: function onEnter() {
DomHandler.addClass(document.body, 'p-overflow-hidden');
}
}, {
key: "onEntering",
value: function onEntering() {
ZIndexUtils.set('modal', this.mask, PrimeReact.autoZIndex, this.props.baseZIndex || PrimeReact.zIndex['modal']);
DomHandler.addMultipleClasses(this.mask, 'p-component-overlay p-component-overlay-enter');
}
}, {
key: "onEntered",
value: function onEntered() {
this.props.onShow && this.props.onShow();
}
}, {
key: "onExit",
value: function onExit() {
DomHandler.removeClass(document.body, 'p-overflow-hidden');
DomHandler.addClass(this.mask, 'p-component-overlay-leave');
}
}, {
key: "onExited",
value: function onExited() {
ZIndexUtils.clear(this.mask);
this.props.onHide && this.props.onHide();
}
}, {
key: "isAutoPlayActive",
value: function isAutoPlayActive() {
return this.state.slideShowActive;
}
}, {
key: "startSlideShow",
value: function startSlideShow() {
var _this2 = this;
this.interval = setInterval(function () {
var activeIndex = _this2.props.circular && _this2.props.value.length - 1 === _this2.activeItemIndex ? 0 : _this2.activeItemIndex + 1;
_this2.onActiveItemChange({
index: activeIndex
});
}, this.props.transitionInterval);
this.setState({
slideShowActive: true
});
}
}, {
key: "stopSlideShow",
value: function stopSlideShow() {
if (this.interval) {
clearInterval(this.interval);
}
this.setState({
slideShowActive: false
});
}
}, {
key: "getPositionClassName",
value: function getPositionClassName(preClassName, position) {
var positions = ['top', 'left', 'bottom', 'right'];
var pos = positions.find(function (item) {
return item === position;
});
return pos ? "".concat(preClassName, "-").concat(pos) : '';
}
}, {
key: "isVertical",
value: function isVertical() {
return this.props.thumbnailsPosition === 'left' || this.props.thumbnailsPosition === 'right';
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps, prevState) {
if (prevProps.value !== this.props.value) {
if (this.props.value && this.props.value.length < this.state.numVisible) {
this.setState({
numVisible: this.props.value.length
});
}
}
if (prevProps.numVisible !== this.props.numVisible) {
this.setState({
numVisible: this.props.numVisible
});
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
if (this.state.slideShowActive) {
this.stopSlideShow();
}
ZIndexUtils.clear(this.mask);
}
}, {
key: "renderHeader",
value: function renderHeader() {
if (this.props.header) {
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-galleria-header"
}, this.props.header);
}
return null;
}
}, {
key: "renderFooter",
value: function renderFooter() {
if (this.props.footer) {
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-galleria-footer"
}, this.props.footer);
}
return null;
}
}, {
key: "renderElement",
value: function renderElement() {
var _this3 = this;
var isVertical = this.isVertical();
var thumbnailsPosClassName = this.props.showThumbnails && this.getPositionClassName('p-galleria-thumbnails', this.props.thumbnailsPosition);
var indicatorPosClassName = this.props.showIndicators && this.getPositionClassName('p-galleria-indicators', this.props.indicatorsPosition);
var galleriaClassName = classNames('p-galleria p-component', this.props.className, {
'p-galleria-fullscreen': this.props.fullScreen,
'p-galleria-indicator-onitem': this.props.showIndicatorsOnItem,
'p-galleria-item-nav-onhover': this.props.showItemNavigatorsOnHover && !this.props.fullScreen
}, thumbnailsPosClassName, indicatorPosClassName);
var closeIcon = this.props.fullScreen && /*#__PURE__*/React__default["default"].createElement("button", {
type: "button",
className: "p-galleria-close p-link",
onClick: this.hide
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-galleria-close-icon pi pi-times"
}), /*#__PURE__*/React__default["default"].createElement(Ripple, null));
var header = this.renderHeader();
var footer = this.renderFooter();
var element = /*#__PURE__*/React__default["default"].createElement("div", {
ref: this.galleriaRef,
id: this.props.id,
className: galleriaClassName,
style: this.props.style
}, closeIcon, header, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-galleria-content"
}, /*#__PURE__*/React__default["default"].createElement(GalleriaItem, {
ref: function ref(el) {
return _this3.previewContent = el;
},
value: this.props.value,
activeItemIndex: this.activeItemIndex,
onActiveItemChange: this.onActiveItemChange,
itemTemplate: this.props.item,
circular: this.props.circular,
caption: this.props.caption,
showIndicators: this.props.showIndicators,
changeItemOnIndicatorHover: this.props.changeItemOnIndicatorHover,
indicator: this.props.indicator,
showItemNavigators: this.props.showItemNavigators,
autoPlay: this.props.autoPlay,
slideShowActive: this.state.slideShowActive,
startSlideShow: this.startSlideShow,
stopSlideShow: this.stopSlideShow
}), this.props.showThumbnails && /*#__PURE__*/React__default["default"].createElement(GalleriaThumbnails, {
value: this.props.value,
activeItemIndex: this.activeItemIndex,
onActiveItemChange: this.onActiveItemChange,
itemTemplate: this.props.thumbnail,
numVisible: this.state.numVisible,
responsiveOptions: this.props.responsiveOptions,
circular: this.props.circular,
isVertical: isVertical,
contentHeight: this.props.verticalThumbnailViewPortHeight,
showThumbnailNavigators: this.props.showThumbnailNavigators,
autoPlay: this.props.autoPlay,
slideShowActive: this.state.slideShowActive,
stopSlideShow: this.stopSlideShow
})), footer);
return element;
}
}, {
key: "renderGalleria",
value: function renderGalleria() {
var _this4 = this;
var element = this.renderElement();
if (this.props.fullScreen) {
var maskClassName = classNames('p-galleria-mask', {
'p-galleria-visible': this.state.visible
});
var galleriaWrapper = /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this4.mask = el;
},
className: maskClassName
}, /*#__PURE__*/React__default["default"].createElement(CSSTransition, {
nodeRef: this.galleriaRef,
classNames: "p-galleria",
"in": this.state.visible,
timeout: {
enter: 150,
exit: 150
},
options: this.props.transitionOptions,
unmountOnExit: true,
onEnter: this.onEnter,
onEntering: this.onEntering,
onEntered: this.onEntered,
onExit: this.onExit,
onExited: this.onExited
}, element));
return /*#__PURE__*/React__default["default"].createElement(Portal, {
element: galleriaWrapper
});
} else {
return element;
}
}
}, {
key: "render",
value: function render() {
return this.props.value && this.props.value.length > 0 && this.renderGalleria();
}
}]);
return Galleria;
}(React.Component);
_defineProperty(Galleria, "defaultProps", {
id: null,
value: null,
activeIndex: 0,
fullScreen: false,
item: null,
thumbnail: null,
indicator: null,
caption: null,
className: null,
style: null,
header: null,
footer: null,
numVisible: 3,
responsiveOptions: null,
showItemNavigators: false,
showThumbnailNavigators: true,
showItemNavigatorsOnHover: false,
changeItemOnIndicatorHover: false,
circular: false,
autoPlay: false,
transitionInterval: 4000,
showThumbnails: true,
thumbnailsPosition: "bottom",
verticalThumbnailViewPortHeight: "300px",
showIndicators: false,
showIndicatorsOnItem: false,
indicatorsPosition: "bottom",
baseZIndex: 0,
transitionOptions: null,
onItemChange: null
});
function _createForOfIteratorHelper$a(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray$a(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it["return"] != null) it["return"](); } finally { if (didErr) throw err; } } }; }
function _unsupportedIterableToArray$a(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray$a(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray$a(o, minLen); }
function _arrayLikeToArray$a(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
function _createSuper$1c(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1c(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1c() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var GMap = /*#__PURE__*/function (_Component) {
_inherits(GMap, _Component);
var _super = _createSuper$1c(GMap);
function GMap() {
_classCallCheck(this, GMap);
return _super.apply(this, arguments);
}
_createClass(GMap, [{
key: "initMap",
value: function initMap() {
this.map = new google.maps.Map(this.container, this.props.options);
if (this.props.onMapReady) {
this.props.onMapReady({
map: this.map
});
}
this.initOverlays(this.props.overlays);
this.bindMapEvent('click', this.props.onMapClick);
this.bindMapEvent('dragend', this.props.onMapDragEnd);
this.bindMapEvent('zoom_changed', this.props.onZoomChanged);
}
}, {
key: "initOverlays",
value: function initOverlays(overlays) {
if (overlays) {
var _iterator = _createForOfIteratorHelper$a(overlays),
_step;
try {
for (_iterator.s(); !(_step = _iterator.n()).done;) {
var overlay = _step.value;
overlay.setMap(this.map);
this.bindOverlayEvents(overlay);
}
} catch (err) {
_iterator.e(err);
} finally {
_iterator.f();
}
}
}
}, {
key: "bindOverlayEvents",
value: function bindOverlayEvents(overlay) {
var _this = this;
overlay.addListener('click', function (event) {
if (_this.props.onOverlayClick) {
_this.props.onOverlayClick({
originalEvent: event,
overlay: overlay,
map: _this.map
});
}
});
if (overlay.getDraggable()) {
this.bindDragEvents(overlay);
}
}
}, {
key: "bindDragEvents",
value: function bindDragEvents(overlay) {
this.bindDragEvent(overlay, 'dragstart', this.props.onOverlayDragStart);
this.bindDragEvent(overlay, 'drag', this.props.onOverlayDrag);
this.bindDragEvent(overlay, 'dragend', this.props.onOverlayDragEnd);
}
}, {
key: "bindMapEvent",
value: function bindMapEvent(eventName, callback) {
this.map.addListener(eventName, function (event) {
if (callback) {
callback(event);
}
});
}
}, {
key: "bindDragEvent",
value: function bindDragEvent(overlay, eventName, callback) {
var _this2 = this;
overlay.addListener(eventName, function (event) {
if (callback) {
callback({
originalEvent: event,
overlay: overlay,
map: _this2.map
});
}
});
}
}, {
key: "getMap",
value: function getMap() {
return this.map;
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps, prevState, snapshot) {
if (prevProps.overlays !== this.props.overlays) {
if (prevProps.overlays) {
var _iterator2 = _createForOfIteratorHelper$a(prevProps.overlays),
_step2;
try {
for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
var overlay = _step2.value;
google.maps.event.clearInstanceListeners(overlay);
overlay.setMap(null);
}
} catch (err) {
_iterator2.e(err);
} finally {
_iterator2.f();
}
}
this.initOverlays(this.props.overlays);
}
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
this.initMap();
}
}, {
key: "render",
value: function render() {
var _this3 = this;
return /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this3.container = el;
},
style: this.props.style,
className: this.props.className
});
}
}]);
return GMap;
}(React.Component);
_defineProperty(GMap, "defaultProps", {
options: null,
overlays: null,
style: null,
className: null,
onMapReady: null,
onMapClick: null,
onMapDragEnd: null,
onZoomChanged: null,
onOverlayDragStart: null,
onOverlayDrag: null,
onOverlayDragEnd: null,
onOverlayClick: null
});
function _createSuper$1b(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1b(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1b() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var InplaceDisplay = /*#__PURE__*/function (_Component) {
_inherits(InplaceDisplay, _Component);
var _super = _createSuper$1b(InplaceDisplay);
function InplaceDisplay() {
_classCallCheck(this, InplaceDisplay);
return _super.apply(this, arguments);
}
_createClass(InplaceDisplay, [{
key: "render",
value: function render() {
return this.props.children;
}
}]);
return InplaceDisplay;
}(React.Component);
var InplaceContent = /*#__PURE__*/function (_Component2) {
_inherits(InplaceContent, _Component2);
var _super2 = _createSuper$1b(InplaceContent);
function InplaceContent() {
_classCallCheck(this, InplaceContent);
return _super2.apply(this, arguments);
}
_createClass(InplaceContent, [{
key: "render",
value: function render() {
return this.props.children;
}
}]);
return InplaceContent;
}(React.Component);
var Inplace = /*#__PURE__*/function (_Component3) {
_inherits(Inplace, _Component3);
var _super3 = _createSuper$1b(Inplace);
function Inplace(props) {
var _this;
_classCallCheck(this, Inplace);
_this = _super3.call(this, props);
if (!_this.props.onToggle) {
_this.state = {
active: false
};
}
_this.open = _this.open.bind(_assertThisInitialized(_this));
_this.close = _this.close.bind(_assertThisInitialized(_this));
_this.onDisplayKeyDown = _this.onDisplayKeyDown.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(Inplace, [{
key: "open",
value: function open(event) {
if (this.props.disabled) {
return;
}
if (this.props.onOpen) {
this.props.onOpen(event);
}
if (this.props.onToggle) {
this.props.onToggle({
originalEvent: event,
value: true
});
} else {
this.setState({
active: true
});
}
}
}, {
key: "close",
value: function close(event) {
if (this.props.onClose) {
this.props.onClose(event);
}
if (this.props.onToggle) {
this.props.onToggle({
originalEvent: event,
value: false
});
} else {
this.setState({
active: false
});
}
}
}, {
key: "onDisplayKeyDown",
value: function onDisplayKeyDown(event) {
if (event.key === 'Enter') {
this.open(event);
event.preventDefault();
}
}
}, {
key: "isActive",
value: function isActive() {
return this.props.onToggle ? this.props.active : this.state.active;
}
}, {
key: "renderDisplay",
value: function renderDisplay(content) {
var className = classNames('p-inplace-display', {
'p-disabled': this.props.disabled
});
return /*#__PURE__*/React__default["default"].createElement("div", {
className: className,
onClick: this.open,
onKeyDown: this.onDisplayKeyDown,
tabIndex: this.props.tabIndex,
"aria-label": this.props.ariaLabel
}, content);
}
}, {
key: "renderCloseButton",
value: function renderCloseButton() {
if (this.props.closable) {
return /*#__PURE__*/React__default["default"].createElement(Button, {
type: "button",
className: "p-inplace-content-close",
icon: "pi pi-times",
onClick: this.close
});
}
return null;
}
}, {
key: "renderContent",
value: function renderContent(content) {
var closeButton = this.renderCloseButton();
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-inplace-content"
}, content, closeButton);
}
}, {
key: "renderChildren",
value: function renderChildren() {
var _this2 = this;
var active = this.isActive();
return React__default["default"].Children.map(this.props.children, function (child, i) {
if (active && child.type === InplaceContent) {
return _this2.renderContent(child);
} else if (!active && child.type === InplaceDisplay) {
return _this2.renderDisplay(child);
}
});
}
}, {
key: "render",
value: function render() {
var className = classNames('p-inplace p-component', {
'p-inplace-closable': this.props.closable
}, this.props.className);
return /*#__PURE__*/React__default["default"].createElement("div", {
className: className
}, this.renderChildren());
}
}]);
return Inplace;
}(React.Component);
_defineProperty(Inplace, "defaultProps", {
style: null,
className: null,
active: false,
closable: false,
disabled: false,
tabIndex: 0,
ariaLabel: null,
onOpen: null,
onClose: null,
onToggle: null
});
function ownKeys$o(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$o(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$o(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$o(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createSuper$1a(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1a(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1a() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var InputMask = /*#__PURE__*/function (_Component) {
_inherits(InputMask, _Component);
var _super = _createSuper$1a(InputMask);
function InputMask(props) {
var _this;
_classCallCheck(this, InputMask);
_this = _super.call(this, props);
_this.onFocus = _this.onFocus.bind(_assertThisInitialized(_this));
_this.onBlur = _this.onBlur.bind(_assertThisInitialized(_this));
_this.onKeyDown = _this.onKeyDown.bind(_assertThisInitialized(_this));
_this.onKeyPress = _this.onKeyPress.bind(_assertThisInitialized(_this));
_this.onInput = _this.onInput.bind(_assertThisInitialized(_this));
_this.handleInputChange = _this.handleInputChange.bind(_assertThisInitialized(_this));
_this.inputRef = /*#__PURE__*/React.createRef(_this.props.inputRef);
return _this;
}
_createClass(InputMask, [{
key: "caret",
value: function caret(first, last) {
var range, begin, end;
var inputEl = this.inputRef && this.inputRef.current;
if (!inputEl || !inputEl.offsetParent || inputEl !== document.activeElement) {
return;
}
if (typeof first === 'number') {
begin = first;
end = typeof last === 'number' ? last : begin;
if (inputEl.setSelectionRange) {
inputEl.setSelectionRange(begin, end);
} else if (inputEl['createTextRange']) {
range = inputEl['createTextRange']();
range.collapse(true);
range.moveEnd('character', end);
range.moveStart('character', begin);
range.select();
}
} else {
if (inputEl.setSelectionRange) {
begin = inputEl.selectionStart;
end = inputEl.selectionEnd;
} else if (document['selection'] && document['selection'].createRange) {
range = document['selection'].createRange();
begin = 0 - range.duplicate().moveStart('character', -100000);
end = begin + range.text.length;
}
return {
begin: begin,
end: end
};
}
}
}, {
key: "isCompleted",
value: function isCompleted() {
for (var i = this.firstNonMaskPos; i <= this.lastRequiredNonMaskPos; i++) {
if (this.tests[i] && this.buffer[i] === this.getPlaceholder(i)) {
return false;
}
}
return true;
}
}, {
key: "getPlaceholder",
value: function getPlaceholder(i) {
if (i < this.props.slotChar.length) {
return this.props.slotChar.charAt(i);
}
return this.props.slotChar.charAt(0);
}
}, {
key: "getValue",
value: function getValue() {
return this.props.unmask ? this.getUnmaskedValue() : this.inputRef && this.inputRef.current && this.inputRef.current.value;
}
}, {
key: "seekNext",
value: function seekNext(pos) {
while (++pos < this.len && !this.tests[pos]) {
}
return pos;
}
}, {
key: "seekPrev",
value: function seekPrev(pos) {
while (--pos >= 0 && !this.tests[pos]) {
}
return pos;
}
}, {
key: "shiftL",
value: function shiftL(begin, end) {
var i, j;
if (begin < 0) {
return;
}
for (i = begin, j = this.seekNext(end); i < this.len; i++) {
if (this.tests[i]) {
if (j < this.len && this.tests[i].test(this.buffer[j])) {
this.buffer[i] = this.buffer[j];
this.buffer[j] = this.getPlaceholder(j);
} else {
break;
}
j = this.seekNext(j);
}
}
this.writeBuffer();
this.caret(Math.max(this.firstNonMaskPos, begin));
}
}, {
key: "shiftR",
value: function shiftR(pos) {
var i, c, j, t;
for (i = pos, c = this.getPlaceholder(pos); i < this.len; i++) {
if (this.tests[i]) {
j = this.seekNext(i);
t = this.buffer[i];
this.buffer[i] = c;
if (j < this.len && this.tests[j].test(t)) {
c = t;
} else {
break;
}
}
}
}
}, {
key: "handleAndroidInput",
value: function handleAndroidInput(e) {
var curVal = this.inputRef.current.value;
var pos = this.caret();
if (this.oldVal && this.oldVal.length && this.oldVal.length > curVal.length) {
// a deletion or backspace happened
this.checkVal(true);
while (pos.begin > 0 && !this.tests[pos.begin - 1]) {
pos.begin--;
}
if (pos.begin === 0) {
while (pos.begin < this.firstNonMaskPos && !this.tests[pos.begin]) {
pos.begin++;
}
}
this.caret(pos.begin, pos.begin);
} else {
this.checkVal(true);
while (pos.begin < this.len && !this.tests[pos.begin]) {
pos.begin++;
}
this.caret(pos.begin, pos.begin);
}
if (this.props.onComplete && this.isCompleted()) {
this.props.onComplete({
originalEvent: e,
value: this.getValue()
});
}
}
}, {
key: "onBlur",
value: function onBlur(e) {
this.focus = false;
this.checkVal();
this.updateModel(e);
this.updateFilledState();
if (this.props.onBlur) {
this.props.onBlur(e);
}
if (this.inputRef.current.value !== this.focusText) {
var event = document.createEvent('HTMLEvents');
event.initEvent('change', true, false);
this.inputRef.current.dispatchEvent(event);
}
}
}, {
key: "onKeyDown",
value: function onKeyDown(e) {
if (this.props.readOnly) {
return;
}
var k = e.which || e.keyCode,
pos,
begin,
end;
var iPhone = /iphone/i.test(DomHandler.getUserAgent());
this.oldVal = this.inputRef.current.value; //backspace, delete, and escape get special treatment
if (k === 8 || k === 46 || iPhone && k === 127) {
pos = this.caret();
begin = pos.begin;
end = pos.end;
if (end - begin === 0) {
begin = k !== 46 ? this.seekPrev(begin) : end = this.seekNext(begin - 1);
end = k === 46 ? this.seekNext(end) : end;
}
this.clearBuffer(begin, end);
this.shiftL(begin, end - 1);
this.updateModel(e);
e.preventDefault();
} else if (k === 13) {
// enter
this.onBlur(e);
this.updateModel(e);
} else if (k === 27) {
// escape
this.inputRef.current.value = this.focusText;
this.caret(0, this.checkVal());
this.updateModel(e);
e.preventDefault();
}
}
}, {
key: "onKeyPress",
value: function onKeyPress(e) {
var _this2 = this;
if (this.props.readOnly) {
return;
}
var k = e.which || e.keyCode,
pos = this.caret(),
p,
c,
next,
completed;
if (e.ctrlKey || e.altKey || e.metaKey || k < 32) {
//Ignore
return;
} else if (k && k !== 13) {
if (pos.end - pos.begin !== 0) {
this.clearBuffer(pos.begin, pos.end);
this.shiftL(pos.begin, pos.end - 1);
}
p = this.seekNext(pos.begin - 1);
if (p < this.len) {
c = String.fromCharCode(k);
if (this.tests[p].test(c)) {
this.shiftR(p);
this.buffer[p] = c;
this.writeBuffer();
next = this.seekNext(p);
if (/android/i.test(DomHandler.getUserAgent())) {
//Path for CSP Violation on FireFox OS 1.1
var proxy = function proxy() {
_this2.caret(next);
};
setTimeout(proxy, 0);
} else {
this.caret(next);
}
if (pos.begin <= this.lastRequiredNonMaskPos) {
completed = this.isCompleted();
}
}
}
e.preventDefault();
}
this.updateModel(e);
if (this.props.onComplete && completed) {
this.props.onComplete({
originalEvent: e,
value: this.getValue()
});
}
}
}, {
key: "clearBuffer",
value: function clearBuffer(start, end) {
var i;
for (i = start; i < end && i < this.len; i++) {
if (this.tests[i]) {
this.buffer[i] = this.getPlaceholder(i);
}
}
}
}, {
key: "writeBuffer",
value: function writeBuffer() {
this.inputRef.current.value = this.buffer.join('');
}
}, {
key: "checkVal",
value: function checkVal(allow) {
this.isValueChecked = true; //try to place characters where they belong
var test = this.inputRef.current.value,
lastMatch = -1,
i,
c,
pos;
for (i = 0, pos = 0; i < this.len; i++) {
if (this.tests[i]) {
this.buffer[i] = this.getPlaceholder(i);
while (pos++ < test.length) {
c = test.charAt(pos - 1);
if (this.tests[i].test(c)) {
this.buffer[i] = c;
lastMatch = i;
break;
}
}
if (pos > test.length) {
this.clearBuffer(i + 1, this.len);
break;
}
} else {
if (this.buffer[i] === test.charAt(pos)) {
pos++;
}
if (i < this.partialPosition) {
lastMatch = i;
}
}
}
if (allow) {
this.writeBuffer();
} else if (lastMatch + 1 < this.partialPosition) {
if (this.props.autoClear || this.buffer.join('') === this.defaultBuffer) {
// Invalid value. Remove it and replace it with the
// mask, which is the default behavior.
if (this.inputRef.current.value) this.inputRef.current.value = '';
this.clearBuffer(0, this.len);
} else {
// Invalid value, but we opt to show the value to the
// user and allow them to correct their mistake.
this.writeBuffer();
}
} else {
this.writeBuffer();
this.inputRef.current.value = this.inputRef.current.value.substring(0, lastMatch + 1);
}
return this.partialPosition ? i : this.firstNonMaskPos;
}
}, {
key: "onFocus",
value: function onFocus(e) {
var _this3 = this;
if (this.props.readOnly) {
return;
}
this.focus = true;
clearTimeout(this.caretTimeoutId);
var pos;
this.focusText = this.inputRef.current.value;
pos = this.checkVal();
this.caretTimeoutId = setTimeout(function () {
if (_this3.inputRef.current !== document.activeElement) {
return;
}
_this3.writeBuffer();
if (pos === _this3.props.mask.replace("?", "").length) {
_this3.caret(0, pos);
} else {
_this3.caret(pos);
}
_this3.updateFilledState();
}, 10);
if (this.props.onFocus) {
this.props.onFocus(e);
}
}
}, {
key: "onInput",
value: function onInput(event) {
if (this.androidChrome) this.handleAndroidInput(event);else this.handleInputChange(event);
}
}, {
key: "handleInputChange",
value: function handleInputChange(e) {
if (this.props.readOnly) {
return;
}
var pos = this.checkVal(true);
this.caret(pos);
this.updateModel(e);
if (this.props.onComplete && this.isCompleted()) {
this.props.onComplete({
originalEvent: e,
value: this.getValue()
});
}
}
}, {
key: "getUnmaskedValue",
value: function getUnmaskedValue() {
var unmaskedBuffer = [];
for (var i = 0; i < this.buffer.length; i++) {
var c = this.buffer[i];
if (this.tests[i] && c !== this.getPlaceholder(i)) {
unmaskedBuffer.push(c);
}
}
return unmaskedBuffer.join('');
}
}, {
key: "updateModel",
value: function updateModel(e) {
if (this.props.onChange) {
var val = this.props.unmask ? this.getUnmaskedValue() : e && e.target.value;
this.props.onChange({
originalEvent: e,
value: this.defaultBuffer !== val ? val : '',
stopPropagation: function stopPropagation() {},
preventDefault: function preventDefault() {},
target: {
name: this.props.name,
id: this.props.id,
value: this.defaultBuffer !== val ? val : ''
}
});
}
}
}, {
key: "updateFilledState",
value: function updateFilledState() {
if (this.inputRef && this.inputRef.current && this.inputRef.current.value && this.inputRef.current.value.length > 0) DomHandler.addClass(this.inputRef.current, 'p-filled');else DomHandler.removeClass(this.inputRef.current, 'p-filled');
}
}, {
key: "updateValue",
value: function updateValue(allow) {
var _this4 = this;
var pos;
if (this.inputRef && this.inputRef.current) {
if (this.props.value == null) {
this.inputRef.current.value = '';
} else {
this.inputRef.current.value = this.props.value;
pos = this.checkVal(allow);
setTimeout(function () {
if (_this4.inputRef && _this4.inputRef.current) {
_this4.writeBuffer();
return _this4.checkVal(allow);
}
}, 10);
}
this.focusText = this.inputRef.current.value;
}
this.updateFilledState();
return pos;
}
}, {
key: "isValueUpdated",
value: function isValueUpdated() {
return this.props.unmask ? this.props.value !== this.getUnmaskedValue() : this.defaultBuffer !== this.inputRef.current.value && this.inputRef.current.value !== this.props.value;
}
}, {
key: "init",
value: function init() {
if (this.props.mask) {
this.tests = [];
this.partialPosition = this.props.mask.length;
this.len = this.props.mask.length;
this.firstNonMaskPos = null;
this.defs = {
'9': '[0-9]',
'a': '[A-Za-z]',
'*': '[A-Za-z0-9]'
};
var ua = DomHandler.getUserAgent();
this.androidChrome = /chrome/i.test(ua) && /android/i.test(ua);
var maskTokens = this.props.mask.split('');
for (var i = 0; i < maskTokens.length; i++) {
var c = maskTokens[i];
if (c === '?') {
this.len--;
this.partialPosition = i;
} else if (this.defs[c]) {
this.tests.push(new RegExp(this.defs[c]));
if (this.firstNonMaskPos === null) {
this.firstNonMaskPos = this.tests.length - 1;
}
if (i < this.partialPosition) {
this.lastRequiredNonMaskPos = this.tests.length - 1;
}
} else {
this.tests.push(null);
}
}
this.buffer = [];
for (var _i = 0; _i < maskTokens.length; _i++) {
var _c = maskTokens[_i];
if (_c !== '?') {
if (this.defs[_c]) this.buffer.push(this.getPlaceholder(_i));else this.buffer.push(_c);
}
}
this.defaultBuffer = this.buffer.join('');
}
}
}, {
key: "updateInputRef",
value: function updateInputRef() {
var ref = this.props.inputRef;
if (ref) {
if (typeof ref === 'function') {
ref(this.inputRef.current);
} else {
ref.current = this.inputRef.current;
}
}
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
this.updateInputRef();
this.init();
this.updateValue();
if (this.props.tooltip) {
this.renderTooltip();
}
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps) {
if (prevProps.tooltip !== this.props.tooltip || prevProps.tooltipOptions !== this.props.tooltipOptions) {
if (this.tooltip) this.tooltip.update(_objectSpread$o({
content: this.props.tooltip
}, this.props.tooltipOptions || {}));else this.renderTooltip();
}
if (this.isValueUpdated()) {
this.updateValue();
}
if (prevProps.mask !== this.props.mask) {
this.init();
this.caret(this.updateValue(true));
this.updateModel();
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
if (this.tooltip) {
this.tooltip.destroy();
this.tooltip = null;
}
}
}, {
key: "renderTooltip",
value: function renderTooltip() {
this.tooltip = tip({
target: this.inputRef.current,
content: this.props.tooltip,
options: this.props.tooltipOptions
});
}
}, {
key: "render",
value: function render() {
var inputMaskClassName = classNames('p-inputmask', this.props.className);
return /*#__PURE__*/React__default["default"].createElement(InputText, {
id: this.props.id,
ref: this.inputRef,
type: this.props.type,
name: this.props.name,
style: this.props.style,
className: inputMaskClassName,
placeholder: this.props.placeholder,
size: this.props.size,
maxLength: this.props.maxLength,
tabIndex: this.props.tabIndex,
disabled: this.props.disabled,
readOnly: this.props.readOnly,
onFocus: this.onFocus,
onBlur: this.onBlur,
onKeyDown: this.onKeyDown,
onKeyPress: this.onKeyPress,
onInput: this.onInput,
onPaste: this.handleInputChange,
required: this.props.required,
"aria-labelledby": this.props.ariaLabelledBy
});
}
}]);
return InputMask;
}(React.Component);
_defineProperty(InputMask, "defaultProps", {
id: null,
inputRef: null,
value: null,
type: 'text',
mask: null,
slotChar: '_',
autoClear: true,
unmask: false,
style: null,
className: null,
placeholder: null,
size: null,
maxLength: null,
tabIndex: null,
disabled: false,
readOnly: false,
name: null,
required: false,
tooltip: null,
tooltipOptions: null,
ariaLabelledBy: null,
onComplete: null,
onChange: null,
onFocus: null,
onBlur: null
});
function ownKeys$n(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$n(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$n(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$n(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createSuper$19(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$19(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$19() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var InputSwitch = /*#__PURE__*/function (_Component) {
_inherits(InputSwitch, _Component);
var _super = _createSuper$19(InputSwitch);
function InputSwitch(props) {
var _this;
_classCallCheck(this, InputSwitch);
_this = _super.call(this, props);
_this.state = {
focused: false
};
_this.onClick = _this.onClick.bind(_assertThisInitialized(_this));
_this.toggle = _this.toggle.bind(_assertThisInitialized(_this));
_this.onFocus = _this.onFocus.bind(_assertThisInitialized(_this));
_this.onBlur = _this.onBlur.bind(_assertThisInitialized(_this));
_this.onKeyDown = _this.onKeyDown.bind(_assertThisInitialized(_this));
_this.inputRef = /*#__PURE__*/React.createRef(_this.props.inputRef);
return _this;
}
_createClass(InputSwitch, [{
key: "onClick",
value: function onClick(event) {
if (this.props.disabled) {
return;
}
this.toggle(event);
this.inputRef.current.focus();
event.preventDefault();
}
}, {
key: "toggle",
value: function toggle(event) {
if (this.props.onChange) {
var value = this.isChecked() ? this.props.falseValue : this.props.trueValue;
this.props.onChange({
originalEvent: event,
value: value,
stopPropagation: function stopPropagation() {},
preventDefault: function preventDefault() {},
target: {
name: this.props.name,
id: this.props.id,
value: value
}
});
}
}
}, {
key: "onFocus",
value: function onFocus(event) {
var _this2 = this;
var currentEvent = event;
this.setState({
focused: true
}, function () {
if (_this2.props.onFocus) {
_this2.props.onFocus(currentEvent);
}
});
}
}, {
key: "onBlur",
value: function onBlur(event) {
var _this3 = this;
var currentEvent = event;
this.setState({
focused: false
}, function () {
if (_this3.props.onBlur) {
_this3.props.onBlur(currentEvent);
}
});
}
}, {
key: "onKeyDown",
value: function onKeyDown(event) {
if (event.key === 'Enter') {
this.onClick(event);
}
}
}, {
key: "updateInputRef",
value: function updateInputRef() {
var ref = this.props.inputRef;
if (ref) {
if (typeof ref === 'function') {
ref(this.inputRef.current);
} else {
ref.current = this.inputRef.current;
}
}
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
this.updateInputRef();
if (this.props.tooltip) {
this.renderTooltip();
}
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps) {
if (prevProps.tooltip !== this.props.tooltip || prevProps.tooltipOptions !== this.props.tooltipOptions) {
if (this.tooltip) this.tooltip.update(_objectSpread$n({
content: this.props.tooltip
}, this.props.tooltipOptions || {}));else this.renderTooltip();
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
if (this.tooltip) {
this.tooltip.destroy();
this.tooltip = null;
}
}
}, {
key: "renderTooltip",
value: function renderTooltip() {
this.tooltip = tip({
target: this.container,
content: this.props.tooltip,
options: this.props.tooltipOptions
});
}
}, {
key: "isChecked",
value: function isChecked() {
return this.props.checked === this.props.trueValue;
}
}, {
key: "render",
value: function render() {
var _this4 = this;
var checked = this.isChecked();
var className = classNames('p-inputswitch p-component', {
'p-inputswitch-checked': checked,
'p-disabled': this.props.disabled,
'p-inputswitch-focus': this.state.focused
}, this.props.className);
var inputSwitchProps = ObjectUtils.findDiffKeys(this.props, InputSwitch.defaultProps);
return /*#__PURE__*/React__default["default"].createElement("div", _extends({
ref: function ref(el) {
return _this4.container = el;
},
id: this.props.id,
className: className,
style: this.props.style,
onClick: this.onClick,
role: "checkbox",
"aria-checked": checked
}, inputSwitchProps), /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-hidden-accessible"
}, /*#__PURE__*/React__default["default"].createElement("input", {
ref: this.inputRef,
type: "checkbox",
id: this.props.inputId,
name: this.props.name,
checked: checked,
onChange: this.toggle,
onFocus: this.onFocus,
onBlur: this.onBlur,
onKeyDown: this.onKeyDown,
disabled: this.props.disabled,
role: "switch",
"aria-checked": checked,
"aria-labelledby": this.props.ariaLabelledBy
})), /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-inputswitch-slider"
}));
}
}]);
return InputSwitch;
}(React.Component);
_defineProperty(InputSwitch, "defaultProps", {
id: null,
inputRef: null,
style: null,
className: null,
inputId: null,
name: null,
checked: false,
trueValue: true,
falseValue: false,
disabled: false,
tooltip: null,
tooltipOptions: null,
ariaLabelledBy: null,
onChange: null,
onFocus: null,
onBlur: null
});
function ownKeys$m(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$m(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$m(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$m(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createSuper$18(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$18(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$18() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var InputTextareaComponent = /*#__PURE__*/function (_Component) {
_inherits(InputTextareaComponent, _Component);
var _super = _createSuper$18(InputTextareaComponent);
function InputTextareaComponent(props) {
var _this;
_classCallCheck(this, InputTextareaComponent);
_this = _super.call(this, props);
_this.onFocus = _this.onFocus.bind(_assertThisInitialized(_this));
_this.onBlur = _this.onBlur.bind(_assertThisInitialized(_this));
_this.onKeyUp = _this.onKeyUp.bind(_assertThisInitialized(_this));
_this.onInput = _this.onInput.bind(_assertThisInitialized(_this));
_this.elementRef = /*#__PURE__*/React.createRef(_this.props.forwardRef);
return _this;
}
_createClass(InputTextareaComponent, [{
key: "onFocus",
value: function onFocus(e) {
if (this.props.autoResize) {
this.resize();
}
if (this.props.onFocus) {
this.props.onFocus(e);
}
}
}, {
key: "onBlur",
value: function onBlur(e) {
if (this.props.autoResize) {
this.resize();
}
if (this.props.onBlur) {
this.props.onBlur(e);
}
}
}, {
key: "onKeyUp",
value: function onKeyUp(e) {
if (this.props.autoResize) {
this.resize();
}
if (this.props.onKeyUp) {
this.props.onKeyUp(e);
}
}
}, {
key: "onInput",
value: function onInput(e) {
if (this.props.autoResize) {
this.resize();
}
if (e.target.value.length > 0) DomHandler.addClass(e.target, 'p-filled');else DomHandler.removeClass(e.target, 'p-filled');
if (this.props.onInput) {
this.props.onInput(e);
}
}
}, {
key: "resize",
value: function resize(initial) {
var inputEl = this.elementRef && this.elementRef.current;
if (inputEl && DomHandler.isVisible(inputEl)) {
if (!this.cachedScrollHeight) {
this.cachedScrollHeight = inputEl.scrollHeight;
inputEl.style.overflow = "hidden";
}
if (this.cachedScrollHeight !== inputEl.scrollHeight || initial) {
inputEl.style.height = '';
inputEl.style.height = inputEl.scrollHeight + 'px';
if (parseFloat(inputEl.style.height) >= parseFloat(inputEl.style.maxHeight)) {
inputEl.style.overflowY = "scroll";
inputEl.style.height = inputEl.style.maxHeight;
} else {
inputEl.style.overflow = "hidden";
}
this.cachedScrollHeight = inputEl.scrollHeight;
}
}
}
}, {
key: "isFilled",
value: function isFilled() {
return this.props.value != null && this.props.value.toString().length > 0 || this.props.defaultValue != null && this.props.defaultValue.toString().length > 0 || this.elementRef && this.elementRef.current && this.elementRef.current.value.toString().length > 0;
}
}, {
key: "updateForwardRef",
value: function updateForwardRef() {
var ref = this.props.forwardRef;
if (ref) {
if (typeof ref === 'function') {
ref(this.elementRef.current);
} else {
ref.current = this.elementRef.current;
}
}
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
this.updateForwardRef();
if (this.props.tooltip) {
this.renderTooltip();
}
if (this.props.autoResize) {
this.resize(true);
}
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps) {
if (prevProps.tooltip !== this.props.tooltip || prevProps.tooltipOptions !== this.props.tooltipOptions) {
if (this.tooltip) this.tooltip.update(_objectSpread$m({
content: this.props.tooltip
}, this.props.tooltipOptions || {}));else this.renderTooltip();
}
if (this.props.autoResize) {
this.resize(true);
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
if (this.tooltip) {
this.tooltip.destroy();
this.tooltip = null;
}
}
}, {
key: "renderTooltip",
value: function renderTooltip() {
this.tooltip = tip({
target: this.elementRef.current,
content: this.props.tooltip,
options: this.props.tooltipOptions
});
}
}, {
key: "render",
value: function render() {
var className = classNames('p-inputtextarea p-inputtext p-component', {
'p-disabled': this.props.disabled,
'p-filled': this.isFilled(),
'p-inputtextarea-resizable': this.props.autoResize
}, this.props.className);
var textareaProps = ObjectUtils.findDiffKeys(this.props, InputTextareaComponent.defaultProps);
return /*#__PURE__*/React__default["default"].createElement("textarea", _extends({
ref: this.elementRef
}, textareaProps, {
className: className,
onFocus: this.onFocus,
onBlur: this.onBlur,
onKeyUp: this.onKeyUp,
onInput: this.onInput
}));
}
}]);
return InputTextareaComponent;
}(React.Component);
_defineProperty(InputTextareaComponent, "defaultProps", {
autoResize: false,
tooltip: null,
tooltipOptions: null,
onInput: null,
forwardRef: null
});
var InputTextarea = /*#__PURE__*/React__default["default"].forwardRef(function (props, ref) {
return /*#__PURE__*/React__default["default"].createElement(InputTextareaComponent, _extends({
forwardRef: ref
}, props));
});
function _createSuper$17(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$17(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$17() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var Knob = /*#__PURE__*/function (_Component) {
_inherits(Knob, _Component);
var _super = _createSuper$17(Knob);
function Knob(props) {
var _this;
_classCallCheck(this, Knob);
_this = _super.call(this, props);
_this.state = {};
_this.radius = 40;
_this.midX = 50;
_this.midY = 50;
_this.minRadians = 4 * Math.PI / 3;
_this.maxRadians = -Math.PI / 3;
_this.onClick = _this.onClick.bind(_assertThisInitialized(_this));
_this.onMouseDown = _this.onMouseDown.bind(_assertThisInitialized(_this));
_this.onMouseUp = _this.onMouseUp.bind(_assertThisInitialized(_this));
_this.onTouchStart = _this.onTouchStart.bind(_assertThisInitialized(_this));
_this.onTouchEnd = _this.onTouchEnd.bind(_assertThisInitialized(_this));
_this.onMouseMove = _this.onMouseMove.bind(_assertThisInitialized(_this));
_this.onTouchMove = _this.onTouchMove.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(Knob, [{
key: "updateValue",
value: function updateValue(offsetX, offsetY) {
var dx = offsetX - this.props.size / 2;
var dy = this.props.size / 2 - offsetY;
var angle = Math.atan2(dy, dx);
var start = -Math.PI / 2 - Math.PI / 6;
this.updateModel(angle, start);
}
}, {
key: "updateModel",
value: function updateModel(angle, start) {
var mappedValue;
if (angle > this.maxRadians) mappedValue = this.mapRange(angle, this.minRadians, this.maxRadians, this.props.min, this.props.max);else if (angle < start) mappedValue = this.mapRange(angle + 2 * Math.PI, this.minRadians, this.maxRadians, this.props.min, this.props.max);else return;
if (this.props.onChange) {
var newValue = Math.round((mappedValue - this.props.min) / this.props.step) * this.props.step + this.props.min;
this.props.onChange({
value: newValue
});
}
}
}, {
key: "mapRange",
value: function mapRange(x, inMin, inMax, outMin, outMax) {
return (x - inMin) * (outMax - outMin) / (inMax - inMin) + outMin;
}
}, {
key: "onClick",
value: function onClick(event) {
if (!this.props.disabled && !this.props.readOnly) {
this.updateValue(event.nativeEvent.offsetX, event.nativeEvent.offsetY);
}
}
}, {
key: "onMouseDown",
value: function onMouseDown(event) {
if (!this.props.disabled && !this.props.readOnly) {
this.windowMouseMoveListener = this.onMouseMove;
this.windowMouseUpListener = this.onMouseUp;
window.addEventListener('mousemove', this.windowMouseMoveListener);
window.addEventListener('mouseup', this.windowMouseUpListener);
event.preventDefault();
}
}
}, {
key: "onMouseUp",
value: function onMouseUp(event) {
if (!this.props.disabled && !this.props.readOnly) {
window.removeEventListener('mousemove', this.windowMouseMoveListener);
window.removeEventListener('mouseup', this.windowMouseUpListener);
this.windowMouseMoveListener = null;
this.windowMouseUpListener = null;
event.preventDefault();
}
}
}, {
key: "onTouchStart",
value: function onTouchStart(event) {
if (!this.props.disabled && !this.props.readOnly) {
this.windowTouchMoveListener = this.onTouchMove;
this.windowTouchEndListener = this.onTouchEnd;
window.addEventListener('touchmove', this.windowTouchMoveListener, {
passive: false,
cancelable: false
});
window.addEventListener('touchend', this.windowTouchEndListener);
}
}
}, {
key: "onTouchEnd",
value: function onTouchEnd(event) {
if (!this.props.disabled && !this.props.readOnly) {
window.removeEventListener('touchmove', this.windowTouchMoveListener);
window.removeEventListener('touchend', this.windowTouchEndListener);
this.windowTouchMoveListener = null;
this.windowTouchEndListener = null;
}
}
}, {
key: "onMouseMove",
value: function onMouseMove(event) {
if (!this.props.disabled && !this.props.readOnly) {
this.updateValue(event.offsetX, event.offsetY);
event.preventDefault();
}
}
}, {
key: "onTouchMove",
value: function onTouchMove(event) {
if (!this.props.disabled && !this.props.readOnly && event.touches.length === 1) {
var rect = this.element.getBoundingClientRect();
var touch = event.targetTouches.item(0);
var offsetX = touch.clientX - rect.left;
var offsetY = touch.clientY - rect.top;
this.updateValue(offsetX, offsetY);
event.preventDefault();
}
}
}, {
key: "rangePath",
value: function rangePath() {
return "M ".concat(this.minX(), " ").concat(this.minY(), " A ").concat(this.radius, " ").concat(this.radius, " 0 1 1 ").concat(this.maxX(), " ").concat(this.maxY());
}
}, {
key: "valuePath",
value: function valuePath() {
return "M ".concat(this.zeroX(), " ").concat(this.zeroY(), " A ").concat(this.radius, " ").concat(this.radius, " 0 ").concat(this.largeArc(), " ").concat(this.sweep(), " ").concat(this.valueX(), " ").concat(this.valueY());
}
}, {
key: "zeroRadians",
value: function zeroRadians() {
if (this.props.min > 0 && this.props.max > 0) return this.mapRange(this.props.min, this.props.min, this.props.max, this.minRadians, this.maxRadians);else return this.mapRange(0, this.props.min, this.props.max, this.minRadians, this.maxRadians);
}
}, {
key: "valueRadians",
value: function valueRadians() {
return this.mapRange(this.props.value, this.props.min, this.props.max, this.minRadians, this.maxRadians);
}
}, {
key: "minX",
value: function minX() {
return this.midX + Math.cos(this.minRadians) * this.radius;
}
}, {
key: "minY",
value: function minY() {
return this.midY - Math.sin(this.minRadians) * this.radius;
}
}, {
key: "maxX",
value: function maxX() {
return this.midX + Math.cos(this.maxRadians) * this.radius;
}
}, {
key: "maxY",
value: function maxY() {
return this.midY - Math.sin(this.maxRadians) * this.radius;
}
}, {
key: "zeroX",
value: function zeroX() {
return this.midX + Math.cos(this.zeroRadians()) * this.radius;
}
}, {
key: "zeroY",
value: function zeroY() {
return this.midY - Math.sin(this.zeroRadians()) * this.radius;
}
}, {
key: "valueX",
value: function valueX() {
return this.midX + Math.cos(this.valueRadians()) * this.radius;
}
}, {
key: "valueY",
value: function valueY() {
return this.midY - Math.sin(this.valueRadians()) * this.radius;
}
}, {
key: "largeArc",
value: function largeArc() {
return Math.abs(this.zeroRadians() - this.valueRadians()) < Math.PI ? 0 : 1;
}
}, {
key: "sweep",
value: function sweep() {
return this.valueRadians() > this.zeroRadians() ? 0 : 1;
}
}, {
key: "valueToDisplay",
value: function valueToDisplay() {
return this.props.valueTemplate.replace("{value}", this.props.value.toString());
}
}, {
key: "render",
value: function render() {
var _this2 = this;
var containerClassName = classNames('p-knob p-component', {
'p-disabled': this.props.disabled
}, this.props.className);
var text = this.props.showValue && /*#__PURE__*/React__default["default"].createElement("text", {
x: 50,
y: 57,
textAnchor: 'middle',
fill: this.props.textColor,
className: 'p-knob-text',
name: this.props.name
}, this.valueToDisplay());
return /*#__PURE__*/React__default["default"].createElement("div", {
id: this.props.id,
className: containerClassName,
style: this.props.style,
ref: function ref(el) {
return _this2.element = el;
}
}, /*#__PURE__*/React__default["default"].createElement("svg", {
viewBox: "0 0 100 100",
width: this.props.size,
height: this.props.size,
onClick: this.onClick,
onMouseDown: this.onMouseDown,
onMouseUp: this.onMouseUp,
onTouchStart: this.onTouchStart,
onTouchEnd: this.onTouchEnd
}, /*#__PURE__*/React__default["default"].createElement("path", {
d: this.rangePath(),
strokeWidth: this.props.strokeWidth,
stroke: this.props.rangeColor,
className: 'p-knob-range'
}), /*#__PURE__*/React__default["default"].createElement("path", {
d: this.valuePath(),
strokeWidth: this.props.strokeWidth,
stroke: this.props.valueColor,
className: 'p-knob-value'
}), text));
}
}]);
return Knob;
}(React.Component);
_defineProperty(Knob, "defaultProps", {
id: null,
style: null,
className: null,
value: null,
size: 100,
disabled: false,
readOnly: false,
showValue: true,
step: 1,
min: 0,
max: 100,
strokeWidth: 14,
name: null,
valueColor: 'var(--primary-color, Black)',
rangeColor: 'var(--surface-d, LightGray)',
textColor: 'var(--text-color-secondary, Black)',
valueTemplate: '{value}',
onChange: null
});
function _createSuper$16(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$16(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$16() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var ListBoxItem = /*#__PURE__*/function (_Component) {
_inherits(ListBoxItem, _Component);
var _super = _createSuper$16(ListBoxItem);
function ListBoxItem(props) {
var _this;
_classCallCheck(this, ListBoxItem);
_this = _super.call(this, props);
_this.onClick = _this.onClick.bind(_assertThisInitialized(_this));
_this.onTouchEnd = _this.onTouchEnd.bind(_assertThisInitialized(_this));
_this.onKeyDown = _this.onKeyDown.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(ListBoxItem, [{
key: "onClick",
value: function onClick(event) {
if (this.props.onClick) {
this.props.onClick({
originalEvent: event,
option: this.props.option
});
}
event.preventDefault();
}
}, {
key: "onTouchEnd",
value: function onTouchEnd(event) {
if (this.props.onTouchEnd) {
this.props.onTouchEnd({
originalEvent: event,
option: this.props.option
});
}
}
}, {
key: "onKeyDown",
value: function onKeyDown(event) {
var item = event.currentTarget;
switch (event.which) {
//down
case 40:
var nextItem = this.findNextItem(item);
if (nextItem) {
nextItem.focus();
}
event.preventDefault();
break;
//up
case 38:
var prevItem = this.findPrevItem(item);
if (prevItem) {
prevItem.focus();
}
event.preventDefault();
break;
//enter
case 13:
this.onClick(event);
event.preventDefault();
break;
}
}
}, {
key: "findNextItem",
value: function findNextItem(item) {
var nextItem = item.nextElementSibling;
if (nextItem) return DomHandler.hasClass(nextItem, 'p-disabled') || DomHandler.hasClass(nextItem, 'p-listbox-item-group') ? this.findNextItem(nextItem) : nextItem;else return null;
}
}, {
key: "findPrevItem",
value: function findPrevItem(item) {
var prevItem = item.previousElementSibling;
if (prevItem) return DomHandler.hasClass(prevItem, 'p-disabled') || DomHandler.hasClass(prevItem, 'p-listbox-item-group') ? this.findPrevItem(prevItem) : prevItem;else return null;
}
}, {
key: "render",
value: function render() {
var className = classNames('p-listbox-item', {
'p-highlight': this.props.selected,
'p-disabled': this.props.disabled
}, this.props.option.className);
var content = this.props.template ? ObjectUtils.getJSXElement(this.props.template, this.props.option) : this.props.label;
return /*#__PURE__*/React__default["default"].createElement("li", {
className: className,
onClick: this.onClick,
onTouchEnd: this.onTouchEnd,
onKeyDown: this.onKeyDown,
tabIndex: this.props.tabIndex,
"aria-label": this.props.label,
key: this.props.label,
role: "option",
"aria-selected": this.props.selected
}, content, /*#__PURE__*/React__default["default"].createElement(Ripple, null));
}
}]);
return ListBoxItem;
}(React.Component);
_defineProperty(ListBoxItem, "defaultProps", {
option: null,
label: null,
selected: false,
disabled: false,
tabIndex: null,
onClick: null,
onTouchEnd: null,
template: null
});
function _createSuper$15(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$15(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$15() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var ListBoxHeader = /*#__PURE__*/function (_Component) {
_inherits(ListBoxHeader, _Component);
var _super = _createSuper$15(ListBoxHeader);
function ListBoxHeader(props) {
var _this;
_classCallCheck(this, ListBoxHeader);
_this = _super.call(this, props);
_this.onFilter = _this.onFilter.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(ListBoxHeader, [{
key: "onFilter",
value: function onFilter(event) {
if (this.props.onFilter) {
this.props.onFilter({
originalEvent: event,
value: event.target.value
});
}
}
}, {
key: "render",
value: function render() {
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-listbox-header"
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-listbox-filter-container"
}, /*#__PURE__*/React__default["default"].createElement(InputText, {
type: "text",
value: this.props.filter,
onChange: this.onFilter,
className: "p-listbox-filter",
disabled: this.props.disabled,
placeholder: this.props.filterPlaceholder
}), /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-listbox-filter-icon pi pi-search"
})));
}
}]);
return ListBoxHeader;
}(React.Component);
_defineProperty(ListBoxHeader, "defaultProps", {
filter: null,
filterPlaceholder: null,
disabled: false,
onFilter: null
});
function _createForOfIteratorHelper$9(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray$9(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it["return"] != null) it["return"](); } finally { if (didErr) throw err; } } }; }
function _unsupportedIterableToArray$9(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray$9(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray$9(o, minLen); }
function _arrayLikeToArray$9(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
function ownKeys$l(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$l(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$l(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$l(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createSuper$14(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$14(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$14() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var ListBox = /*#__PURE__*/function (_Component) {
_inherits(ListBox, _Component);
var _super = _createSuper$14(ListBox);
function ListBox(props) {
var _this;
_classCallCheck(this, ListBox);
_this = _super.call(this, props);
_this.state = {};
if (!_this.props.onFilterValueChange) {
_this.state.filterValue = '';
}
_this.onFilter = _this.onFilter.bind(_assertThisInitialized(_this));
_this.onOptionSelect = _this.onOptionSelect.bind(_assertThisInitialized(_this));
_this.onOptionTouchEnd = _this.onOptionTouchEnd.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(ListBox, [{
key: "componentDidMount",
value: function componentDidMount() {
if (this.props.tooltip) {
this.renderTooltip();
}
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps) {
if (prevProps.tooltip !== this.props.tooltip || prevProps.tooltipOptions !== this.props.tooltipOptions) {
if (this.tooltip) this.tooltip.update(_objectSpread$l({
content: this.props.tooltip
}, this.props.tooltipOptions || {}));else this.renderTooltip();
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
if (this.tooltip) {
this.tooltip.destroy();
this.tooltip = null;
}
}
}, {
key: "renderTooltip",
value: function renderTooltip() {
this.tooltip = tip({
target: this.element,
content: this.props.tooltip,
options: this.props.tooltipOptions
});
}
}, {
key: "getFilterValue",
value: function getFilterValue() {
return (this.props.onFilterValueChange ? this.props.filterValue : this.state.filterValue) || '';
}
}, {
key: "onOptionSelect",
value: function onOptionSelect(event) {
var option = event.option;
if (this.props.disabled || this.isOptionDisabled(option)) {
return;
}
if (this.props.multiple) this.onOptionSelectMultiple(event.originalEvent, option);else this.onOptionSelectSingle(event.originalEvent, option);
this.optionTouched = false;
}
}, {
key: "onOptionTouchEnd",
value: function onOptionTouchEnd() {
if (this.props.disabled) {
return;
}
this.optionTouched = true;
}
}, {
key: "onOptionSelectSingle",
value: function onOptionSelectSingle(event, option) {
var selected = this.isSelected(option);
var valueChanged = false;
var value = null;
var metaSelection = this.optionTouched ? false : this.props.metaKeySelection;
if (metaSelection) {
var metaKey = event.metaKey || event.ctrlKey;
if (selected) {
if (metaKey) {
value = null;
valueChanged = true;
}
} else {
value = this.getOptionValue(option);
valueChanged = true;
}
} else {
value = selected ? null : this.getOptionValue(option);
valueChanged = true;
}
if (valueChanged) {
this.updateModel(event, value);
}
}
}, {
key: "onOptionSelectMultiple",
value: function onOptionSelectMultiple(event, option) {
var selected = this.isSelected(option);
var valueChanged = false;
var value = null;
var metaSelection = this.optionTouched ? false : this.props.metaKeySelection;
if (metaSelection) {
var metaKey = event.metaKey || event.ctrlKey;
if (selected) {
if (metaKey) value = this.removeOption(option);else value = [this.getOptionValue(option)];
valueChanged = true;
} else {
value = metaKey ? this.props.value || [] : [];
value = [].concat(_toConsumableArray(value), [this.getOptionValue(option)]);
valueChanged = true;
}
} else {
if (selected) value = this.removeOption(option);else value = [].concat(_toConsumableArray(this.props.value || []), [this.getOptionValue(option)]);
valueChanged = true;
}
if (valueChanged) {
this.props.onChange({
originalEvent: event,
value: value,
stopPropagation: function stopPropagation() {},
preventDefault: function preventDefault() {},
target: {
name: this.props.name,
id: this.props.id,
value: value
}
});
}
}
}, {
key: "onFilter",
value: function onFilter(event) {
var originalEvent = event.originalEvent,
value = event.value;
if (this.props.onFilterValueChange) {
this.props.onFilterValueChange({
originalEvent: originalEvent,
value: value
});
} else {
this.setState({
filterValue: value
});
}
}
}, {
key: "updateModel",
value: function updateModel(event, value) {
if (this.props.onChange) {
this.props.onChange({
originalEvent: event,
value: value,
stopPropagation: function stopPropagation() {},
preventDefault: function preventDefault() {},
target: {
name: this.props.name,
id: this.props.id,
value: value
}
});
}
}
}, {
key: "removeOption",
value: function removeOption(option) {
var _this2 = this;
return this.props.value.filter(function (val) {
return !ObjectUtils.equals(val, _this2.getOptionValue(option), _this2.props.dataKey);
});
}
}, {
key: "isSelected",
value: function isSelected(option) {
var selected = false;
var optionValue = this.getOptionValue(option);
if (this.props.multiple) {
if (this.props.value) {
var _iterator = _createForOfIteratorHelper$9(this.props.value),
_step;
try {
for (_iterator.s(); !(_step = _iterator.n()).done;) {
var val = _step.value;
if (ObjectUtils.equals(val, optionValue, this.props.dataKey)) {
selected = true;
break;
}
}
} catch (err) {
_iterator.e(err);
} finally {
_iterator.f();
}
}
} else {
selected = ObjectUtils.equals(this.props.value, optionValue, this.props.dataKey);
}
return selected;
}
}, {
key: "filter",
value: function filter(option) {
var filterValue = this.getFilterValue().trim().toLocaleLowerCase(this.props.filterLocale);
var optionLabel = this.getOptionLabel(option).toLocaleLowerCase(this.props.filterLocale);
return optionLabel.indexOf(filterValue) > -1;
}
}, {
key: "hasFilter",
value: function hasFilter() {
var filter = this.getFilterValue();
return filter && filter.trim().length > 0;
}
}, {
key: "getOptionLabel",
value: function getOptionLabel(option) {
return this.props.optionLabel ? ObjectUtils.resolveFieldData(option, this.props.optionLabel) : option && option['label'] !== undefined ? option['label'] : option;
}
}, {
key: "getOptionValue",
value: function getOptionValue(option) {
return this.props.optionValue ? ObjectUtils.resolveFieldData(option, this.props.optionValue) : option && option['value'] !== undefined ? option['value'] : option;
}
}, {
key: "getOptionRenderKey",
value: function getOptionRenderKey(option) {
return this.props.dataKey ? ObjectUtils.resolveFieldData(option, this.props.dataKey) : this.getOptionLabel(option);
}
}, {
key: "isOptionDisabled",
value: function isOptionDisabled(option) {
if (this.props.optionDisabled) {
return ObjectUtils.isFunction(this.props.optionDisabled) ? this.props.optionDisabled(option) : ObjectUtils.resolveFieldData(option, this.props.optionDisabled);
}
return option && option['disabled'] !== undefined ? option['disabled'] : false;
}
}, {
key: "getOptionGroupRenderKey",
value: function getOptionGroupRenderKey(optionGroup) {
return ObjectUtils.resolveFieldData(optionGroup, this.props.optionGroupLabel);
}
}, {
key: "getOptionGroupLabel",
value: function getOptionGroupLabel(optionGroup) {
return ObjectUtils.resolveFieldData(optionGroup, this.props.optionGroupLabel);
}
}, {
key: "getOptionGroupChildren",
value: function getOptionGroupChildren(optionGroup) {
return ObjectUtils.resolveFieldData(optionGroup, this.props.optionGroupChildren);
}
}, {
key: "getVisibleOptions",
value: function getVisibleOptions() {
if (this.hasFilter()) {
var filterValue = this.getFilterValue().trim().toLocaleLowerCase(this.props.filterLocale);
var searchFields = this.props.filterBy ? this.props.filterBy.split(',') : [this.props.optionLabel || 'label'];
if (this.props.optionGroupLabel) {
var filteredGroups = [];
var _iterator2 = _createForOfIteratorHelper$9(this.props.options),
_step2;
try {
for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
var optgroup = _step2.value;
var filteredSubOptions = FilterService.filter(this.getOptionGroupChildren(optgroup), searchFields, filterValue, this.props.filterMatchMode, this.props.filterLocale);
if (filteredSubOptions && filteredSubOptions.length) {
filteredGroups.push(_objectSpread$l(_objectSpread$l({}, optgroup), {
items: filteredSubOptions
}));
}
}
} catch (err) {
_iterator2.e(err);
} finally {
_iterator2.f();
}
return filteredGroups;
} else {
return FilterService.filter(this.props.options, searchFields, filterValue, this.props.filterMatchMode, this.props.filterLocale);
}
} else {
return this.props.options;
}
}
}, {
key: "renderGroupChildren",
value: function renderGroupChildren(optionGroup) {
var _this3 = this;
var groupChildren = this.getOptionGroupChildren(optionGroup);
return groupChildren.map(function (option, j) {
var optionLabel = _this3.getOptionLabel(option);
var optionKey = j + '_' + _this3.getOptionRenderKey(option);
var disabled = _this3.isOptionDisabled(option);
var tabIndex = disabled ? null : _this3.props.tabIndex || 0;
return /*#__PURE__*/React__default["default"].createElement(ListBoxItem, {
key: optionKey,
label: optionLabel,
option: option,
template: _this3.props.itemTemplate,
selected: _this3.isSelected(option),
onClick: _this3.onOptionSelect,
onTouchEnd: _this3.onOptionTouchEnd,
tabIndex: tabIndex,
disabled: disabled
});
});
}
}, {
key: "renderItem",
value: function renderItem(option, index) {
if (this.props.optionGroupLabel) {
var groupContent = this.props.optionGroupTemplate ? ObjectUtils.getJSXElement(this.props.optionGroupTemplate, option, index) : this.getOptionGroupLabel(option);
var groupChildrenContent = this.renderGroupChildren(option);
var key = index + '_' + this.getOptionGroupRenderKey(option);
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, {
key: key
}, /*#__PURE__*/React__default["default"].createElement("li", {
className: "p-listbox-item-group"
}, groupContent), groupChildrenContent);
} else {
var optionLabel = this.getOptionLabel(option);
var optionKey = index + '_' + this.getOptionRenderKey(option);
var disabled = this.isOptionDisabled(option);
var tabIndex = disabled ? null : this.props.tabIndex || 0;
return /*#__PURE__*/React__default["default"].createElement(ListBoxItem, {
key: optionKey,
label: optionLabel,
option: option,
template: this.props.itemTemplate,
selected: this.isSelected(option),
onClick: this.onOptionSelect,
onTouchEnd: this.onOptionTouchEnd,
tabIndex: tabIndex,
disabled: disabled
});
}
}
}, {
key: "renderItems",
value: function renderItems(visibleOptions) {
var _this4 = this;
if (visibleOptions && visibleOptions.length) {
return visibleOptions.map(function (option, index) {
return _this4.renderItem(option, index);
});
}
return null;
}
}, {
key: "renderList",
value: function renderList(visibleOptions) {
var _this5 = this;
if (this.props.virtualScrollerOptions) {
var virtualScrollerProps = _objectSpread$l(_objectSpread$l({}, this.props.virtualScrollerOptions), {
items: visibleOptions,
onLazyLoad: function onLazyLoad(event) {
return _this5.props.virtualScrollerOptions.onLazyLoad(_objectSpread$l(_objectSpread$l({}, event), {
filter: _this5.getFilterValue()
}));
},
itemTemplate: function itemTemplate(item, options) {
return item && _this5.renderItem(item, options.index);
},
contentTemplate: function contentTemplate(options) {
var className = classNames('p-listbox-list', options.className);
return /*#__PURE__*/React__default["default"].createElement("ul", {
ref: options.contentRef,
className: className,
role: "listbox",
"aria-multiselectable": _this5.props.multiple
}, options.children);
}
});
return /*#__PURE__*/React__default["default"].createElement(VirtualScroller, _extends({
ref: function ref(el) {
return _this5.virtualScrollerRef = el;
}
}, virtualScrollerProps));
} else {
var items = this.renderItems(visibleOptions);
return /*#__PURE__*/React__default["default"].createElement("ul", {
className: "p-listbox-list",
role: "listbox",
"aria-multiselectable": this.props.multiple
}, items);
}
}
}, {
key: "render",
value: function render() {
var _this6 = this;
var className = classNames('p-listbox p-component', {
'p-disabled': this.props.disabled
}, this.props.className);
var listClassName = classNames('p-listbox-list-wrapper', this.props.listClassName);
var visibleOptions = this.getVisibleOptions();
var list = this.renderList(visibleOptions);
var header;
if (this.props.filter) {
header = /*#__PURE__*/React__default["default"].createElement(ListBoxHeader, {
filter: this.getFilterValue(),
onFilter: this.onFilter,
disabled: this.props.disabled,
filterPlaceholder: this.props.filterPlaceholder
});
}
return /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this6.element = el;
},
id: this.props.id,
className: className,
style: this.props.style
}, header, /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this6.wrapper = el;
},
className: listClassName,
style: this.props.listStyle
}, list));
}
}]);
return ListBox;
}(React.Component);
_defineProperty(ListBox, "defaultProps", {
id: null,
value: null,
options: null,
optionLabel: null,
optionValue: null,
optionDisabled: null,
optionGroupLabel: null,
optionGroupChildren: null,
optionGroupTemplate: null,
itemTemplate: null,
style: null,
listStyle: null,
listClassName: null,
className: null,
virtualScrollerOptions: null,
disabled: null,
dataKey: null,
multiple: false,
metaKeySelection: false,
filter: false,
filterBy: null,
filterValue: null,
filterMatchMode: 'contains',
filterPlaceholder: null,
filterLocale: undefined,
tabIndex: 0,
tooltip: null,
tooltipOptions: null,
ariaLabelledBy: null,
onChange: null,
onFilterValueChange: null
});
function _createSuper$13(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$13(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$13() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var MegaMenu = /*#__PURE__*/function (_Component) {
_inherits(MegaMenu, _Component);
var _super = _createSuper$13(MegaMenu);
function MegaMenu(props) {
var _this;
_classCallCheck(this, MegaMenu);
_this = _super.call(this, props);
_this.state = {
activeItem: null
};
_this.onLeafClick = _this.onLeafClick.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(MegaMenu, [{
key: "onLeafClick",
value: function onLeafClick(event, item) {
if (item.disabled) {
event.preventDefault();
return;
}
if (!item.url) {
event.preventDefault();
}
if (item.command) {
item.command({
originalEvent: event,
item: item
});
}
this.setState({
activeItem: null
});
}
}, {
key: "onCategoryMouseEnter",
value: function onCategoryMouseEnter(event, item) {
if (item.disabled) {
event.preventDefault();
return;
}
if (this.state.activeItem) {
this.setState({
activeItem: item
});
}
}
}, {
key: "onCategoryClick",
value: function onCategoryClick(event, item) {
if (item.disabled) {
event.preventDefault();
return;
}
if (!item.url) {
event.preventDefault();
}
if (item.command) {
item.command({
originalEvent: event,
item: this.props.item
});
}
if (item.items) {
if (this.state.activeItem && this.state.activeItem === item) {
this.setState({
activeItem: null
});
} else {
this.setState({
activeItem: item
});
}
}
event.preventDefault();
}
}, {
key: "onCategoryKeyDown",
value: function onCategoryKeyDown(event, item) {
var listItem = event.currentTarget.parentElement;
switch (event.which) {
//down
case 40:
if (this.isHorizontal()) this.expandMenu(item);else this.navigateToNextItem(listItem);
event.preventDefault();
break;
//up
case 38:
if (this.isVertical()) this.navigateToPrevItem(listItem);else if (item.items && item === this.state.activeItem) this.collapseMenu();
event.preventDefault();
break;
//right
case 39:
if (this.isHorizontal()) this.navigateToNextItem(listItem);else this.expandMenu(item);
event.preventDefault();
break;
//left
case 37:
if (this.isHorizontal()) this.navigateToPrevItem(listItem);else if (item.items && item === this.state.activeItem) this.collapseMenu();
event.preventDefault();
break;
}
}
}, {
key: "expandMenu",
value: function expandMenu(item) {
if (item.items) {
this.setState({
activeItem: item
});
}
}
}, {
key: "collapseMenu",
value: function collapseMenu(item) {
this.setState({
activeItem: null
});
}
}, {
key: "findNextItem",
value: function findNextItem(item) {
var nextItem = item.nextElementSibling;
if (nextItem) return DomHandler.hasClass(nextItem, 'p-disabled') || !DomHandler.hasClass(nextItem, 'p-menuitem') ? this.findNextItem(nextItem) : nextItem;else return null;
}
}, {
key: "findPrevItem",
value: function findPrevItem(item) {
var prevItem = item.previousElementSibling;
if (prevItem) return DomHandler.hasClass(prevItem, 'p-disabled') || !DomHandler.hasClass(prevItem, 'p-menuitem') ? this.findPrevItem(prevItem) : prevItem;else return null;
}
}, {
key: "navigateToNextItem",
value: function navigateToNextItem(listItem) {
var nextItem = this.findNextItem(listItem);
if (nextItem) {
nextItem.children[0].focus();
}
}
}, {
key: "navigateToPrevItem",
value: function navigateToPrevItem(listItem) {
var prevItem = this.findPrevItem(listItem);
if (prevItem) {
prevItem.children[0].focus();
}
}
}, {
key: "isHorizontal",
value: function isHorizontal() {
return this.props.orientation === 'horizontal';
}
}, {
key: "isVertical",
value: function isVertical() {
return this.props.orientation === 'vertical';
}
}, {
key: "getColumnClassName",
value: function getColumnClassName(category) {
var length = category.items ? category.items.length : 0;
var columnClass;
switch (length) {
case 2:
columnClass = 'p-megamenu-col-6';
break;
case 3:
columnClass = 'p-megamenu-col-4';
break;
case 4:
columnClass = 'p-megamenu-col-3';
break;
case 6:
columnClass = 'p-megamenu-col-2';
break;
default:
columnClass = 'p-megamenu-col-12';
break;
}
return columnClass;
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
var _this2 = this;
if (!this.documentClickListener) {
this.documentClickListener = function (event) {
if (_this2.container && !_this2.container.contains(event.target)) {
_this2.setState({
activeItem: null
});
}
};
document.addEventListener('click', this.documentClickListener);
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
if (this.documentClickListener) {
document.removeEventListener('click', this.documentClickListener);
this.documentClickListener = null;
}
}
}, {
key: "renderSeparator",
value: function renderSeparator(index) {
return /*#__PURE__*/React__default["default"].createElement("li", {
key: 'separator_' + index,
className: "p-menu-separator",
role: "separator"
});
}
}, {
key: "renderSubmenuIcon",
value: function renderSubmenuIcon(item) {
if (item.items) {
var className = classNames('p-submenu-icon pi', {
'pi-angle-down': this.isHorizontal(),
'pi-angle-right': this.isVertical()
});
return /*#__PURE__*/React__default["default"].createElement("span", {
className: className
});
}
return null;
}
}, {
key: "renderSubmenuItem",
value: function renderSubmenuItem(item, index) {
var _this3 = this;
if (item.separator) {
return this.renderSeparator(index);
} else {
var className = classNames('p-menuitem', item.className);
var linkClassName = classNames('p-menuitem-link', {
'p-disabled': item.disabled
});
var iconClassName = classNames(item.icon, 'p-menuitem-icon');
var icon = item.icon && /*#__PURE__*/React__default["default"].createElement("span", {
className: iconClassName
});
var label = item.label && /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-menuitem-text"
}, item.label);
var content = /*#__PURE__*/React__default["default"].createElement("a", {
href: item.url || '#',
className: linkClassName,
target: item.target,
onClick: function onClick(event) {
return _this3.onLeafClick(event, item);
},
role: "menuitem",
"aria-disabled": item.disabled
}, icon, label, /*#__PURE__*/React__default["default"].createElement(Ripple, null));
if (item.template) {
var defaultContentOptions = {
onClick: function onClick(event) {
return _this3.onLeafClick(event, item);
},
className: linkClassName,
labelClassName: 'p-menuitem-text',
iconClassName: iconClassName,
element: content,
props: this.props
};
content = ObjectUtils.getJSXElement(item.template, item, defaultContentOptions);
}
return /*#__PURE__*/React__default["default"].createElement("li", {
key: item.label + '_' + index,
className: className,
style: item.style,
role: "none"
}, content);
}
}
}, {
key: "renderSubmenu",
value: function renderSubmenu(submenu) {
var _this4 = this;
var className = classNames('p-megamenu-submenu-header', {
'p-disabled': submenu.disabled
}, submenu.className);
var items = submenu.items.map(function (item, index) {
return _this4.renderSubmenuItem(item, index);
});
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, {
key: submenu.label
}, /*#__PURE__*/React__default["default"].createElement("li", {
className: className,
style: submenu.style,
role: "presentation",
"aria-disabled": submenu.disabled
}, submenu.label), items);
}
}, {
key: "renderSubmenus",
value: function renderSubmenus(column) {
var _this5 = this;
return column.map(function (submenu, index) {
return _this5.renderSubmenu(submenu, index);
});
}
}, {
key: "renderColumn",
value: function renderColumn(category, column, index, columnClassName) {
var submenus = this.renderSubmenus(column);
return /*#__PURE__*/React__default["default"].createElement("div", {
key: category.label + '_column_' + index,
className: columnClassName
}, /*#__PURE__*/React__default["default"].createElement("ul", {
className: "p-megamenu-submenu",
role: "menu"
}, submenus));
}
}, {
key: "renderColumns",
value: function renderColumns(category) {
var _this6 = this;
if (category.items) {
var columnClassName = this.getColumnClassName(category);
return category.items.map(function (column, index) {
return _this6.renderColumn(category, column, index, columnClassName);
});
}
return null;
}
}, {
key: "renderCategoryPanel",
value: function renderCategoryPanel(category) {
if (category.items) {
var columns = this.renderColumns(category);
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-megamenu-panel"
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-megamenu-grid"
}, columns));
}
return null;
}
}, {
key: "renderCategory",
value: function renderCategory(category, index) {
var _this7 = this;
var className = classNames('p-menuitem', {
'p-menuitem-active': category === this.state.activeItem
}, category.className);
var linkClassName = classNames('p-menuitem-link', {
'p-disabled': category.disabled
});
var iconClassName = classNames('p-menuitem-icon', category.icon);
var icon = category.icon && /*#__PURE__*/React__default["default"].createElement("span", {
className: iconClassName
});
var label = category.label && /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-menuitem-text"
}, category.label);
var itemContent = category.template ? ObjectUtils.getJSXElement(category.template, category) : null;
var submenuIcon = this.renderSubmenuIcon(category);
var panel = this.renderCategoryPanel(category);
return /*#__PURE__*/React__default["default"].createElement("li", {
key: category.label + '_' + index,
className: className,
style: category.style,
onMouseEnter: function onMouseEnter(e) {
return _this7.onCategoryMouseEnter(e, category);
},
role: "none"
}, /*#__PURE__*/React__default["default"].createElement("a", {
href: category.url || '#',
className: linkClassName,
target: category.target,
onClick: function onClick(e) {
return _this7.onCategoryClick(e, category);
},
onKeyDown: function onKeyDown(e) {
return _this7.onCategoryKeyDown(e, category);
},
role: "menuitem",
"aria-haspopup": category.items != null
}, icon, label, itemContent, submenuIcon, /*#__PURE__*/React__default["default"].createElement(Ripple, null)), panel);
}
}, {
key: "renderMenu",
value: function renderMenu() {
var _this8 = this;
if (this.props.model) {
return this.props.model.map(function (item, index) {
return _this8.renderCategory(item, index, true);
});
}
return null;
}
}, {
key: "renderCustomContent",
value: function renderCustomContent() {
if (this.props.children) {
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-megamenu-custom"
}, this.props.children);
}
return null;
}
}, {
key: "render",
value: function render() {
var _this9 = this;
var className = classNames('p-megamenu p-component', {
'p-megamenu-horizontal': this.props.orientation === 'horizontal',
'p-megamenu-vertical': this.props.orientation === 'vertical'
}, this.props.className);
var menu = this.renderMenu();
var customContent = this.renderCustomContent();
return /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this9.container = el;
},
id: this.props.id,
className: className,
style: this.props.style
}, /*#__PURE__*/React__default["default"].createElement("ul", {
className: "p-megamenu-root-list",
role: "menubar"
}, menu), customContent);
}
}]);
return MegaMenu;
}(React.Component);
_defineProperty(MegaMenu, "defaultProps", {
id: null,
model: null,
style: null,
className: null,
orientation: 'horizontal'
});
function _createSuper$12(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$12(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$12() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var Menu = /*#__PURE__*/function (_Component) {
_inherits(Menu, _Component);
var _super = _createSuper$12(Menu);
function Menu(props) {
var _this;
_classCallCheck(this, Menu);
_this = _super.call(this, props);
_this.state = {
visible: !props.popup
};
_this.onEnter = _this.onEnter.bind(_assertThisInitialized(_this));
_this.onEntered = _this.onEntered.bind(_assertThisInitialized(_this));
_this.onExit = _this.onExit.bind(_assertThisInitialized(_this));
_this.onExited = _this.onExited.bind(_assertThisInitialized(_this));
_this.onPanelClick = _this.onPanelClick.bind(_assertThisInitialized(_this));
_this.menuRef = /*#__PURE__*/React__default["default"].createRef();
return _this;
}
_createClass(Menu, [{
key: "onPanelClick",
value: function onPanelClick(event) {
if (this.props.popup) {
OverlayService.emit('overlay-click', {
originalEvent: event,
target: this.target
});
}
}
}, {
key: "onItemClick",
value: function onItemClick(event, item) {
if (item.disabled) {
event.preventDefault();
return;
}
if (!item.url) {
event.preventDefault();
}
if (item.command) {
item.command({
originalEvent: event,
item: item
});
}
if (this.props.popup) {
this.hide(event);
}
}
}, {
key: "onItemKeyDown",
value: function onItemKeyDown(event, item) {
var listItem = event.currentTarget.parentElement;
switch (event.which) {
//down
case 40:
var nextItem = this.findNextItem(listItem);
if (nextItem) {
nextItem.children[0].focus();
}
event.preventDefault();
break;
//up
case 38:
var prevItem = this.findPrevItem(listItem);
if (prevItem) {
prevItem.children[0].focus();
}
event.preventDefault();
break;
}
}
}, {
key: "findNextItem",
value: function findNextItem(item) {
var nextItem = item.nextElementSibling;
if (nextItem) return DomHandler.hasClass(nextItem, 'p-disabled') || !DomHandler.hasClass(nextItem, 'p-menuitem') ? this.findNextItem(nextItem) : nextItem;else return null;
}
}, {
key: "findPrevItem",
value: function findPrevItem(item) {
var prevItem = item.previousElementSibling;
if (prevItem) return DomHandler.hasClass(prevItem, 'p-disabled') || !DomHandler.hasClass(prevItem, 'p-menuitem') ? this.findPrevItem(prevItem) : prevItem;else return null;
}
}, {
key: "toggle",
value: function toggle(event) {
if (this.props.popup) {
if (this.state.visible) this.hide(event);else this.show(event);
}
}
}, {
key: "show",
value: function show(event) {
var _this2 = this;
this.target = event.currentTarget;
var currentEvent = event;
this.setState({
visible: true
}, function () {
if (_this2.props.onShow) {
_this2.props.onShow(currentEvent);
}
});
}
}, {
key: "hide",
value: function hide(event) {
var _this3 = this;
var currentEvent = event;
this.setState({
visible: false
}, function () {
if (_this3.props.onHide) {
_this3.props.onHide(currentEvent);
}
});
}
}, {
key: "onEnter",
value: function onEnter() {
ZIndexUtils.set('menu', this.menuRef.current, PrimeReact.autoZIndex, this.props.baseZIndex || PrimeReact.zIndex['menu']);
DomHandler.absolutePosition(this.menuRef.current, this.target);
}
}, {
key: "onEntered",
value: function onEntered() {
this.bindDocumentListeners();
this.bindScrollListener();
}
}, {
key: "onExit",
value: function onExit() {
this.target = null;
this.unbindDocumentListeners();
this.unbindScrollListener();
}
}, {
key: "onExited",
value: function onExited() {
ZIndexUtils.clear(this.menuRef.current);
}
}, {
key: "bindDocumentListeners",
value: function bindDocumentListeners() {
var _this4 = this;
if (!this.documentClickListener) {
this.documentClickListener = function (event) {
if (_this4.state.visible && _this4.isOutsideClicked(event)) {
_this4.hide(event);
}
};
document.addEventListener('click', this.documentClickListener);
}
if (!this.documentResizeListener) {
this.documentResizeListener = function (event) {
if (_this4.state.visible && !DomHandler.isTouchDevice()) {
_this4.hide(event);
}
};
window.addEventListener('resize', this.documentResizeListener);
}
}
}, {
key: "unbindDocumentListeners",
value: function unbindDocumentListeners() {
if (this.documentClickListener) {
document.removeEventListener('click', this.documentClickListener);
this.documentClickListener = null;
}
if (this.documentResizeListener) {
window.removeEventListener('resize', this.documentResizeListener);
this.documentResizeListener = null;
}
}
}, {
key: "bindScrollListener",
value: function bindScrollListener() {
var _this5 = this;
if (!this.scrollHandler) {
this.scrollHandler = new ConnectedOverlayScrollHandler(this.target, function (event) {
if (_this5.state.visible) {
_this5.hide(event);
}
});
}
this.scrollHandler.bindScrollListener();
}
}, {
key: "unbindScrollListener",
value: function unbindScrollListener() {
if (this.scrollHandler) {
this.scrollHandler.unbindScrollListener();
}
}
}, {
key: "isOutsideClicked",
value: function isOutsideClicked(event) {
return this.menuRef && this.menuRef.current && !(this.menuRef.current.isSameNode(event.target) || this.menuRef.current.contains(event.target));
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
this.unbindDocumentListeners();
if (this.scrollHandler) {
this.scrollHandler.destroy();
this.scrollHandler = null;
}
ZIndexUtils.clear(this.menuRef.current);
}
}, {
key: "renderSubmenu",
value: function renderSubmenu(submenu, index) {
var _this6 = this;
var className = classNames('p-submenu-header', {
'p-disabled': submenu.disabled
}, submenu.className);
var items = submenu.items.map(function (item, index) {
return _this6.renderMenuitem(item, index);
});
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, {
key: submenu.label + '_' + index
}, /*#__PURE__*/React__default["default"].createElement("li", {
className: className,
style: submenu.style,
role: "presentation",
"aria-disabled": submenu.disabled
}, submenu.label), items);
}
}, {
key: "renderSeparator",
value: function renderSeparator(index) {
return /*#__PURE__*/React__default["default"].createElement("li", {
key: 'separator_' + index,
className: "p-menu-separator",
role: "separator"
});
}
}, {
key: "renderMenuitem",
value: function renderMenuitem(item, index) {
var _this7 = this;
var className = classNames('p-menuitem', item.className);
var linkClassName = classNames('p-menuitem-link', {
'p-disabled': item.disabled
});
var iconClassName = classNames('p-menuitem-icon', item.icon);
var icon = item.icon && /*#__PURE__*/React__default["default"].createElement("span", {
className: iconClassName
});
var label = item.label && /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-menuitem-text"
}, item.label);
var tabIndex = item.disabled ? null : 0;
var content = /*#__PURE__*/React__default["default"].createElement("a", {
href: item.url || '#',
className: linkClassName,
role: "menuitem",
target: item.target,
onClick: function onClick(event) {
return _this7.onItemClick(event, item);
},
onKeyDown: function onKeyDown(event) {
return _this7.onItemKeyDown(event, item);
},
tabIndex: tabIndex,
"aria-disabled": item.disabled
}, icon, label);
if (item.template) {
var defaultContentOptions = {
onClick: function onClick(event) {
return _this7.onItemClick(event, item);
},
onKeyDown: function onKeyDown(event) {
return _this7.onItemKeyDown(event, item);
},
className: linkClassName,
tabIndex: tabIndex,
labelClassName: 'p-menuitem-text',
iconClassName: iconClassName,
element: content,
props: this.props
};
content = ObjectUtils.getJSXElement(item.template, item, defaultContentOptions);
}
return /*#__PURE__*/React__default["default"].createElement("li", {
key: item.label + '_' + index,
className: className,
style: item.style,
role: "none"
}, content);
}
}, {
key: "renderItem",
value: function renderItem(item, index) {
if (item.separator) {
return this.renderSeparator(index);
} else {
if (item.items) return this.renderSubmenu(item, index);else return this.renderMenuitem(item, index);
}
}
}, {
key: "renderMenu",
value: function renderMenu() {
var _this8 = this;
return this.props.model.map(function (item, index) {
return _this8.renderItem(item, index);
});
}
}, {
key: "renderElement",
value: function renderElement() {
if (this.props.model) {
var className = classNames('p-menu p-component', this.props.className, {
'p-menu-overlay': this.props.popup
});
var menuitems = this.renderMenu();
return /*#__PURE__*/React__default["default"].createElement(CSSTransition, {
nodeRef: this.menuRef,
classNames: "p-connected-overlay",
"in": this.state.visible,
timeout: {
enter: 120,
exit: 100
},
options: this.props.transitionOptions,
unmountOnExit: true,
onEnter: this.onEnter,
onEntered: this.onEntered,
onExit: this.onExit,
onExited: this.onExited
}, /*#__PURE__*/React__default["default"].createElement("div", {
ref: this.menuRef,
id: this.props.id,
className: className,
style: this.props.style,
onClick: this.onPanelClick
}, /*#__PURE__*/React__default["default"].createElement("ul", {
className: "p-menu-list p-reset",
role: "menu"
}, menuitems)));
}
return null;
}
}, {
key: "render",
value: function render() {
var element = this.renderElement();
return this.props.popup ? /*#__PURE__*/React__default["default"].createElement(Portal, {
element: element,
appendTo: this.props.appendTo
}) : element;
}
}]);
return Menu;
}(React.Component);
_defineProperty(Menu, "defaultProps", {
id: null,
model: null,
popup: false,
style: null,
className: null,
autoZIndex: true,
baseZIndex: 0,
appendTo: null,
transitionOptions: null,
onShow: null,
onHide: null
});
function _createSuper$11(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$11(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$11() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var MenubarSubComponent = /*#__PURE__*/function (_Component) {
_inherits(MenubarSubComponent, _Component);
var _super = _createSuper$11(MenubarSubComponent);
function MenubarSubComponent(props) {
var _this;
_classCallCheck(this, MenubarSubComponent);
_this = _super.call(this, props);
_this.state = {
activeItem: null
};
_this.onLeafClick = _this.onLeafClick.bind(_assertThisInitialized(_this));
_this.onChildItemKeyDown = _this.onChildItemKeyDown.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(MenubarSubComponent, [{
key: "getElementRef",
value: function getElementRef(el) {
this.element = el;
if (this.props.forwardRef) {
return this.props.forwardRef(el);
}
return this.element;
}
}, {
key: "onItemMouseEnter",
value: function onItemMouseEnter(event, item) {
if (item.disabled || this.props.mobileActive) {
event.preventDefault();
return;
}
if (this.props.root) {
if (this.state.activeItem || this.props.popup) {
this.setState({
activeItem: item
});
}
} else {
this.setState({
activeItem: item
});
}
}
}, {
key: "onItemClick",
value: function onItemClick(event, item) {
if (item.disabled) {
event.preventDefault();
return;
}
if (!item.url) {
event.preventDefault();
}
if (item.command) {
item.command({
originalEvent: event,
item: item
});
}
if (item.items) {
if (this.state.activeItem && item === this.state.activeItem) {
this.setState({
activeItem: null
});
} else {
this.setState({
activeItem: item
});
}
} else {
this.onLeafClick();
}
}
}, {
key: "onItemKeyDown",
value: function onItemKeyDown(event, item) {
var listItem = event.currentTarget.parentElement;
switch (event.which) {
//down
case 40:
if (this.props.root) {
if (item.items) {
this.expandSubmenu(item, listItem);
}
} else {
this.navigateToNextItem(listItem);
}
event.preventDefault();
break;
//up
case 38:
if (!this.props.root) {
this.navigateToPrevItem(listItem);
}
event.preventDefault();
break;
//right
case 39:
if (this.props.root) {
var nextItem = this.findNextItem(listItem);
if (nextItem) {
nextItem.children[0].focus();
}
} else {
if (item.items) {
this.expandSubmenu(item, listItem);
}
}
event.preventDefault();
break;
//left
case 37:
if (this.props.root) {
this.navigateToPrevItem(listItem);
}
event.preventDefault();
break;
}
if (this.props.onKeyDown) {
this.props.onKeyDown(event, listItem);
}
}
}, {
key: "onChildItemKeyDown",
value: function onChildItemKeyDown(event, childListItem) {
if (this.props.root) {
//up
if (event.which === 38 && childListItem.previousElementSibling == null) {
this.collapseMenu(childListItem);
}
} else {
//left
if (event.which === 37) {
this.collapseMenu(childListItem);
}
}
}
}, {
key: "expandSubmenu",
value: function expandSubmenu(item, listItem) {
this.setState({
activeItem: item
});
setTimeout(function () {
listItem.children[1].children[0].children[0].focus();
}, 50);
}
}, {
key: "collapseMenu",
value: function collapseMenu(listItem) {
this.setState({
activeItem: null
});
listItem.parentElement.previousElementSibling.focus();
}
}, {
key: "navigateToNextItem",
value: function navigateToNextItem(listItem) {
var nextItem = this.findNextItem(listItem);
if (nextItem) {
nextItem.children[0].focus();
}
}
}, {
key: "navigateToPrevItem",
value: function navigateToPrevItem(listItem) {
var prevItem = this.findPrevItem(listItem);
if (prevItem) {
prevItem.children[0].focus();
}
}
}, {
key: "findNextItem",
value: function findNextItem(item) {
var nextItem = item.nextElementSibling;
if (nextItem) return DomHandler.hasClass(nextItem, 'p-disabled') || !DomHandler.hasClass(nextItem, 'p-menuitem') ? this.findNextItem(nextItem) : nextItem;else return null;
}
}, {
key: "findPrevItem",
value: function findPrevItem(item) {
var prevItem = item.previousElementSibling;
if (prevItem) return DomHandler.hasClass(prevItem, 'p-disabled') || !DomHandler.hasClass(prevItem, 'p-menuitem') ? this.findPrevItem(prevItem) : prevItem;else return null;
}
}, {
key: "onLeafClick",
value: function onLeafClick() {
this.setState({
activeItem: null
});
if (this.props.onLeafClick) {
this.props.onLeafClick();
}
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
var _this2 = this;
if (!this.documentClickListener) {
this.documentClickListener = function (event) {
if (_this2.element && !_this2.element.contains(event.target)) {
_this2.setState({
activeItem: null
});
}
};
document.addEventListener('click', this.documentClickListener);
}
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps) {
if (prevProps.parentActive && !this.props.parentActive) {
this.setState({
activeItem: null
});
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
if (this.documentClickListener) {
document.removeEventListener('click', this.documentClickListener);
this.documentClickListener = null;
}
}
}, {
key: "renderSeparator",
value: function renderSeparator(index) {
return /*#__PURE__*/React__default["default"].createElement("li", {
key: 'separator_' + index,
className: "p-menu-separator",
role: "separator"
});
}
}, {
key: "renderSubmenu",
value: function renderSubmenu(item) {
if (item.items) {
return /*#__PURE__*/React__default["default"].createElement(MenubarSub, {
model: item.items,
mobileActive: this.props.mobileActive,
onLeafClick: this.onLeafClick,
onKeyDown: this.onChildItemKeyDown,
parentActive: item === this.state.activeItem
});
}
return null;
}
}, {
key: "renderMenuitem",
value: function renderMenuitem(item, index) {
var _this3 = this;
var className = classNames('p-menuitem', {
'p-menuitem-active': this.state.activeItem === item
}, item.className);
var linkClassName = classNames('p-menuitem-link', {
'p-disabled': item.disabled
});
var iconClassName = classNames('p-menuitem-icon', item.icon);
var submenuIconClassName = classNames('p-submenu-icon pi', {
'pi-angle-down': this.props.root,
'pi-angle-right': !this.props.root
});
var icon = item.icon && /*#__PURE__*/React__default["default"].createElement("span", {
className: iconClassName
});
var label = item.label && /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-menuitem-text"
}, item.label);
var submenuIcon = item.items && /*#__PURE__*/React__default["default"].createElement("span", {
className: submenuIconClassName
});
var submenu = this.renderSubmenu(item);
var content = /*#__PURE__*/React__default["default"].createElement("a", {
href: item.url || '#',
role: "menuitem",
className: linkClassName,
target: item.target,
"aria-haspopup": item.items != null,
onClick: function onClick(event) {
return _this3.onItemClick(event, item);
},
onKeyDown: function onKeyDown(event) {
return _this3.onItemKeyDown(event, item);
}
}, icon, label, submenuIcon, /*#__PURE__*/React__default["default"].createElement(Ripple, null));
if (item.template) {
var defaultContentOptions = {
onClick: function onClick(event) {
return _this3.onItemClick(event, item);
},
onKeyDown: function onKeyDown(event) {
return _this3.onItemKeyDown(event, item);
},
className: linkClassName,
labelClassName: 'p-menuitem-text',
iconClassName: iconClassName,
submenuIconClassName: submenuIconClassName,
element: content,
props: this.props
};
content = ObjectUtils.getJSXElement(item.template, item, defaultContentOptions);
}
return /*#__PURE__*/React__default["default"].createElement("li", {
key: item.label + '_' + index,
role: "none",
className: className,
style: item.style,
onMouseEnter: function onMouseEnter(event) {
return _this3.onItemMouseEnter(event, item);
}
}, content, submenu);
}
}, {
key: "renderItem",
value: function renderItem(item, index) {
if (item.separator) return this.renderSeparator(index);else return this.renderMenuitem(item, index);
}
}, {
key: "renderMenu",
value: function renderMenu() {
var _this4 = this;
if (this.props.model) {
return this.props.model.map(function (item, index) {
return _this4.renderItem(item, index);
});
}
return null;
}
}, {
key: "render",
value: function render() {
var _this5 = this;
var className = classNames({
'p-submenu-list': !this.props.root,
'p-menubar-root-list': this.props.root
});
var submenu = this.renderMenu();
return /*#__PURE__*/React__default["default"].createElement("ul", {
ref: function ref(el) {
return _this5.getElementRef(el);
},
className: className,
role: this.props.root ? 'menubar' : 'menu'
}, submenu);
}
}]);
return MenubarSubComponent;
}(React.Component);
_defineProperty(MenubarSubComponent, "defaultProps", {
model: null,
root: false,
className: null,
popup: false,
onLeafClick: null,
onKeyDown: null,
parentActive: false,
mobileActive: false,
forwardRef: null
});
var MenubarSub = /*#__PURE__*/React__default["default"].forwardRef(function (props, ref) {
return /*#__PURE__*/React__default["default"].createElement(MenubarSubComponent, _extends({
forwardRef: ref
}, props));
});
function _createSuper$10(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$10(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$10() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var Menubar = /*#__PURE__*/function (_Component) {
_inherits(Menubar, _Component);
var _super = _createSuper$10(Menubar);
function Menubar(props) {
var _this;
_classCallCheck(this, Menubar);
_this = _super.call(this, props);
_this.state = {
mobileActive: false
};
_this.toggle = _this.toggle.bind(_assertThisInitialized(_this));
_this.onLeafClick = _this.onLeafClick.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(Menubar, [{
key: "toggle",
value: function toggle(event) {
var _this2 = this;
event.preventDefault();
this.setState(function (prevState) {
return {
mobileActive: !prevState.mobileActive
};
}, function () {
if (_this2.state.mobileActive) {
ZIndexUtils.set('menu', _this2.rootmenu, PrimeReact.autoZIndex, PrimeReact.zIndex['menu']);
_this2.bindDocumentClickListener();
} else {
_this2.unbindDocumentClickListener();
ZIndexUtils.clear(_this2.rootmenu);
}
});
}
}, {
key: "bindDocumentClickListener",
value: function bindDocumentClickListener() {
var _this3 = this;
if (!this.documentClickListener) {
this.documentClickListener = function (event) {
if (_this3.state.mobileActive && _this3.isOutsideClicked(event)) {
_this3.setState({
mobileActive: false
}, function () {
_this3.unbindDocumentClickListener();
ZIndexUtils.clear(_this3.rootmenu);
});
}
};
document.addEventListener('click', this.documentClickListener);
}
}
}, {
key: "isOutsideClicked",
value: function isOutsideClicked(event) {
return this.rootmenu !== event.target && !this.rootmenu.contains(event.target) && this.menubutton !== event.target && !this.menubutton.contains(event.target);
}
}, {
key: "unbindDocumentClickListener",
value: function unbindDocumentClickListener() {
if (this.documentClickListener) {
document.removeEventListener('click', this.documentClickListener);
this.documentClickListener = null;
}
}
}, {
key: "onLeafClick",
value: function onLeafClick() {
var _this4 = this;
this.setState({
mobileActive: false
}, function () {
_this4.unbindDocumentClickListener();
ZIndexUtils.clear(_this4.rootmenu);
});
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
ZIndexUtils.clear(this.rootmenu);
}
}, {
key: "renderCustomContent",
value: function renderCustomContent() {
if (this.props.children) {
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-menubar-custom"
}, this.props.children);
}
return null;
}
}, {
key: "renderStartContent",
value: function renderStartContent() {
if (this.props.start) {
var start = ObjectUtils.getJSXElement(this.props.start, this.props);
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-menubar-start"
}, start);
}
return null;
}
}, {
key: "renderEndContent",
value: function renderEndContent() {
if (this.props.end) {
var end = ObjectUtils.getJSXElement(this.props.end, this.props);
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-menubar-end"
}, end);
}
return null;
}
}, {
key: "renderMenuButton",
value: function renderMenuButton() {
var _this5 = this;
/* eslint-disable */
var button = /*#__PURE__*/React__default["default"].createElement("a", {
ref: function ref(el) {
return _this5.menubutton = el;
},
href: '#',
role: "button",
tabIndex: 0,
className: "p-menubar-button",
onClick: this.toggle
}, /*#__PURE__*/React__default["default"].createElement("i", {
className: "pi pi-bars"
}));
/* eslint-enable */
return button;
}
}, {
key: "render",
value: function render() {
var _this6 = this;
var className = classNames('p-menubar p-component', {
'p-menubar-mobile-active': this.state.mobileActive
}, this.props.className);
var start = this.renderStartContent();
var end = this.renderEndContent();
var menuButton = this.renderMenuButton();
return /*#__PURE__*/React__default["default"].createElement("div", {
id: this.props.id,
className: className,
style: this.props.style
}, start, menuButton, /*#__PURE__*/React__default["default"].createElement(MenubarSub, {
ref: function ref(el) {
return _this6.rootmenu = el;
},
model: this.props.model,
root: true,
mobileActive: this.state.mobileActive,
onLeafClick: this.onLeafClick
}), end);
}
}]);
return Menubar;
}(React.Component);
_defineProperty(Menubar, "defaultProps", {
id: null,
model: null,
style: null,
className: null,
start: null,
end: null
});
function _createSuper$$(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$$(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$$() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var Message = /*#__PURE__*/function (_Component) {
_inherits(Message, _Component);
var _super = _createSuper$$(Message);
function Message() {
_classCallCheck(this, Message);
return _super.apply(this, arguments);
}
_createClass(Message, [{
key: "getContent",
value: function getContent() {
if (this.props.content) {
return ObjectUtils.getJSXElement(this.props.content, this.props);
}
var text = ObjectUtils.getJSXElement(this.props.text, this.props);
var icon = classNames('p-inline-message-icon pi', {
'pi-info-circle': this.props.severity === 'info',
'pi-exclamation-triangle': this.props.severity === 'warn',
'pi-times-circle': this.props.severity === 'error',
'pi-check': this.props.severity === 'success'
});
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("span", {
className: icon
}), /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-inline-message-text"
}, text));
}
}, {
key: "render",
value: function render() {
var className = classNames('p-inline-message p-component', {
'p-inline-message-info': this.props.severity === 'info',
'p-inline-message-warn': this.props.severity === 'warn',
'p-inline-message-error': this.props.severity === 'error',
'p-inline-message-success': this.props.severity === 'success',
'p-inline-message-icon-only': !this.props.text
}, this.props.className);
var content = this.getContent();
return /*#__PURE__*/React__default["default"].createElement("div", {
id: this.props.id,
"aria-live": "polite",
className: className,
style: this.props.style,
role: "alert"
}, content);
}
}]);
return Message;
}(React.Component);
_defineProperty(Message, "defaultProps", {
id: null,
className: null,
style: null,
text: null,
severity: 'info',
content: null
});
function _createSuper$_(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$_(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$_() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var MultiSelectHeader = /*#__PURE__*/function (_Component) {
_inherits(MultiSelectHeader, _Component);
var _super = _createSuper$_(MultiSelectHeader);
function MultiSelectHeader(props) {
var _this;
_classCallCheck(this, MultiSelectHeader);
_this = _super.call(this, props);
_this.onFilter = _this.onFilter.bind(_assertThisInitialized(_this));
_this.onSelectAll = _this.onSelectAll.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(MultiSelectHeader, [{
key: "onFilter",
value: function onFilter(event) {
if (this.props.onFilter) {
this.props.onFilter({
originalEvent: event,
query: event.target.value
});
}
}
}, {
key: "onSelectAll",
value: function onSelectAll(event) {
if (this.props.onSelectAll) {
this.props.onSelectAll({
originalEvent: event,
checked: this.props.selectAll
});
}
}
}, {
key: "renderFilterElement",
value: function renderFilterElement() {
if (this.props.filter) {
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-multiselect-filter-container"
}, /*#__PURE__*/React__default["default"].createElement(InputText, {
type: "text",
role: "textbox",
value: this.props.filterValue,
onChange: this.onFilter,
className: "p-multiselect-filter",
placeholder: this.props.filterPlaceholder
}), /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-multiselect-filter-icon pi pi-search"
}));
}
return null;
}
}, {
key: "render",
value: function render() {
var filterElement = this.renderFilterElement();
var checkboxElement = this.props.showSelectAll && /*#__PURE__*/React__default["default"].createElement(Checkbox, {
checked: this.props.selectAll,
onChange: this.onSelectAll,
role: "checkbox",
"aria-checked": this.props.selectAll
});
var closeElement = /*#__PURE__*/React__default["default"].createElement("button", {
type: "button",
className: "p-multiselect-close p-link",
onClick: this.props.onClose
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-multiselect-close-icon pi pi-times"
}), /*#__PURE__*/React__default["default"].createElement(Ripple, null));
var element = /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-multiselect-header"
}, checkboxElement, filterElement, closeElement);
if (this.props.template) {
var defaultOptions = {
className: 'p-multiselect-header',
checkboxElement: checkboxElement,
checked: this.props.selectAll,
onChange: this.onSelectAll,
filterElement: filterElement,
closeElement: closeElement,
closeElementClassName: 'p-multiselect-close p-link',
closeIconClassName: 'p-multiselect-close-icon pi pi-times',
onCloseClick: this.props.onClose,
element: element,
props: this.props
};
return ObjectUtils.getJSXElement(this.props.template, defaultOptions);
}
return element;
}
}]);
return MultiSelectHeader;
}(React.Component);
function _createSuper$Z(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$Z(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$Z() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var MultiSelectItem = /*#__PURE__*/function (_Component) {
_inherits(MultiSelectItem, _Component);
var _super = _createSuper$Z(MultiSelectItem);
function MultiSelectItem(props) {
var _this;
_classCallCheck(this, MultiSelectItem);
_this = _super.call(this, props);
_this.onClick = _this.onClick.bind(_assertThisInitialized(_this));
_this.onKeyDown = _this.onKeyDown.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(MultiSelectItem, [{
key: "onClick",
value: function onClick(event) {
if (this.props.onClick) {
this.props.onClick({
originalEvent: event,
option: this.props.option
});
}
event.preventDefault();
}
}, {
key: "onKeyDown",
value: function onKeyDown(event) {
if (this.props.onKeyDown) {
this.props.onKeyDown({
originalEvent: event,
option: this.props.option
});
}
}
}, {
key: "render",
value: function render() {
var className = classNames('p-multiselect-item', {
'p-highlight': this.props.selected,
'p-disabled': this.props.disabled
}, this.props.option.className);
var checkboxClassName = classNames('p-checkbox-box', {
'p-highlight': this.props.selected
});
var checkboxIcon = classNames('p-checkbox-icon p-c', {
'pi pi-check': this.props.selected
});
var content = this.props.template ? ObjectUtils.getJSXElement(this.props.template, this.props.option) : this.props.label;
var tabIndex = this.props.disabled ? null : this.props.tabIndex || 0;
return /*#__PURE__*/React__default["default"].createElement("li", {
className: className,
onClick: this.onClick,
tabIndex: tabIndex,
onKeyDown: this.onKeyDown,
role: "option",
"aria-selected": this.props.selected
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-checkbox p-component"
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: checkboxClassName
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: checkboxIcon
}))), /*#__PURE__*/React__default["default"].createElement("span", null, content), /*#__PURE__*/React__default["default"].createElement(Ripple, null));
}
}]);
return MultiSelectItem;
}(React.Component);
_defineProperty(MultiSelectItem, "defaultProps", {
option: null,
label: null,
selected: false,
disabled: false,
tabIndex: null,
template: null,
onClick: null,
onKeyDown: null
});
function ownKeys$k(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$k(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$k(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$k(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createSuper$Y(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$Y(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$Y() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var MultiSelectPanelComponent = /*#__PURE__*/function (_Component) {
_inherits(MultiSelectPanelComponent, _Component);
var _super = _createSuper$Y(MultiSelectPanelComponent);
function MultiSelectPanelComponent(props) {
var _this;
_classCallCheck(this, MultiSelectPanelComponent);
_this = _super.call(this, props);
_this.onEnter = _this.onEnter.bind(_assertThisInitialized(_this));
_this.onFilterInputChange = _this.onFilterInputChange.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(MultiSelectPanelComponent, [{
key: "onEnter",
value: function onEnter() {
var _this2 = this;
this.props.onEnter(function () {
if (_this2.virtualScrollerRef) {
var selectedIndex = _this2.props.getSelectedOptionIndex();
if (selectedIndex !== -1) {
_this2.virtualScrollerRef.scrollToIndex(selectedIndex);
}
}
});
}
}, {
key: "onFilterInputChange",
value: function onFilterInputChange(event) {
if (this.virtualScrollerRef) {
this.virtualScrollerRef.scrollToIndex(0);
}
this.props.onFilterInputChange && this.props.onFilterInputChange(event);
}
}, {
key: "isEmptyFilter",
value: function isEmptyFilter() {
return !(this.props.visibleOptions && this.props.visibleOptions.length) && this.props.hasFilter();
}
}, {
key: "renderHeader",
value: function renderHeader() {
return /*#__PURE__*/React__default["default"].createElement(MultiSelectHeader, {
filter: this.props.filter,
filterValue: this.props.filterValue,
onFilter: this.onFilterInputChange,
filterPlaceholder: this.props.filterPlaceholder,
onClose: this.props.onCloseClick,
showSelectAll: this.props.showSelectAll,
selectAll: this.props.isAllSelected(),
onSelectAll: this.props.onSelectAll,
template: this.props.panelHeaderTemplate
});
}
}, {
key: "renderFooter",
value: function renderFooter() {
if (this.props.panelFooterTemplate) {
var content = ObjectUtils.getJSXElement(this.props.panelFooterTemplate, this.props, this.props.onOverlayHide);
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-multiselect-footer"
}, content);
}
return null;
}
}, {
key: "renderGroupChildren",
value: function renderGroupChildren(optionGroup) {
var _this3 = this;
var groupChildren = this.props.getOptionGroupChildren(optionGroup);
return groupChildren.map(function (option, j) {
var optionLabel = _this3.props.getOptionLabel(option);
var optionKey = j + '_' + _this3.props.getOptionRenderKey(option);
var disabled = _this3.props.isOptionDisabled(option);
var tabIndex = disabled ? null : _this3.props.tabIndex || 0;
return /*#__PURE__*/React__default["default"].createElement(MultiSelectItem, {
key: optionKey,
label: optionLabel,
option: option,
template: _this3.props.itemTemplate,
selected: _this3.props.isSelected(option),
onClick: _this3.props.onOptionSelect,
onKeyDown: _this3.props.onOptionKeyDown,
tabIndex: tabIndex,
disabled: disabled
});
});
}
}, {
key: "renderEmptyFilter",
value: function renderEmptyFilter() {
var emptyFilterMessage = ObjectUtils.getJSXElement(this.props.emptyFilterMessage, this.props) || localeOption('emptyFilterMessage');
return /*#__PURE__*/React__default["default"].createElement("li", {
className: "p-multiselect-empty-message"
}, emptyFilterMessage);
}
}, {
key: "renderItem",
value: function renderItem(option, index) {
if (this.props.optionGroupLabel) {
var groupContent = this.props.optionGroupTemplate ? ObjectUtils.getJSXElement(this.props.optionGroupTemplate, option, index) : this.props.getOptionGroupLabel(option);
var groupChildrenContent = this.renderGroupChildren(option);
var key = index + '_' + this.props.getOptionGroupRenderKey(option);
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, {
key: key
}, /*#__PURE__*/React__default["default"].createElement("li", {
className: "p-multiselect-item-group"
}, groupContent), groupChildrenContent);
} else {
var optionLabel = this.props.getOptionLabel(option);
var optionKey = index + '_' + this.props.getOptionRenderKey(option);
var disabled = this.props.isOptionDisabled(option);
var tabIndex = disabled ? null : this.props.tabIndex || 0;
return /*#__PURE__*/React__default["default"].createElement(MultiSelectItem, {
key: optionKey,
label: optionLabel,
option: option,
template: this.props.itemTemplate,
selected: this.props.isSelected(option),
onClick: this.props.onOptionSelect,
onKeyDown: this.props.onOptionKeyDown,
tabIndex: tabIndex,
disabled: disabled
});
}
}
}, {
key: "renderItems",
value: function renderItems() {
var _this4 = this;
if (this.props.visibleOptions && this.props.visibleOptions.length) {
return this.props.visibleOptions.map(function (option, index) {
return _this4.renderItem(option, index);
});
} else if (this.props.hasFilter()) {
return this.renderEmptyFilter();
}
return null;
}
}, {
key: "renderContent",
value: function renderContent() {
var _this5 = this;
if (this.props.virtualScrollerOptions) {
var virtualScrollerProps = _objectSpread$k(_objectSpread$k({}, this.props.virtualScrollerOptions), {
style: _objectSpread$k(_objectSpread$k({}, this.props.virtualScrollerOptions.style), {
height: this.props.scrollHeight
}),
className: classNames('p-multiselect-items-wrapper', this.props.virtualScrollerOptions.className),
items: this.props.visibleOptions,
onLazyLoad: function onLazyLoad(event) {
return _this5.props.virtualScrollerOptions.onLazyLoad(_objectSpread$k(_objectSpread$k({}, event), {
filter: _this5.props.filterValue
}));
},
itemTemplate: function itemTemplate(item, options) {
return item && _this5.renderItem(item, options.index);
},
contentTemplate: function contentTemplate(options) {
var className = classNames('p-multiselect-items p-component', options.className);
var content = _this5.isEmptyFilter() ? _this5.renderEmptyFilter() : options.children;
return /*#__PURE__*/React__default["default"].createElement("ul", {
ref: options.contentRef,
className: className,
role: "listbox",
"aria-multiselectable": true
}, content);
}
});
return /*#__PURE__*/React__default["default"].createElement(VirtualScroller, _extends({
ref: function ref(el) {
return _this5.virtualScrollerRef = el;
}
}, virtualScrollerProps));
} else {
var items = this.renderItems();
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-multiselect-items-wrapper",
style: {
maxHeight: this.props.scrollHeight
}
}, /*#__PURE__*/React__default["default"].createElement("ul", {
className: "p-multiselect-items p-component",
role: "listbox",
"aria-multiselectable": true
}, items));
}
}
}, {
key: "renderElement",
value: function renderElement() {
var panelClassName = classNames('p-multiselect-panel p-component', {
'p-multiselect-limited': !this.props.allowOptionSelect()
}, this.props.panelClassName);
var header = this.renderHeader();
var content = this.renderContent();
var footer = this.renderFooter();
return /*#__PURE__*/React__default["default"].createElement(CSSTransition, {
nodeRef: this.props.forwardRef,
classNames: "p-connected-overlay",
"in": this.props["in"],
timeout: {
enter: 120,
exit: 100
},
options: this.props.transitionOptions,
unmountOnExit: true,
onEnter: this.onEnter,
onEntered: this.props.onEntered,
onExit: this.props.onExit,
onExited: this.props.onExited
}, /*#__PURE__*/React__default["default"].createElement("div", {
ref: this.props.forwardRef,
className: panelClassName,
style: this.props.panelStyle,
onClick: this.props.onClick
}, header, content, footer));
}
}, {
key: "render",
value: function render() {
var element = this.renderElement();
return /*#__PURE__*/React__default["default"].createElement(Portal, {
element: element,
appendTo: this.props.appendTo
});
}
}]);
return MultiSelectPanelComponent;
}(React.Component);
var MultiSelectPanel = /*#__PURE__*/React__default["default"].forwardRef(function (props, ref) {
return /*#__PURE__*/React__default["default"].createElement(MultiSelectPanelComponent, _extends({
forwardRef: ref
}, props));
});
function ownKeys$j(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$j(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$j(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$j(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createForOfIteratorHelper$8(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray$8(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it["return"] != null) it["return"](); } finally { if (didErr) throw err; } } }; }
function _unsupportedIterableToArray$8(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray$8(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray$8(o, minLen); }
function _arrayLikeToArray$8(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
function _createSuper$X(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$X(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$X() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var MultiSelect = /*#__PURE__*/function (_Component) {
_inherits(MultiSelect, _Component);
var _super = _createSuper$X(MultiSelect);
function MultiSelect(props) {
var _this;
_classCallCheck(this, MultiSelect);
_this = _super.call(this, props);
_this.state = {
filter: '',
focused: false,
overlayVisible: false
};
_this.onClick = _this.onClick.bind(_assertThisInitialized(_this));
_this.onKeyDown = _this.onKeyDown.bind(_assertThisInitialized(_this));
_this.onOptionSelect = _this.onOptionSelect.bind(_assertThisInitialized(_this));
_this.onOptionKeyDown = _this.onOptionKeyDown.bind(_assertThisInitialized(_this));
_this.onFocus = _this.onFocus.bind(_assertThisInitialized(_this));
_this.onBlur = _this.onBlur.bind(_assertThisInitialized(_this));
_this.onFilterInputChange = _this.onFilterInputChange.bind(_assertThisInitialized(_this));
_this.onCloseClick = _this.onCloseClick.bind(_assertThisInitialized(_this));
_this.onSelectAll = _this.onSelectAll.bind(_assertThisInitialized(_this));
_this.onOverlayEnter = _this.onOverlayEnter.bind(_assertThisInitialized(_this));
_this.onOverlayEntered = _this.onOverlayEntered.bind(_assertThisInitialized(_this));
_this.onOverlayExit = _this.onOverlayExit.bind(_assertThisInitialized(_this));
_this.onOverlayExited = _this.onOverlayExited.bind(_assertThisInitialized(_this));
_this.onPanelClick = _this.onPanelClick.bind(_assertThisInitialized(_this));
_this.getOptionLabel = _this.getOptionLabel.bind(_assertThisInitialized(_this));
_this.getOptionRenderKey = _this.getOptionRenderKey.bind(_assertThisInitialized(_this));
_this.isOptionDisabled = _this.isOptionDisabled.bind(_assertThisInitialized(_this));
_this.getOptionGroupChildren = _this.getOptionGroupChildren.bind(_assertThisInitialized(_this));
_this.getOptionGroupLabel = _this.getOptionGroupLabel.bind(_assertThisInitialized(_this));
_this.getOptionGroupRenderKey = _this.getOptionGroupRenderKey.bind(_assertThisInitialized(_this));
_this.allowOptionSelect = _this.allowOptionSelect.bind(_assertThisInitialized(_this));
_this.isSelected = _this.isSelected.bind(_assertThisInitialized(_this));
_this.isAllSelected = _this.isAllSelected.bind(_assertThisInitialized(_this));
_this.hasFilter = _this.hasFilter.bind(_assertThisInitialized(_this));
_this.getSelectedOptionIndex = _this.getSelectedOptionIndex.bind(_assertThisInitialized(_this));
_this.hide = _this.hide.bind(_assertThisInitialized(_this));
_this.onOptionKeyDown = _this.onOptionKeyDown.bind(_assertThisInitialized(_this));
_this.overlayRef = /*#__PURE__*/React.createRef();
_this.inputRef = /*#__PURE__*/React.createRef(_this.props.inputRef);
return _this;
}
_createClass(MultiSelect, [{
key: "onPanelClick",
value: function onPanelClick(event) {
OverlayService.emit('overlay-click', {
originalEvent: event,
target: this.container
});
}
}, {
key: "allowOptionSelect",
value: function allowOptionSelect() {
return !this.props.selectionLimit || !this.props.value || this.props.value && this.props.value.length < this.props.selectionLimit;
}
}, {
key: "onOptionSelect",
value: function onOptionSelect(event) {
var _this2 = this;
var originalEvent = event.originalEvent,
option = event.option;
if (this.props.disabled || this.isOptionDisabled(option)) {
return;
}
var optionValue = this.getOptionValue(option);
var isOptionValueUsed = this.isOptionValueUsed(option);
var selected = this.isSelected(option);
var allowOptionSelect = this.allowOptionSelect();
if (selected) this.updateModel(originalEvent, this.props.value.filter(function (val) {
return !ObjectUtils.equals(isOptionValueUsed ? val : _this2.getOptionValue(val), optionValue, _this2.equalityKey());
}));else if (allowOptionSelect) this.updateModel(originalEvent, [].concat(_toConsumableArray(this.props.value || []), [optionValue]));
}
}, {
key: "onOptionKeyDown",
value: function onOptionKeyDown(event) {
var originalEvent = event.originalEvent;
var listItem = originalEvent.currentTarget;
switch (originalEvent.which) {
//down
case 40:
var nextItem = this.findNextItem(listItem);
if (nextItem) {
nextItem.focus();
}
originalEvent.preventDefault();
break;
//up
case 38:
var prevItem = this.findPrevItem(listItem);
if (prevItem) {
prevItem.focus();
}
originalEvent.preventDefault();
break;
//enter and space
case 13:
case 32:
this.onOptionSelect(event);
originalEvent.preventDefault();
break;
//escape
case 27:
this.hide();
this.inputRef.current.focus();
break;
}
}
}, {
key: "findNextItem",
value: function findNextItem(item) {
var nextItem = item.nextElementSibling;
if (nextItem) return DomHandler.hasClass(nextItem, 'p-disabled') || DomHandler.hasClass(nextItem, 'p-multiselect-item-group') ? this.findNextItem(nextItem) : nextItem;else return null;
}
}, {
key: "findPrevItem",
value: function findPrevItem(item) {
var prevItem = item.previousElementSibling;
if (prevItem) return DomHandler.hasClass(prevItem, 'p-disabled') || DomHandler.hasClass(prevItem, 'p-multiselect-item-group') ? this.findPrevItem(prevItem) : prevItem;else return null;
}
}, {
key: "onClick",
value: function onClick(event) {
if (!this.props.disabled && !this.isPanelClicked(event) && !DomHandler.hasClass(event.target, 'p-multiselect-token-icon') && !this.isClearClicked(event)) {
if (this.state.overlayVisible) {
this.hide();
} else {
this.show();
}
this.inputRef.current.focus();
event.preventDefault();
}
}
}, {
key: "onKeyDown",
value: function onKeyDown(event) {
switch (event.which) {
//down
case 40:
if (!this.state.overlayVisible && event.altKey) {
this.show();
event.preventDefault();
}
break;
//space
case 32:
if (this.state.overlayVisible) this.hide();else this.show();
event.preventDefault();
break;
//escape
case 27:
this.hide();
break;
//tab
case 9:
if (this.state.overlayVisible) {
var firstFocusableElement = DomHandler.getFirstFocusableElement(this.overlayRef.current);
if (firstFocusableElement) {
firstFocusableElement.focus();
event.preventDefault();
}
}
break;
}
}
}, {
key: "onSelectAll",
value: function onSelectAll(event) {
var _this3 = this;
if (this.props.onSelectAll) {
this.props.onSelectAll(event);
} else {
var value = null;
var visibleOptions = this.getVisibleOptions();
if (event.checked) {
value = [];
if (visibleOptions) {
var selectedOptions = visibleOptions.filter(function (option) {
return _this3.isOptionDisabled(option) && _this3.isSelected(option);
});
value = selectedOptions.map(function (option) {
return _this3.getOptionValue(option);
});
}
} else if (visibleOptions) {
visibleOptions = visibleOptions.filter(function (option) {
return !_this3.isOptionDisabled(option);
});
if (this.props.optionGroupLabel) {
value = [];
visibleOptions.forEach(function (optionGroup) {
return value = [].concat(_toConsumableArray(value), _toConsumableArray(_this3.getOptionGroupChildren(optionGroup).filter(function (option) {
return !_this3.isOptionDisabled(option);
}).map(function (option) {
return _this3.getOptionValue(option);
})));
});
} else {
value = visibleOptions.map(function (option) {
return _this3.getOptionValue(option);
});
}
}
this.updateModel(event.originalEvent, value);
}
}
}, {
key: "updateModel",
value: function updateModel(event, value) {
if (this.props.onChange) {
this.props.onChange({
originalEvent: event,
value: value,
stopPropagation: function stopPropagation() {},
preventDefault: function preventDefault() {},
target: {
name: this.props.name,
id: this.props.id,
value: value
}
});
}
}
}, {
key: "onFilterInputChange",
value: function onFilterInputChange(event) {
var _this4 = this;
var filter = event.query;
this.setState({
filter: filter
}, function () {
if (_this4.props.onFilter) {
_this4.props.onFilter({
originalEvent: event,
filter: filter
});
}
});
}
}, {
key: "resetFilter",
value: function resetFilter() {
var _this5 = this;
var filter = '';
this.setState({
filter: filter
}, function () {
_this5.props.onFilter && _this5.props.onFilter({
filter: filter
});
});
}
}, {
key: "show",
value: function show() {
this.setState({
overlayVisible: true
});
}
}, {
key: "hide",
value: function hide() {
this.setState({
overlayVisible: false
});
}
}, {
key: "onOverlayEnter",
value: function onOverlayEnter(callback) {
ZIndexUtils.set('overlay', this.overlayRef.current, PrimeReact.autoZIndex, PrimeReact.zIndex['overlay']);
this.alignOverlay();
this.scrollInView();
callback && callback();
}
}, {
key: "onOverlayEntered",
value: function onOverlayEntered() {
this.bindDocumentClickListener();
this.bindScrollListener();
this.bindResizeListener();
this.props.onShow && this.props.onShow();
}
}, {
key: "onOverlayExit",
value: function onOverlayExit() {
this.unbindDocumentClickListener();
this.unbindScrollListener();
this.unbindResizeListener();
}
}, {
key: "onOverlayExited",
value: function onOverlayExited() {
if (this.props.filter && this.props.resetFilterOnHide) {
this.resetFilter();
}
ZIndexUtils.clear(this.overlayRef.current);
this.props.onHide && this.props.onHide();
}
}, {
key: "alignOverlay",
value: function alignOverlay() {
DomHandler.alignOverlay(this.overlayRef.current, this.label.parentElement, this.props.appendTo || PrimeReact.appendTo);
}
}, {
key: "scrollInView",
value: function scrollInView() {
var highlightItem = DomHandler.findSingle(this.overlayRef.current, 'li.p-highlight');
if (highlightItem) {
highlightItem.scrollIntoView({
block: 'nearest',
inline: 'start'
});
}
}
}, {
key: "onCloseClick",
value: function onCloseClick(event) {
this.hide();
this.inputRef.current.focus();
event.preventDefault();
event.stopPropagation();
}
}, {
key: "getSelectedOptionIndex",
value: function getSelectedOptionIndex() {
if (this.props.value != null && this.props.options) {
if (this.props.optionGroupLabel) {
for (var i = 0; i < this.props.options.length; i++) {
var selectedOptionIndex = this.findOptionIndexInList(this.props.value, this.getOptionGroupChildren(this.props.options[i]));
if (selectedOptionIndex !== -1) {
return {
group: i,
option: selectedOptionIndex
};
}
}
} else {
return this.findOptionIndexInList(this.props.value, this.props.options);
}
}
return -1;
}
}, {
key: "findOptionIndexInList",
value: function findOptionIndexInList(value, list) {
var _this6 = this;
var key = this.equalityKey();
return list.findIndex(function (item) {
return value.some(function (val) {
return ObjectUtils.equals(val, _this6.getOptionValue(item), key);
});
});
}
}, {
key: "isSelected",
value: function isSelected(option) {
var _this7 = this;
var selected = false;
if (this.props.value) {
var optionValue = this.getOptionValue(option);
var isOptionValueUsed = this.isOptionValueUsed(option);
var key = this.equalityKey();
selected = this.props.value.some(function (val) {
return ObjectUtils.equals(isOptionValueUsed ? val : _this7.getOptionValue(val), optionValue, key);
});
}
return selected;
}
}, {
key: "getLabelByValue",
value: function getLabelByValue(val) {
var option;
if (this.props.options) {
if (this.props.optionGroupLabel) {
var _iterator = _createForOfIteratorHelper$8(this.props.options),
_step;
try {
for (_iterator.s(); !(_step = _iterator.n()).done;) {
var optionGroup = _step.value;
option = this.findOptionByValue(val, this.getOptionGroupChildren(optionGroup));
if (option) {
break;
}
}
} catch (err) {
_iterator.e(err);
} finally {
_iterator.f();
}
} else {
option = this.findOptionByValue(val, this.props.options);
}
}
return option ? this.getOptionLabel(option) : null;
}
}, {
key: "findOptionByValue",
value: function findOptionByValue(val, list) {
var key = this.equalityKey();
var _iterator2 = _createForOfIteratorHelper$8(list),
_step2;
try {
for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
var option = _step2.value;
var optionValue = this.getOptionValue(option);
if (ObjectUtils.equals(optionValue, val, key)) {
return option;
}
}
} catch (err) {
_iterator2.e(err);
} finally {
_iterator2.f();
}
return null;
}
}, {
key: "onFocus",
value: function onFocus(event) {
var _this8 = this;
event.persist();
this.setState({
focused: true
}, function () {
if (_this8.props.onFocus) {
_this8.props.onFocus(event);
}
});
}
}, {
key: "onBlur",
value: function onBlur(event) {
var _this9 = this;
event.persist();
this.setState({
focused: false
}, function () {
if (_this9.props.onBlur) {
_this9.props.onBlur(event);
}
});
}
}, {
key: "bindDocumentClickListener",
value: function bindDocumentClickListener() {
var _this10 = this;
if (!this.documentClickListener) {
this.documentClickListener = function (event) {
if (_this10.state.overlayVisible && _this10.isOutsideClicked(event)) {
_this10.hide();
}
};
document.addEventListener('click', this.documentClickListener);
}
}
}, {
key: "bindScrollListener",
value: function bindScrollListener() {
var _this11 = this;
if (!this.scrollHandler) {
this.scrollHandler = new ConnectedOverlayScrollHandler(this.container, function () {
if (_this11.state.overlayVisible) {
_this11.hide();
}
});
}
this.scrollHandler.bindScrollListener();
}
}, {
key: "unbindScrollListener",
value: function unbindScrollListener() {
if (this.scrollHandler) {
this.scrollHandler.unbindScrollListener();
}
}
}, {
key: "bindResizeListener",
value: function bindResizeListener() {
var _this12 = this;
if (!this.resizeListener) {
this.resizeListener = function () {
if (_this12.state.overlayVisible && !DomHandler.isTouchDevice()) {
_this12.hide();
}
};
window.addEventListener('resize', this.resizeListener);
}
}
}, {
key: "unbindResizeListener",
value: function unbindResizeListener() {
if (this.resizeListener) {
window.removeEventListener('resize', this.resizeListener);
this.resizeListener = null;
}
}
}, {
key: "isOutsideClicked",
value: function isOutsideClicked(event) {
return this.container && !(this.container.isSameNode(event.target) || this.isClearClicked(event) || this.container.contains(event.target) || this.isPanelClicked(event));
}
}, {
key: "isClearClicked",
value: function isClearClicked(event) {
return DomHandler.hasClass(event.target, 'p-multiselect-clear-icon');
}
}, {
key: "isPanelClicked",
value: function isPanelClicked(event) {
return this.overlayRef && this.overlayRef.current && this.overlayRef.current.contains(event.target);
}
}, {
key: "unbindDocumentClickListener",
value: function unbindDocumentClickListener() {
if (this.documentClickListener) {
document.removeEventListener('click', this.documentClickListener);
this.documentClickListener = null;
}
}
}, {
key: "updateInputRef",
value: function updateInputRef() {
var ref = this.props.inputRef;
if (ref) {
if (typeof ref === 'function') {
ref(this.inputRef.current);
} else {
ref.current = this.inputRef.current;
}
}
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
this.updateInputRef();
if (this.props.tooltip) {
this.renderTooltip();
}
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps) {
if (prevProps.tooltip !== this.props.tooltip || prevProps.tooltipOptions !== this.props.tooltipOptions) {
if (this.tooltip) this.tooltip.update(_objectSpread$j({
content: this.props.tooltip
}, this.props.tooltipOptions || {}));else this.renderTooltip();
}
if (this.state.overlayVisible && this.hasFilter()) {
this.alignOverlay();
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
this.unbindDocumentClickListener();
this.unbindResizeListener();
if (this.scrollHandler) {
this.scrollHandler.destroy();
this.scrollHandler = null;
}
if (this.tooltip) {
this.tooltip.destroy();
this.tooltip = null;
}
ZIndexUtils.clear(this.overlayRef.current);
}
}, {
key: "hasFilter",
value: function hasFilter() {
return this.state.filter && this.state.filter.trim().length > 0;
}
}, {
key: "isAllSelected",
value: function isAllSelected() {
var _this13 = this;
if (this.props.onSelectAll) {
return this.props.selectAll;
} else {
var visibleOptions = this.getVisibleOptions();
if (ObjectUtils.isEmpty(visibleOptions)) {
return false;
}
visibleOptions = visibleOptions.filter(function (option) {
return !_this13.isOptionDisabled(option);
});
if (this.props.optionGroupLabel) {
var _iterator3 = _createForOfIteratorHelper$8(visibleOptions),
_step3;
try {
for (_iterator3.s(); !(_step3 = _iterator3.n()).done;) {
var optionGroup = _step3.value;
var visibleOptionsGroupChildren = this.getOptionGroupChildren(optionGroup).filter(function (option) {
return !_this13.isOptionDisabled(option);
});
var _iterator4 = _createForOfIteratorHelper$8(visibleOptionsGroupChildren),
_step4;
try {
for (_iterator4.s(); !(_step4 = _iterator4.n()).done;) {
var option = _step4.value;
if (!this.isSelected(option)) {
return false;
}
}
} catch (err) {
_iterator4.e(err);
} finally {
_iterator4.f();
}
}
} catch (err) {
_iterator3.e(err);
} finally {
_iterator3.f();
}
} else {
var _iterator5 = _createForOfIteratorHelper$8(visibleOptions),
_step5;
try {
for (_iterator5.s(); !(_step5 = _iterator5.n()).done;) {
var _option = _step5.value;
if (!this.isSelected(_option)) {
return false;
}
}
} catch (err) {
_iterator5.e(err);
} finally {
_iterator5.f();
}
}
}
return true;
}
}, {
key: "getOptionLabel",
value: function getOptionLabel(option) {
return this.props.optionLabel ? ObjectUtils.resolveFieldData(option, this.props.optionLabel) : option && option['label'] !== undefined ? option['label'] : option;
}
}, {
key: "getOptionValue",
value: function getOptionValue(option) {
if (this.props.optionValue) {
var data = ObjectUtils.resolveFieldData(option, this.props.optionValue);
return data !== null ? data : option;
}
return option && option['value'] !== undefined ? option['value'] : option;
}
}, {
key: "getOptionRenderKey",
value: function getOptionRenderKey(option) {
return this.props.dataKey ? ObjectUtils.resolveFieldData(option, this.props.dataKey) : this.getOptionLabel(option);
}
}, {
key: "getOptionGroupRenderKey",
value: function getOptionGroupRenderKey(optionGroup) {
return ObjectUtils.resolveFieldData(optionGroup, this.props.optionGroupLabel);
}
}, {
key: "getOptionGroupLabel",
value: function getOptionGroupLabel(optionGroup) {
return ObjectUtils.resolveFieldData(optionGroup, this.props.optionGroupLabel);
}
}, {
key: "getOptionGroupChildren",
value: function getOptionGroupChildren(optionGroup) {
return ObjectUtils.resolveFieldData(optionGroup, this.props.optionGroupChildren);
}
}, {
key: "isOptionDisabled",
value: function isOptionDisabled(option) {
if (this.props.optionDisabled) {
return ObjectUtils.isFunction(this.props.optionDisabled) ? this.props.optionDisabled(option) : ObjectUtils.resolveFieldData(option, this.props.optionDisabled);
}
return option && option['disabled'] !== undefined ? option['disabled'] : false;
}
}, {
key: "isOptionValueUsed",
value: function isOptionValueUsed(option) {
return this.props.optionValue || option && option['value'] !== undefined;
}
}, {
key: "getVisibleOptions",
value: function getVisibleOptions() {
if (this.hasFilter()) {
var filterValue = this.state.filter.trim().toLocaleLowerCase(this.props.filterLocale);
var searchFields = this.props.filterBy ? this.props.filterBy.split(',') : [this.props.optionLabel || 'label'];
if (this.props.optionGroupLabel) {
var filteredGroups = [];
var _iterator6 = _createForOfIteratorHelper$8(this.props.options),
_step6;
try {
for (_iterator6.s(); !(_step6 = _iterator6.n()).done;) {
var optgroup = _step6.value;
var filteredSubOptions = FilterService.filter(this.getOptionGroupChildren(optgroup), searchFields, filterValue, this.props.filterMatchMode, this.props.filterLocale);
if (filteredSubOptions && filteredSubOptions.length) {
filteredGroups.push(_objectSpread$j(_objectSpread$j({}, optgroup), {
items: filteredSubOptions
}));
}
}
} catch (err) {
_iterator6.e(err);
} finally {
_iterator6.f();
}
return filteredGroups;
} else {
return FilterService.filter(this.props.options, searchFields, filterValue, this.props.filterMatchMode, this.props.filterLocale);
}
} else {
return this.props.options;
}
}
}, {
key: "isEmpty",
value: function isEmpty() {
return !this.props.value || this.props.value.length === 0;
}
}, {
key: "equalityKey",
value: function equalityKey() {
return this.props.optionValue ? null : this.props.dataKey;
}
}, {
key: "checkValidity",
value: function checkValidity() {
return this.inputRef.current.checkValidity();
}
}, {
key: "removeChip",
value: function removeChip(event, item) {
var key = this.equalityKey();
var value = this.props.value.filter(function (val) {
return !ObjectUtils.equals(val, item, key);
});
this.updateModel(event, value);
}
}, {
key: "getSelectedItemsLabel",
value: function getSelectedItemsLabel() {
var pattern = /{(.*?)}/;
if (pattern.test(this.props.selectedItemsLabel)) {
return this.props.selectedItemsLabel.replace(this.props.selectedItemsLabel.match(pattern)[0], this.props.value.length + '');
}
return this.props.selectedItemsLabel;
}
}, {
key: "getLabel",
value: function getLabel() {
var label;
if (!this.isEmpty() && !this.props.fixedPlaceholder) {
if (this.props.maxSelectedLabels && this.props.value.length > this.props.maxSelectedLabels) {
return this.getSelectedItemsLabel();
} else {
label = '';
for (var i = 0; i < this.props.value.length; i++) {
if (i !== 0) {
label += ',';
}
label += this.getLabelByValue(this.props.value[i]);
}
return label;
}
}
return label;
}
}, {
key: "getLabelContent",
value: function getLabelContent() {
var _this14 = this;
if (this.props.selectedItemTemplate) {
if (!this.isEmpty()) {
if (this.props.maxSelectedLabels && this.props.value.length > this.props.maxSelectedLabels) {
return this.getSelectedItemsLabel();
} else {
return this.props.value.map(function (val, index) {
var item = ObjectUtils.getJSXElement(_this14.props.selectedItemTemplate, val);
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, {
key: index
}, item);
});
}
} else {
return ObjectUtils.getJSXElement(this.props.selectedItemTemplate);
}
} else {
if (this.props.display === 'chip' && !this.isEmpty()) {
var value = this.props.value.slice(0, this.props.maxSelectedLabels || this.props.value.length);
return value.map(function (val) {
var label = _this14.getLabelByValue(val);
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-multiselect-token",
key: label
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-multiselect-token-label"
}, label), !_this14.props.disabled && IconUtils.getJSXIcon(_this14.props.removeIcon, {
className: 'p-multiselect-token-icon',
onClick: function onClick(e) {
return _this14.removeChip(e, val);
}
}, {
props: _this14.props
}));
});
}
return this.getLabel();
}
}
}, {
key: "renderTooltip",
value: function renderTooltip() {
this.tooltip = tip({
target: this.container,
content: this.props.tooltip,
options: this.props.tooltipOptions
});
}
}, {
key: "renderClearIcon",
value: function renderClearIcon() {
var _this15 = this;
var empty = this.isEmpty();
if (!empty && this.props.showClear && !this.props.disabled) {
return /*#__PURE__*/React__default["default"].createElement("i", {
className: "p-multiselect-clear-icon pi pi-times",
onClick: function onClick(e) {
return _this15.updateModel(e, null);
}
});
}
return null;
}
}, {
key: "renderLabel",
value: function renderLabel() {
var _this16 = this;
var empty = this.isEmpty();
var content = this.getLabelContent();
var labelClassName = classNames('p-multiselect-label', {
'p-placeholder': empty && this.props.placeholder,
'p-multiselect-label-empty': empty && !this.props.placeholder && !this.props.selectedItemTemplate,
'p-multiselect-items-label': !empty && this.props.display !== 'chip' && this.props.value.length > this.props.maxSelectedLabels
});
return /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this16.label = el;
},
className: "p-multiselect-label-container"
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: labelClassName
}, content || this.props.placeholder || 'empty'));
}
}, {
key: "render",
value: function render() {
var _this17 = this;
var className = classNames('p-multiselect p-component p-inputwrapper', {
'p-multiselect-chip': this.props.display === 'chip',
'p-disabled': this.props.disabled,
'p-multiselect-clearable': this.props.showClear && !this.props.disabled,
'p-focus': this.state.focused,
'p-inputwrapper-filled': this.props.value && this.props.value.length > 0,
'p-inputwrapper-focus': this.state.focused || this.state.overlayVisible
}, this.props.className);
var visibleOptions = this.getVisibleOptions();
var label = this.renderLabel();
var clearIcon = this.renderClearIcon();
return /*#__PURE__*/React__default["default"].createElement("div", {
id: this.props.id,
className: className,
onClick: this.onClick,
ref: function ref(el) {
return _this17.container = el;
},
style: this.props.style
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-hidden-accessible"
}, /*#__PURE__*/React__default["default"].createElement("input", {
ref: this.inputRef,
id: this.props.inputId,
name: this.props.name,
readOnly: true,
type: "text",
onFocus: this.onFocus,
onBlur: this.onBlur,
onKeyDown: this.onKeyDown,
role: "listbox",
"aria-haspopup": "listbox",
"aria-labelledby": this.props.ariaLabelledBy,
"aria-expanded": this.state.overlayVisible,
disabled: this.props.disabled,
tabIndex: this.props.tabIndex
})), label, clearIcon, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-multiselect-trigger"
}, IconUtils.getJSXIcon(this.props.dropdownIcon, {
className: 'p-multiselect-trigger-icon p-c'
}, {
props: this.props
})), /*#__PURE__*/React__default["default"].createElement(MultiSelectPanel, _extends({
ref: this.overlayRef,
visibleOptions: visibleOptions
}, this.props, {
onClick: this.onPanelClick,
onOverlayHide: this.hide,
filterValue: this.state.filter,
hasFilter: this.hasFilter,
onFilterInputChange: this.onFilterInputChange,
onCloseClick: this.onCloseClick,
onSelectAll: this.onSelectAll,
getOptionLabel: this.getOptionLabel,
getOptionRenderKey: this.getOptionRenderKey,
isOptionDisabled: this.isOptionDisabled,
getOptionGroupChildren: this.getOptionGroupChildren,
getOptionGroupLabel: this.getOptionGroupLabel,
getOptionGroupRenderKey: this.getOptionGroupRenderKey,
isSelected: this.isSelected,
getSelectedOptionIndex: this.getSelectedOptionIndex,
isAllSelected: this.isAllSelected,
onOptionSelect: this.onOptionSelect,
allowOptionSelect: this.allowOptionSelect,
onOptionKeyDown: this.onOptionKeyDown,
"in": this.state.overlayVisible,
onEnter: this.onOverlayEnter,
onEntered: this.onOverlayEntered,
onExit: this.onOverlayExit,
onExited: this.onOverlayExited
})));
}
}]);
return MultiSelect;
}(React.Component);
_defineProperty(MultiSelect, "defaultProps", {
id: null,
inputRef: null,
name: null,
value: null,
options: null,
optionLabel: null,
optionValue: null,
optionDisabled: null,
optionGroupLabel: null,
optionGroupChildren: null,
optionGroupTemplate: null,
display: 'comma',
style: null,
className: null,
panelClassName: null,
panelStyle: null,
virtualScrollerOptions: null,
scrollHeight: '200px',
placeholder: null,
fixedPlaceholder: false,
disabled: false,
showClear: false,
filter: false,
filterBy: null,
filterMatchMode: 'contains',
filterPlaceholder: null,
filterLocale: undefined,
emptyFilterMessage: null,
resetFilterOnHide: false,
tabIndex: 0,
dataKey: null,
inputId: null,
appendTo: null,
tooltip: null,
tooltipOptions: null,
maxSelectedLabels: null,
selectionLimit: null,
selectedItemsLabel: '{0} items selected',
ariaLabelledBy: null,
itemTemplate: null,
selectedItemTemplate: null,
panelHeaderTemplate: null,
panelFooterTemplate: null,
transitionOptions: null,
dropdownIcon: 'pi pi-chevron-down',
removeIcon: 'pi pi-times-circle',
showSelectAll: true,
selectAll: false,
onChange: null,
onFocus: null,
onBlur: null,
onShow: null,
onHide: null,
onFilter: null,
onSelectAll: null
});
function ownKeys$i(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$i(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$i(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$i(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createSuper$W(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$W(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$W() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var MultiStateCheckbox = /*#__PURE__*/function (_Component) {
_inherits(MultiStateCheckbox, _Component);
var _super = _createSuper$W(MultiStateCheckbox);
function MultiStateCheckbox(props) {
var _this;
_classCallCheck(this, MultiStateCheckbox);
_this = _super.call(this, props);
_this.state = {
focused: false
};
_this.onClick = _this.onClick.bind(_assertThisInitialized(_this));
_this.onFocus = _this.onFocus.bind(_assertThisInitialized(_this));
_this.onBlur = _this.onBlur.bind(_assertThisInitialized(_this));
_this.inputRef = /*#__PURE__*/React.createRef(_this.props.inputRef);
return _this;
}
_createClass(MultiStateCheckbox, [{
key: "onClick",
value: function onClick(event) {
if (!this.props.disabled && !this.props.readOnly) {
this.toggle(event);
this.inputRef.current.focus();
}
}
}, {
key: "getOptionValue",
value: function getOptionValue(option) {
return this.props.optionValue ? ObjectUtils.resolveFieldData(option, this.props.optionValue) : option;
}
}, {
key: "equalityKey",
value: function equalityKey() {
return this.props.optionValue ? null : this.props.dataKey;
}
}, {
key: "findSelectedOptionMap",
value: function findSelectedOptionMap() {
var _this2 = this;
var option, index;
if (this.props.options) {
var key = this.equalityKey();
index = this.props.options.findIndex(function (option) {
return ObjectUtils.equals(_this2.props.value, _this2.getOptionValue(option), key);
});
option = this.props.options[index];
}
return {
option: option,
index: index
};
}
}, {
key: "findNextOption",
value: function findNextOption() {
if (this.props.options) {
var _this$findSelectedOpt = this.findSelectedOptionMap(),
index = _this$findSelectedOpt.index;
return index === this.props.options.length - 1 ? this.props.empty ? null : this.props.options[0] : this.props.options[index + 1];
}
return null;
}
}, {
key: "toggle",
value: function toggle(event) {
var newValue = this.getOptionValue(this.findNextOption());
if (this.props.onChange) {
this.props.onChange({
originalEvent: event,
value: newValue,
stopPropagation: function stopPropagation() {},
preventDefault: function preventDefault() {},
target: {
name: this.props.name,
id: this.props.id,
value: newValue
}
});
}
}
}, {
key: "onFocus",
value: function onFocus() {
this.setState({
focused: true
});
}
}, {
key: "onBlur",
value: function onBlur() {
this.setState({
focused: false
});
}
}, {
key: "updateInputRef",
value: function updateInputRef() {
var ref = this.props.inputRef;
if (ref) {
if (typeof ref === 'function') {
ref(this.inputRef.current);
} else {
ref.current = this.inputRef.current;
}
}
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
this.updateInputRef();
if (this.props.tooltip && !this.props.disabled) {
this.renderTooltip();
}
if (!this.props.empty && this.props.value === null) {
this.toggle();
}
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps) {
if (prevProps.tooltip !== this.props.tooltip || prevProps.tooltipOptions !== this.props.tooltipOptions) {
if (this.tooltip) this.tooltip.update(_objectSpread$i({
content: this.props.tooltip
}, this.props.tooltipOptions || {}));else this.renderTooltip();
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
if (this.tooltip) {
this.tooltip.destroy();
this.tooltip = null;
}
}
}, {
key: "renderTooltip",
value: function renderTooltip() {
this.tooltip = tip({
target: this.element,
content: this.props.tooltip,
options: this.props.tooltipOptions
});
}
}, {
key: "renderIcon",
value: function renderIcon(option) {
var icon = option && option.icon || '';
var className = classNames('p-checkbox-icon p-c', _defineProperty({}, "".concat(icon), true));
var content = /*#__PURE__*/React__default["default"].createElement("span", {
className: className
});
if (this.props.iconTemplate) {
var defaultOptions = {
option: option,
className: className,
element: content,
props: this.props
};
return ObjectUtils.getJSXElement(this.props.iconTemplate, defaultOptions);
}
return content;
}
}, {
key: "render",
value: function render() {
var _this3 = this;
var _this$findSelectedOpt2 = this.findSelectedOptionMap(),
option = _this$findSelectedOpt2.option;
var containerClassName = classNames('p-multistatecheckbox p-checkbox p-component', this.props.className);
var boxClassName = classNames('p-checkbox-box', {
'p-highlight': !!option,
'p-disabled': this.props.disabled,
'p-focus': this.state.focused
}, option && option.className);
var icon = this.renderIcon(option);
return /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this3.element = el;
},
id: this.props.id,
className: containerClassName,
style: this.props.style,
onClick: this.onClick
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-hidden-accessible"
}, /*#__PURE__*/React__default["default"].createElement("input", {
ref: this.inputRef,
type: "checkbox",
"aria-labelledby": this.props.ariaLabelledBy,
id: this.props.inputId,
name: this.props.name,
onFocus: this.onFocus,
onBlur: this.onBlur,
disabled: this.props.disabled,
readOnly: this.props.readOnly,
defaultChecked: !!option
})), /*#__PURE__*/React__default["default"].createElement("div", {
className: boxClassName,
ref: function ref(el) {
return _this3.box = el;
},
role: "checkbox",
"aria-checked": !!option,
style: option && option.style
}, icon));
}
}]);
return MultiStateCheckbox;
}(React.Component);
_defineProperty(MultiStateCheckbox, "defaultProps", {
id: null,
inputRef: null,
inputId: null,
value: null,
options: null,
optionValue: null,
iconTemplate: null,
dataKey: null,
name: null,
style: null,
className: null,
disabled: false,
readOnly: false,
empty: true,
tooltip: null,
tooltipOptions: null,
ariaLabelledBy: null,
onChange: null
});
function _createSuper$V(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$V(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$V() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var OrderListControls = /*#__PURE__*/function (_Component) {
_inherits(OrderListControls, _Component);
var _super = _createSuper$V(OrderListControls);
function OrderListControls() {
var _this;
_classCallCheck(this, OrderListControls);
_this = _super.call(this);
_this.moveUp = _this.moveUp.bind(_assertThisInitialized(_this));
_this.moveTop = _this.moveTop.bind(_assertThisInitialized(_this));
_this.moveDown = _this.moveDown.bind(_assertThisInitialized(_this));
_this.moveBottom = _this.moveBottom.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(OrderListControls, [{
key: "moveUp",
value: function moveUp(event) {
if (this.props.selection) {
var value = _toConsumableArray(this.props.value);
for (var i = 0; i < this.props.selection.length; i++) {
var selectedItem = this.props.selection[i];
var selectedItemIndex = ObjectUtils.findIndexInList(selectedItem, value, this.props.dataKey);
if (selectedItemIndex !== 0) {
var movedItem = value[selectedItemIndex];
var temp = value[selectedItemIndex - 1];
value[selectedItemIndex - 1] = movedItem;
value[selectedItemIndex] = temp;
} else {
break;
}
}
if (this.props.onReorder) {
this.props.onReorder({
originalEvent: event,
value: value,
direction: 'up'
});
}
}
}
}, {
key: "moveTop",
value: function moveTop(event) {
if (this.props.selection) {
var value = _toConsumableArray(this.props.value);
for (var i = 0; i < this.props.selection.length; i++) {
var selectedItem = this.props.selection[i];
var selectedItemIndex = ObjectUtils.findIndexInList(selectedItem, value, this.props.dataKey);
if (selectedItemIndex !== 0) {
var movedItem = value.splice(selectedItemIndex, 1)[0];
value.unshift(movedItem);
} else {
break;
}
}
if (this.props.onReorder) {
this.props.onReorder({
originalEvent: event,
value: value,
direction: 'top'
});
}
}
}
}, {
key: "moveDown",
value: function moveDown(event) {
if (this.props.selection) {
var value = _toConsumableArray(this.props.value);
for (var i = this.props.selection.length - 1; i >= 0; i--) {
var selectedItem = this.props.selection[i];
var selectedItemIndex = ObjectUtils.findIndexInList(selectedItem, value, this.props.dataKey);
if (selectedItemIndex !== value.length - 1) {
var movedItem = value[selectedItemIndex];
var temp = value[selectedItemIndex + 1];
value[selectedItemIndex + 1] = movedItem;
value[selectedItemIndex] = temp;
} else {
break;
}
}
if (this.props.onReorder) {
this.props.onReorder({
originalEvent: event,
value: value,
direction: 'down'
});
}
}
}
}, {
key: "moveBottom",
value: function moveBottom(event) {
if (this.props.selection) {
var value = _toConsumableArray(this.props.value);
for (var i = this.props.selection.length - 1; i >= 0; i--) {
var selectedItem = this.props.selection[i];
var selectedItemIndex = ObjectUtils.findIndexInList(selectedItem, value, this.props.dataKey);
if (selectedItemIndex !== value.length - 1) {
var movedItem = value.splice(selectedItemIndex, 1)[0];
value.push(movedItem);
} else {
break;
}
}
if (this.props.onReorder) {
this.props.onReorder({
originalEvent: event,
value: value,
direction: 'bottom'
});
}
}
}
}, {
key: "render",
value: function render() {
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-orderlist-controls"
}, /*#__PURE__*/React__default["default"].createElement(Button, {
type: "button",
icon: "pi pi-angle-up",
onClick: this.moveUp
}), /*#__PURE__*/React__default["default"].createElement(Button, {
type: "button",
icon: "pi pi-angle-double-up",
onClick: this.moveTop
}), /*#__PURE__*/React__default["default"].createElement(Button, {
type: "button",
icon: "pi pi-angle-down",
onClick: this.moveDown
}), /*#__PURE__*/React__default["default"].createElement(Button, {
type: "button",
icon: "pi pi-angle-double-down",
onClick: this.moveBottom
}));
}
}]);
return OrderListControls;
}(React.Component);
function _createSuper$U(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$U(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$U() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var OrderListSubList = /*#__PURE__*/function (_Component) {
_inherits(OrderListSubList, _Component);
var _super = _createSuper$U(OrderListSubList);
function OrderListSubList(props) {
var _this;
_classCallCheck(this, OrderListSubList);
_this = _super.call(this, props);
_this.onDragEnd = _this.onDragEnd.bind(_assertThisInitialized(_this));
_this.onDragLeave = _this.onDragLeave.bind(_assertThisInitialized(_this));
_this.onDrop = _this.onDrop.bind(_assertThisInitialized(_this));
_this.onListMouseMove = _this.onListMouseMove.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(OrderListSubList, [{
key: "isSelected",
value: function isSelected(item) {
return ObjectUtils.findIndexInList(item, this.props.selection, this.props.dataKey) !== -1;
}
}, {
key: "onDragStart",
value: function onDragStart(event, index) {
this.dragging = true;
this.draggedItemIndex = index;
if (this.props.dragdropScope) {
event.dataTransfer.setData('text', 'orderlist');
}
}
}, {
key: "onDragOver",
value: function onDragOver(event, index) {
if (this.draggedItemIndex !== index && this.draggedItemIndex + 1 !== index) {
this.dragOverItemIndex = index;
DomHandler.addClass(event.target, 'p-orderlist-droppoint-highlight');
event.preventDefault();
}
}
}, {
key: "onDragLeave",
value: function onDragLeave(event) {
this.dragOverItemIndex = null;
DomHandler.removeClass(event.target, 'p-orderlist-droppoint-highlight');
}
}, {
key: "onDrop",
value: function onDrop(event) {
var dropIndex = this.draggedItemIndex > this.dragOverItemIndex ? this.dragOverItemIndex : this.dragOverItemIndex === 0 ? 0 : this.dragOverItemIndex - 1;
var value = _toConsumableArray(this.props.value);
ObjectUtils.reorderArray(value, this.draggedItemIndex, dropIndex);
this.dragOverItemIndex = null;
DomHandler.removeClass(event.target, 'p-orderlist-droppoint-highlight');
if (this.props.onChange) {
this.props.onChange({
originalEvent: event,
value: value
});
}
}
}, {
key: "onDragEnd",
value: function onDragEnd(event) {
this.dragging = false;
}
}, {
key: "onListMouseMove",
value: function onListMouseMove(event) {
if (this.dragging) {
var offsetY = this.listElement.getBoundingClientRect().top + DomHandler.getWindowScrollTop();
var bottomDiff = offsetY + this.listElement.clientHeight - event.pageY;
var topDiff = event.pageY - offsetY;
if (bottomDiff < 25 && bottomDiff > 0) this.listElement.scrollTop += 15;else if (topDiff < 25 && topDiff > 0) this.listElement.scrollTop -= 15;
}
}
}, {
key: "renderDropPoint",
value: function renderDropPoint(index, key) {
var _this2 = this;
return /*#__PURE__*/React__default["default"].createElement("li", {
key: key,
className: "p-orderlist-droppoint",
onDragOver: function onDragOver(e) {
return _this2.onDragOver(e, index + 1);
},
onDragLeave: this.onDragLeave,
onDrop: this.onDrop
});
}
}, {
key: "render",
value: function render() {
var _this3 = this;
var header = null;
var items = null;
if (this.props.header) {
header = /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-orderlist-header"
}, this.props.header);
}
if (this.props.value) {
items = this.props.value.map(function (item, i) {
var content = _this3.props.itemTemplate ? _this3.props.itemTemplate(item) : item;
var itemClassName = classNames('p-orderlist-item', {
'p-highlight': _this3.isSelected(item)
}, _this3.props.className);
var key = JSON.stringify(item);
if (_this3.props.dragdrop) {
var _items = [_this3.renderDropPoint(i, key + '_droppoint'), /*#__PURE__*/React__default["default"].createElement("li", {
key: key,
className: itemClassName,
onClick: function onClick(e) {
return _this3.props.onItemClick({
originalEvent: e,
value: item,
index: i
});
},
onKeyDown: function onKeyDown(e) {
return _this3.props.onItemKeyDown({
originalEvent: e,
value: item,
index: i
});
},
role: "option",
"aria-selected": _this3.isSelected(item),
draggable: "true",
onDragStart: function onDragStart(e) {
return _this3.onDragStart(e, i);
},
onDragEnd: _this3.onDragEnd,
tabIndex: _this3.props.tabIndex
}, content, /*#__PURE__*/React__default["default"].createElement(Ripple, null))];
if (i === _this3.props.value.length - 1) {
_items.push(_this3.renderDropPoint(item, i, key + '_droppoint_end'));
}
return _items;
} else {
return /*#__PURE__*/React__default["default"].createElement("li", {
key: JSON.stringify(item),
className: itemClassName,
role: "option",
"aria-selected": _this3.isSelected(item),
onClick: function onClick(e) {
return _this3.props.onItemClick({
originalEvent: e,
value: item,
index: i
});
},
onKeyDown: function onKeyDown(e) {
return _this3.props.onItemKeyDown({
originalEvent: e,
value: item,
index: i
});
},
tabIndex: _this3.props.tabIndex
}, content);
}
});
}
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-orderlist-list-container"
}, header, /*#__PURE__*/React__default["default"].createElement("ul", {
ref: function ref(el) {
return _this3.listElement = el;
},
className: "p-orderlist-list",
style: this.props.listStyle,
onDragOver: this.onListMouseMove,
role: "listbox",
"aria-multiselectable": true
}, items));
}
}]);
return OrderListSubList;
}(React.Component);
function _createSuper$T(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$T(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$T() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var OrderList = /*#__PURE__*/function (_Component) {
_inherits(OrderList, _Component);
var _super = _createSuper$T(OrderList);
function OrderList(props) {
var _this;
_classCallCheck(this, OrderList);
_this = _super.call(this, props);
_this.state = {
selection: []
};
_this.onItemClick = _this.onItemClick.bind(_assertThisInitialized(_this));
_this.onItemKeyDown = _this.onItemKeyDown.bind(_assertThisInitialized(_this));
_this.onReorder = _this.onReorder.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(OrderList, [{
key: "onItemClick",
value: function onItemClick(event) {
var metaKey = event.originalEvent.metaKey || event.originalEvent.ctrlKey;
var index = ObjectUtils.findIndexInList(event.value, this.state.selection, this.props.dataKey);
var selected = index !== -1;
var selection;
if (selected) {
if (metaKey) selection = this.state.selection.filter(function (val, i) {
return i !== index;
});else selection = [event.value];
} else {
if (metaKey) selection = [].concat(_toConsumableArray(this.state.selection), [event.value]);else selection = [event.value];
}
this.setState({
selection: selection
});
}
}, {
key: "onItemKeyDown",
value: function onItemKeyDown(event) {
var listItem = event.originalEvent.currentTarget;
switch (event.originalEvent.which) {
//down
case 40:
var nextItem = this.findNextItem(listItem);
if (nextItem) {
nextItem.focus();
}
event.originalEvent.preventDefault();
break;
//up
case 38:
var prevItem = this.findPrevItem(listItem);
if (prevItem) {
prevItem.focus();
}
event.originalEvent.preventDefault();
break;
//enter
case 13:
this.onItemClick(event);
event.originalEvent.preventDefault();
break;
}
}
}, {
key: "findNextItem",
value: function findNextItem(item) {
var nextItem = item.nextElementSibling;
if (nextItem) return !DomHandler.hasClass(nextItem, 'p-orderlist-item') ? this.findNextItem(nextItem) : nextItem;else return null;
}
}, {
key: "findPrevItem",
value: function findPrevItem(item) {
var prevItem = item.previousElementSibling;
if (prevItem) return !DomHandler.hasClass(prevItem, 'p-orderlist-item') ? this.findPrevItem(prevItem) : prevItem;else return null;
}
}, {
key: "onReorder",
value: function onReorder(event) {
if (this.props.onChange) {
this.props.onChange({
event: event.originalEvent,
value: event.value
});
}
this.reorderDirection = event.direction;
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate() {
if (this.reorderDirection) {
this.updateListScroll();
this.reorderDirection = null;
}
}
}, {
key: "updateListScroll",
value: function updateListScroll() {
var listItems = DomHandler.find(this.subList.listElement, '.p-orderlist-item.p-highlight');
if (listItems && listItems.length) {
switch (this.reorderDirection) {
case 'up':
DomHandler.scrollInView(this.subList.listElement, listItems[0]);
break;
case 'top':
this.subList.listElement.scrollTop = 0;
break;
case 'down':
DomHandler.scrollInView(this.subList.listElement, listItems[listItems.length - 1]);
break;
case 'bottom':
this.subList.listElement.scrollTop = this.subList.listElement.scrollHeight;
break;
}
}
}
}, {
key: "render",
value: function render() {
var _this2 = this;
var className = classNames('p-orderlist p-component', this.props.className);
return /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this2.element = el;
},
id: this.props.id,
className: className,
style: this.props.style
}, /*#__PURE__*/React__default["default"].createElement(OrderListControls, {
value: this.props.value,
selection: this.state.selection,
onReorder: this.onReorder,
dataKey: this.props.dataKey
}), /*#__PURE__*/React__default["default"].createElement(OrderListSubList, {
ref: function ref(el) {
return _this2.subList = el;
},
value: this.props.value,
selection: this.state.selection,
onItemClick: this.onItemClick,
onItemKeyDown: this.onItemKeyDown,
itemTemplate: this.props.itemTemplate,
header: this.props.header,
listStyle: this.props.listStyle,
dataKey: this.props.dataKey,
dragdrop: this.props.dragdrop,
onDragStart: this.onDragStart,
onDragEnter: this.onDragEnter,
onDragEnd: this.onDragEnd,
onDragLeave: this.onDragEnter,
onDrop: this.onDrop,
onChange: this.props.onChange,
tabIndex: this.props.tabIndex
}));
}
}]);
return OrderList;
}(React.Component);
_defineProperty(OrderList, "defaultProps", {
id: null,
value: null,
header: null,
style: null,
className: null,
listStyle: null,
dragdrop: false,
tabIndex: 0,
dataKey: null,
onChange: null,
itemTemplate: null
});
function _createSuper$S(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$S(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$S() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var OrganizationChartNode = /*#__PURE__*/function (_Component) {
_inherits(OrganizationChartNode, _Component);
var _super = _createSuper$S(OrganizationChartNode);
function OrganizationChartNode(props) {
var _this;
_classCallCheck(this, OrganizationChartNode);
_this = _super.call(this, props);
_this.node = _this.props.node;
_this.state = {
expanded: _this.node.expanded
};
return _this;
}
_createClass(OrganizationChartNode, [{
key: "getLeaf",
value: function getLeaf() {
return this.node.leaf === false ? false : !(this.node.children && this.node.children.length);
}
}, {
key: "getColspan",
value: function getColspan() {
return this.node.children && this.node.children.length ? this.node.children.length * 2 : null;
}
}, {
key: "onNodeClick",
value: function onNodeClick(event, node) {
this.props.onNodeClick(event, node);
}
}, {
key: "toggleNode",
value: function toggleNode(event, node) {
this.setState(function (prevState) {
return {
expanded: !prevState.expanded
};
});
event.preventDefault();
}
}, {
key: "isSelected",
value: function isSelected() {
return this.props.isSelected(this.node);
}
}, {
key: "render",
value: function render() {
var _this2 = this;
this.node = this.props.node;
var colspan = this.getColspan();
var nodeClassName = classNames('p-organizationchart-node-content', this.node.className, {
'p-organizationchart-selectable-node': this.props.selectionMode && this.node.selectable !== false,
'p-highlight': this.isSelected()
}),
nodeLabel = this.props.nodeTemplate && this.props.nodeTemplate(this.node) ? /*#__PURE__*/React__default["default"].createElement("div", null, this.props.nodeTemplate(this.node)) : /*#__PURE__*/React__default["default"].createElement("div", null, this.node.label),
toggleIcon = classNames('p-node-toggler-icon', {
'pi pi-chevron-down': this.state.expanded,
'pi pi-chevron-up': !this.state.expanded
}),
nodeContent = /*#__PURE__*/React__default["default"].createElement("tr", null, /*#__PURE__*/React__default["default"].createElement("td", {
colSpan: colspan
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: nodeClassName,
onClick: function onClick(e) {
return _this2.onNodeClick(e, _this2.node);
}
}, nodeLabel,
/* eslint-disable */
!this.getLeaf() && /*#__PURE__*/React__default["default"].createElement("a", {
href: "#",
className: "p-node-toggler",
onClick: function onClick(e) {
return _this2.toggleNode(e, _this2.node);
}
}, /*#__PURE__*/React__default["default"].createElement("i", {
className: toggleIcon
}))
/* eslint-enable */
)));
var _visibility = !this.getLeaf() && this.state.expanded ? 'inherit' : 'hidden',
linesDown = /*#__PURE__*/React__default["default"].createElement("tr", {
style: {
visibility: _visibility
},
className: "p-organizationchart-lines"
}, /*#__PURE__*/React__default["default"].createElement("td", {
colSpan: colspan
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-organizationchart-line-down"
}))),
nodeChildLength = this.node.children && this.node.children.length,
linesMiddle = /*#__PURE__*/React__default["default"].createElement("tr", {
style: {
visibility: _visibility
},
className: "p-organizationchart-lines"
}, this.node.children && this.node.children.length === 1 && /*#__PURE__*/React__default["default"].createElement("td", {
colSpan: this.getColspan()
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-organizationchart-line-down"
})), this.node.children && this.node.children.length > 1 && this.node.children.map(function (item, index) {
var leftClass = classNames('p-organizationchart-line-left', {
'p-organizationchart-line-top': index !== 0
}),
rightClass = classNames('p-organizationchart-line-right', {
'p-organizationchart-line-top': index !== nodeChildLength - 1
});
return [/*#__PURE__*/React__default["default"].createElement("td", {
key: index + '_lineleft',
className: leftClass
}, "\xA0"), /*#__PURE__*/React__default["default"].createElement("td", {
key: index + '_lineright',
className: rightClass
}, "\xA0")];
})),
childNodes = /*#__PURE__*/React__default["default"].createElement("tr", {
style: {
visibility: _visibility
},
className: "p-organizationchart-nodes"
}, this.node.children && this.node.children.map(function (child, index) {
return /*#__PURE__*/React__default["default"].createElement("td", {
key: index,
colSpan: "2"
}, /*#__PURE__*/React__default["default"].createElement(OrganizationChartNode, {
node: child,
nodeTemplate: _this2.props.nodeTemplate,
selectionMode: _this2.props.selectionMode,
onNodeClick: _this2.props.onNodeClick,
isSelected: _this2.props.isSelected
}));
}));
return /*#__PURE__*/React__default["default"].createElement("table", {
className: "p-organizationchart-table"
}, /*#__PURE__*/React__default["default"].createElement("tbody", null, nodeContent, linesDown, linesMiddle, childNodes));
}
}]);
return OrganizationChartNode;
}(React.Component);
_defineProperty(OrganizationChartNode, "defaultProps", {
node: null,
nodeTemplate: null,
root: false,
first: false,
last: false,
selectionMode: null,
onNodeClick: null,
isSelected: null
});
var OrganizationChart = /*#__PURE__*/function (_Component2) {
_inherits(OrganizationChart, _Component2);
var _super2 = _createSuper$S(OrganizationChart);
function OrganizationChart(props) {
var _this3;
_classCallCheck(this, OrganizationChart);
_this3 = _super2.call(this, props);
_this3.root = _this3.props.value && _this3.props.value.length ? _this3.props.value[0] : null;
_this3.onNodeClick = _this3.onNodeClick.bind(_assertThisInitialized(_this3));
_this3.isSelected = _this3.isSelected.bind(_assertThisInitialized(_this3));
return _this3;
}
_createClass(OrganizationChart, [{
key: "onNodeClick",
value: function onNodeClick(event, node) {
if (this.props.selectionMode) {
var eventTarget = event.target;
if (eventTarget.className && (eventTarget.className.indexOf('p-node-toggler') !== -1 || eventTarget.className.indexOf('p-node-toggler-icon') !== -1)) {
return;
}
if (node.selectable === false) {
return;
}
var index = this.findIndexInSelection(node);
var selected = index >= 0;
var selection;
if (this.props.selectionMode === 'single') {
if (selected) {
selection = null;
if (this.props.onNodeUnselect) {
this.props.onNodeUnselect({
originalEvent: event,
node: node
});
}
} else {
selection = node;
if (this.props.onNodeSelect) {
this.props.onNodeSelect({
originalEvent: event,
node: node
});
}
}
} else if (this.props.selectionMode === 'multiple') {
if (selected) {
selection = this.props.selection.filter(function (val, i) {
return i !== index;
});
if (this.props.onNodeUnselect) {
this.props.onNodeUnselect({
originalEvent: event,
node: node
});
}
} else {
selection = [].concat(_toConsumableArray(this.props.selection || []), [node]);
if (this.props.onNodeSelect) {
this.props.onNodeSelect({
originalEvent: event,
node: node
});
}
}
}
if (this.props.onSelectionChange) {
this.props.onSelectionChange({
originalEvent: event,
data: selection
});
}
}
}
}, {
key: "findIndexInSelection",
value: function findIndexInSelection(node) {
var index = -1;
if (this.props.selectionMode && this.props.selection) {
if (this.props.selectionMode === 'single') {
index = this.props.selection === node ? 0 : -1;
} else if (this.props.selectionMode === 'multiple') {
for (var i = 0; i < this.props.selection.length; i++) {
if (this.props.selection[i] === node) {
index = i;
break;
}
}
}
}
return index;
}
}, {
key: "isSelected",
value: function isSelected(node) {
return this.findIndexInSelection(node) !== -1;
}
}, {
key: "render",
value: function render() {
this.root = this.props.value && this.props.value.length ? this.props.value[0] : null;
var className = classNames('p-organizationchart p-component', this.props.className);
return /*#__PURE__*/React__default["default"].createElement("div", {
id: this.props.id,
style: this.props.style,
className: className
}, /*#__PURE__*/React__default["default"].createElement(OrganizationChartNode, {
node: this.root,
nodeTemplate: this.props.nodeTemplate,
selectionMode: this.props.selectionMode,
onNodeClick: this.onNodeClick,
isSelected: this.isSelected
}));
}
}]);
return OrganizationChart;
}(React.Component);
_defineProperty(OrganizationChart, "defaultProps", {
id: null,
value: null,
style: null,
className: null,
selectionMode: null,
selection: null,
nodeTemplate: null,
onSelectionChange: null,
onNodeSelect: null,
onNodeUnselect: null
});
function _createSuper$R(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$R(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$R() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var OverlayPanel = /*#__PURE__*/function (_Component) {
_inherits(OverlayPanel, _Component);
var _super = _createSuper$R(OverlayPanel);
function OverlayPanel(props) {
var _this;
_classCallCheck(this, OverlayPanel);
_this = _super.call(this, props);
_this.state = {
visible: false
};
_this.onCloseClick = _this.onCloseClick.bind(_assertThisInitialized(_this));
_this.onPanelClick = _this.onPanelClick.bind(_assertThisInitialized(_this));
_this.onEnter = _this.onEnter.bind(_assertThisInitialized(_this));
_this.onEntered = _this.onEntered.bind(_assertThisInitialized(_this));
_this.onExit = _this.onExit.bind(_assertThisInitialized(_this));
_this.onExited = _this.onExited.bind(_assertThisInitialized(_this));
_this.onContentClick = _this.onContentClick.bind(_assertThisInitialized(_this));
_this.attributeSelector = UniqueComponentId();
_this.overlayRef = /*#__PURE__*/React__default["default"].createRef();
return _this;
}
_createClass(OverlayPanel, [{
key: "bindDocumentClickListener",
value: function bindDocumentClickListener() {
var _this2 = this;
if (!this.documentClickListener && this.props.dismissable) {
this.documentClickListener = function (event) {
if (!_this2.isPanelClicked && _this2.isOutsideClicked(event.target)) {
_this2.hide();
}
_this2.isPanelClicked = false;
};
document.addEventListener('click', this.documentClickListener);
}
}
}, {
key: "unbindDocumentClickListener",
value: function unbindDocumentClickListener() {
if (this.documentClickListener) {
document.removeEventListener('click', this.documentClickListener);
this.documentClickListener = null;
}
}
}, {
key: "bindScrollListener",
value: function bindScrollListener() {
var _this3 = this;
if (!this.scrollHandler) {
this.scrollHandler = new ConnectedOverlayScrollHandler(this.target, function () {
if (_this3.state.visible) {
_this3.hide();
}
});
}
this.scrollHandler.bindScrollListener();
}
}, {
key: "unbindScrollListener",
value: function unbindScrollListener() {
if (this.scrollHandler) {
this.scrollHandler.unbindScrollListener();
}
}
}, {
key: "bindResizeListener",
value: function bindResizeListener() {
var _this4 = this;
if (!this.resizeListener) {
this.resizeListener = function () {
if (_this4.state.visible && !DomHandler.isTouchDevice()) {
_this4.hide();
}
};
window.addEventListener('resize', this.resizeListener);
}
}
}, {
key: "unbindResizeListener",
value: function unbindResizeListener() {
if (this.resizeListener) {
window.removeEventListener('resize', this.resizeListener);
this.resizeListener = null;
}
}
}, {
key: "isOutsideClicked",
value: function isOutsideClicked(target) {
return this.overlayRef && this.overlayRef.current && !(this.overlayRef.current.isSameNode(target) || this.overlayRef.current.contains(target));
}
}, {
key: "hasTargetChanged",
value: function hasTargetChanged(event, target) {
return this.target != null && this.target !== (target || event.currentTarget || event.target);
}
}, {
key: "onCloseClick",
value: function onCloseClick(event) {
this.hide();
event.preventDefault();
}
}, {
key: "onPanelClick",
value: function onPanelClick(event) {
this.isPanelClicked = true;
OverlayService.emit('overlay-click', {
originalEvent: event,
target: this.target
});
}
}, {
key: "onContentClick",
value: function onContentClick() {
this.isPanelClicked = true;
}
}, {
key: "toggle",
value: function toggle(event, target) {
var _this5 = this;
if (this.state.visible) {
this.hide();
if (this.hasTargetChanged(event, target)) {
this.target = target || event.currentTarget || event.target;
setTimeout(function () {
_this5.show(event, _this5.target);
}, 200);
}
} else {
this.show(event, target);
}
}
}, {
key: "show",
value: function show(event, target) {
var _this6 = this;
this.target = target || event.currentTarget || event.target;
if (this.state.visible) {
this.align();
} else {
this.setState({
visible: true
}, function () {
_this6.overlayEventListener = function (e) {
if (!_this6.isOutsideClicked(e.target)) {
_this6.isPanelClicked = true;
}
};
OverlayService.on('overlay-click', _this6.overlayEventListener);
});
}
}
}, {
key: "hide",
value: function hide() {
var _this7 = this;
this.setState({
visible: false
}, function () {
OverlayService.off('overlay-click', _this7.overlayEventListener);
_this7.overlayEventListener = null;
});
}
}, {
key: "onEnter",
value: function onEnter() {
ZIndexUtils.set('overlay', this.overlayRef.current, PrimeReact.autoZIndex, PrimeReact.zIndex['overlay']);
this.overlayRef.current.setAttribute(this.attributeSelector, '');
this.align();
}
}, {
key: "onEntered",
value: function onEntered() {
this.bindDocumentClickListener();
this.bindScrollListener();
this.bindResizeListener();
this.props.onShow && this.props.onShow();
}
}, {
key: "onExit",
value: function onExit() {
this.unbindDocumentClickListener();
this.unbindScrollListener();
this.unbindResizeListener();
}
}, {
key: "onExited",
value: function onExited() {
ZIndexUtils.clear(this.overlayRef.current);
this.props.onHide && this.props.onHide();
}
}, {
key: "align",
value: function align() {
if (this.target) {
DomHandler.absolutePosition(this.overlayRef.current, this.target);
var containerOffset = DomHandler.getOffset(this.overlayRef.current);
var targetOffset = DomHandler.getOffset(this.target);
var arrowLeft = 0;
if (containerOffset.left < targetOffset.left) {
arrowLeft = targetOffset.left - containerOffset.left;
}
this.overlayRef.current.style.setProperty('--overlayArrowLeft', "".concat(arrowLeft, "px"));
if (containerOffset.top < targetOffset.top) {
DomHandler.addClass(this.overlayRef.current, 'p-overlaypanel-flipped');
}
}
}
}, {
key: "createStyle",
value: function createStyle() {
if (!this.styleElement) {
this.styleElement = DomHandler.createInlineStyle(PrimeReact.nonce);
var innerHTML = '';
for (var breakpoint in this.props.breakpoints) {
innerHTML += "\n @media screen and (max-width: ".concat(breakpoint, ") {\n .p-overlaypanel[").concat(this.attributeSelector, "] {\n width: ").concat(this.props.breakpoints[breakpoint], " !important;\n }\n }\n ");
}
this.styleElement.innerHTML = innerHTML;
}
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
if (this.props.breakpoints) {
this.createStyle();
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
this.unbindDocumentClickListener();
this.unbindResizeListener();
if (this.scrollHandler) {
this.scrollHandler.destroy();
this.scrollHandler = null;
}
this.styleElement = DomHandler.removeInlineStyle(this.styleElement);
if (this.overlayEventListener) {
OverlayService.off('overlay-click', this.overlayEventListener);
this.overlayEventListener = null;
}
ZIndexUtils.clear(this.overlayRef.current);
}
}, {
key: "renderCloseIcon",
value: function renderCloseIcon() {
if (this.props.showCloseIcon) {
return /*#__PURE__*/React__default["default"].createElement("button", {
type: "button",
className: "p-overlaypanel-close p-link",
onClick: this.onCloseClick,
"aria-label": this.props.ariaCloseLabel
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-overlaypanel-close-icon pi pi-times"
}), /*#__PURE__*/React__default["default"].createElement(Ripple, null));
}
return null;
}
}, {
key: "renderElement",
value: function renderElement() {
var className = classNames('p-overlaypanel p-component', this.props.className);
var closeIcon = this.renderCloseIcon();
return /*#__PURE__*/React__default["default"].createElement(CSSTransition, {
nodeRef: this.overlayRef,
classNames: "p-overlaypanel",
"in": this.state.visible,
timeout: {
enter: 120,
exit: 100
},
options: this.props.transitionOptions,
unmountOnExit: true,
onEnter: this.onEnter,
onEntered: this.onEntered,
onExit: this.onExit,
onExited: this.onExited
}, /*#__PURE__*/React__default["default"].createElement("div", {
ref: this.overlayRef,
id: this.props.id,
className: className,
style: this.props.style,
onClick: this.onPanelClick
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-overlaypanel-content",
onClick: this.onContentClick,
onMouseDown: this.onContentClick
}, this.props.children), closeIcon));
}
}, {
key: "render",
value: function render() {
var element = this.renderElement();
return /*#__PURE__*/React__default["default"].createElement(Portal, {
element: element,
appendTo: this.props.appendTo
});
}
}]);
return OverlayPanel;
}(React.Component);
_defineProperty(OverlayPanel, "defaultProps", {
id: null,
dismissable: true,
showCloseIcon: false,
style: null,
className: null,
appendTo: null,
breakpoints: null,
ariaCloseLabel: 'close',
transitionOptions: null,
onShow: null,
onHide: null
});
function ownKeys$h(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$h(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$h(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$h(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createSuper$Q(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$Q(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$Q() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var Panel = /*#__PURE__*/function (_Component) {
_inherits(Panel, _Component);
var _super = _createSuper$Q(Panel);
function Panel(props) {
var _this;
_classCallCheck(this, Panel);
_this = _super.call(this, props);
var state = {
id: _this.props.id
};
if (!_this.props.onToggle) {
state = _objectSpread$h(_objectSpread$h({}, state), {}, {
collapsed: _this.props.collapsed
});
}
_this.state = state;
_this.toggle = _this.toggle.bind(_assertThisInitialized(_this));
_this.contentRef = /*#__PURE__*/React__default["default"].createRef();
return _this;
}
_createClass(Panel, [{
key: "toggle",
value: function toggle(event) {
if (this.props.toggleable) {
var collapsed = this.props.onToggle ? this.props.collapsed : this.state.collapsed;
if (collapsed) this.expand(event);else this.collapse(event);
if (this.props.onToggle) {
this.props.onToggle({
originalEvent: event,
value: !collapsed
});
}
}
event.preventDefault();
}
}, {
key: "expand",
value: function expand(event) {
if (!this.props.onToggle) {
this.setState({
collapsed: false
});
}
if (this.props.onExpand) {
this.props.onExpand(event);
}
}
}, {
key: "collapse",
value: function collapse(event) {
if (!this.props.onToggle) {
this.setState({
collapsed: true
});
}
if (this.props.onCollapse) {
this.props.onCollapse(event);
}
}
}, {
key: "isCollapsed",
value: function isCollapsed() {
return this.props.toggleable ? this.props.onToggle ? this.props.collapsed : this.state.collapsed : false;
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
if (!this.state.id) {
this.setState({
id: UniqueComponentId()
});
}
}
}, {
key: "renderToggleIcon",
value: function renderToggleIcon(collapsed) {
if (this.props.toggleable) {
var id = this.state.id + '_label';
var ariaControls = this.state.id + '_content';
var toggleIcon = collapsed ? this.props.expandIcon : this.props.collapseIcon;
return /*#__PURE__*/React__default["default"].createElement("button", {
className: "p-panel-header-icon p-panel-toggler p-link",
onClick: this.toggle,
id: id,
"aria-controls": ariaControls,
"aria-expanded": !collapsed,
role: "tab"
}, IconUtils.getJSXIcon(toggleIcon, {
props: this.props,
collapsed: collapsed
}), /*#__PURE__*/React__default["default"].createElement(Ripple, null));
}
return null;
}
}, {
key: "renderHeader",
value: function renderHeader(collapsed) {
var header = ObjectUtils.getJSXElement(this.props.header, this.props);
var icons = ObjectUtils.getJSXElement(this.props.icons, this.props);
var togglerElement = this.renderToggleIcon(collapsed);
var titleElement = /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-panel-title",
id: this.state.id + '_header'
}, header);
var iconsElement = /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-panel-icons"
}, icons, togglerElement);
var content = /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-panel-header"
}, titleElement, iconsElement);
if (this.props.headerTemplate) {
var defaultContentOptions = {
className: 'p-panel-header',
titleClassName: 'p-panel-title',
iconsClassName: 'p-panel-icons',
togglerClassName: 'p-panel-header-icon p-panel-toggler p-link',
togglerIconClassName: collapsed ? this.props.expandIcon : this.props.collapseIcon,
onTogglerClick: this.toggle,
titleElement: titleElement,
iconsElement: iconsElement,
togglerElement: togglerElement,
element: content,
props: this.props,
collapsed: collapsed
};
return ObjectUtils.getJSXElement(this.props.headerTemplate, defaultContentOptions);
} else if (this.props.header || this.props.toggleable) {
return content;
}
return null;
}
}, {
key: "renderContent",
value: function renderContent(collapsed) {
var id = this.state.id + '_content';
return /*#__PURE__*/React__default["default"].createElement(CSSTransition, {
nodeRef: this.contentRef,
classNames: "p-toggleable-content",
timeout: {
enter: 1000,
exit: 450
},
"in": !collapsed,
unmountOnExit: true,
options: this.props.transitionOptions
}, /*#__PURE__*/React__default["default"].createElement("div", {
ref: this.contentRef,
className: "p-toggleable-content",
"aria-hidden": collapsed,
role: "region",
id: id,
"aria-labelledby": this.state.id + '_header'
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-panel-content"
}, this.props.children)));
}
}, {
key: "render",
value: function render() {
var className = classNames('p-panel p-component', {
'p-panel-toggleable': this.props.toggleable
}, this.props.className);
var collapsed = this.isCollapsed();
var header = this.renderHeader(collapsed);
var content = this.renderContent(collapsed);
return /*#__PURE__*/React__default["default"].createElement("div", {
id: this.props.id,
className: className,
style: this.props.style
}, header, content);
}
}]);
return Panel;
}(React.Component);
_defineProperty(Panel, "defaultProps", {
id: null,
header: null,
headerTemplate: null,
toggleable: null,
style: null,
className: null,
collapsed: null,
expandIcon: 'pi pi-plus',
collapseIcon: 'pi pi-minus',
icons: null,
transitionOptions: null,
onExpand: null,
onCollapse: null,
onToggle: null
});
function _createSuper$P(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$P(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$P() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var PanelMenuSub = /*#__PURE__*/function (_Component) {
_inherits(PanelMenuSub, _Component);
var _super = _createSuper$P(PanelMenuSub);
function PanelMenuSub(props) {
var _this;
_classCallCheck(this, PanelMenuSub);
_this = _super.call(this, props);
_this.state = {
activeItem: _this.findActiveItem()
};
return _this;
}
_createClass(PanelMenuSub, [{
key: "onItemClick",
value: function onItemClick(event, item) {
if (item.disabled) {
event.preventDefault();
return;
}
if (!item.url) {
event.preventDefault();
}
if (item.command) {
item.command({
originalEvent: event,
item: item
});
}
var activeItem = this.state.activeItem;
var active = this.isItemActive(item);
if (active) {
item.expanded = false;
this.setState({
activeItem: this.props.multiple ? activeItem.filter(function (a_item) {
return a_item !== item;
}) : null
});
} else {
if (!this.props.multiple && activeItem) {
activeItem.expanded = false;
}
item.expanded = true;
this.setState({
activeItem: this.props.multiple ? [].concat(_toConsumableArray(activeItem || []), [item]) : item
});
}
}
}, {
key: "findActiveItem",
value: function findActiveItem() {
if (this.props.model) {
if (this.props.multiple) {
return this.props.model.filter(function (item) {
return item.expanded;
});
} else {
var activeItem = null;
this.props.model.forEach(function (item) {
if (item.expanded) {
if (!activeItem) activeItem = item;else item.expanded = false;
}
});
return activeItem;
}
}
return null;
}
}, {
key: "isItemActive",
value: function isItemActive(item) {
return this.state.activeItem && (this.props.multiple ? this.state.activeItem.indexOf(item) > -1 : this.state.activeItem === item);
}
}, {
key: "renderSeparator",
value: function renderSeparator(index) {
return /*#__PURE__*/React__default["default"].createElement("li", {
key: 'separator_' + index,
className: "p-menu-separator"
});
}
}, {
key: "renderSubmenu",
value: function renderSubmenu(item, active) {
var submenuWrapperClassName = classNames('p-toggleable-content', {
'p-toggleable-content-collapsed': !active
});
var submenuContentRef = /*#__PURE__*/React__default["default"].createRef();
if (item.items) {
return /*#__PURE__*/React__default["default"].createElement(CSSTransition, {
nodeRef: submenuContentRef,
classNames: "p-toggleable-content",
timeout: {
enter: 1000,
exit: 450
},
"in": active,
unmountOnExit: true
}, /*#__PURE__*/React__default["default"].createElement("div", {
ref: submenuContentRef,
className: submenuWrapperClassName
}, /*#__PURE__*/React__default["default"].createElement(PanelMenuSub, {
model: item.items,
multiple: this.props.multiple
})));
}
return null;
}
}, {
key: "renderMenuitem",
value: function renderMenuitem(item, index) {
var _this2 = this;
var active = this.isItemActive(item);
var className = classNames('p-menuitem', item.className);
var linkClassName = classNames('p-menuitem-link', {
'p-disabled': item.disabled
});
var iconClassName = classNames('p-menuitem-icon', item.icon);
var submenuIconClassName = classNames('p-panelmenu-icon pi pi-fw', {
'pi-angle-right': !active,
'pi-angle-down': active
});
var icon = item.icon && /*#__PURE__*/React__default["default"].createElement("span", {
className: iconClassName
});
var label = item.label && /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-menuitem-text"
}, item.label);
var submenuIcon = item.items && /*#__PURE__*/React__default["default"].createElement("span", {
className: submenuIconClassName
});
var submenu = this.renderSubmenu(item, active);
var content = /*#__PURE__*/React__default["default"].createElement("a", {
href: item.url || '#',
className: linkClassName,
target: item.target,
onClick: function onClick(event) {
return _this2.onItemClick(event, item, index);
},
role: "menuitem",
"aria-disabled": item.disabled
}, submenuIcon, icon, label);
if (item.template) {
var defaultContentOptions = {
onClick: function onClick(event) {
return _this2.onItemClick(event, item, index);
},
className: linkClassName,
labelClassName: 'p-menuitem-text',
iconClassName: iconClassName,
submenuIconClassName: submenuIconClassName,
element: content,
props: this.props,
leaf: !item.items,
active: active
};
content = ObjectUtils.getJSXElement(item.template, item, defaultContentOptions);
}
return /*#__PURE__*/React__default["default"].createElement("li", {
key: item.label + '_' + index,
className: className,
style: item.style,
role: "none"
}, content, submenu);
}
}, {
key: "renderItem",
value: function renderItem(item, index) {
if (item.separator) return this.renderSeparator(index);else return this.renderMenuitem(item, index);
}
}, {
key: "renderMenu",
value: function renderMenu() {
var _this3 = this;
if (this.props.model) {
return this.props.model.map(function (item, index) {
return _this3.renderItem(item, index);
});
}
return null;
}
}, {
key: "render",
value: function render() {
var className = classNames('p-submenu-list', this.props.className);
var menu = this.renderMenu();
return /*#__PURE__*/React__default["default"].createElement("ul", {
className: className,
role: "tree"
}, menu);
}
}]);
return PanelMenuSub;
}(React.Component);
_defineProperty(PanelMenuSub, "defaultProps", {
model: null,
multiple: false
});
var PanelMenu = /*#__PURE__*/function (_Component2) {
_inherits(PanelMenu, _Component2);
var _super2 = _createSuper$P(PanelMenu);
function PanelMenu(props) {
var _this4;
_classCallCheck(this, PanelMenu);
_this4 = _super2.call(this, props);
_this4.state = {
id: props.id,
activeItem: _this4.findActiveItem()
};
return _this4;
}
_createClass(PanelMenu, [{
key: "onItemClick",
value: function onItemClick(event, item) {
if (item.disabled) {
event.preventDefault();
return;
}
if (!item.url) {
event.preventDefault();
}
if (item.command) {
item.command({
originalEvent: event,
item: item
});
}
var activeItem = this.state.activeItem;
var active = this.isItemActive(item);
if (active) {
item.expanded = false;
this.setState({
activeItem: this.props.multiple ? activeItem.filter(function (a_item) {
return a_item !== item;
}) : null
});
} else {
if (!this.props.multiple && activeItem) {
activeItem.expanded = false;
}
item.expanded = true;
this.setState({
activeItem: this.props.multiple ? [].concat(_toConsumableArray(activeItem || []), [item]) : item
});
}
}
}, {
key: "findActiveItem",
value: function findActiveItem() {
if (this.props.model) {
if (this.props.multiple) {
return this.props.model.filter(function (item) {
return item.expanded;
});
} else {
var activeItem = null;
this.props.model.forEach(function (item) {
if (item.expanded) {
if (!activeItem) activeItem = item;else item.expanded = false;
}
});
return activeItem;
}
}
return null;
}
}, {
key: "isItemActive",
value: function isItemActive(item) {
return this.state.activeItem && (this.props.multiple ? this.state.activeItem.indexOf(item) > -1 : this.state.activeItem === item);
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
if (!this.state.id) {
this.setState({
id: UniqueComponentId()
});
}
}
}, {
key: "renderPanel",
value: function renderPanel(item, index) {
var _this5 = this;
var active = this.isItemActive(item);
var className = classNames('p-panelmenu-panel', item.className);
var headerClassName = classNames('p-component p-panelmenu-header', {
'p-highlight': active,
'p-disabled': item.disabled
});
var submenuIconClassName = classNames('p-panelmenu-icon pi', {
'pi-chevron-right': !active,
' pi-chevron-down': active
});
var iconClassName = classNames('p-menuitem-icon', item.icon);
var submenuIcon = item.items && /*#__PURE__*/React__default["default"].createElement("span", {
className: submenuIconClassName
});
var itemIcon = item.icon && /*#__PURE__*/React__default["default"].createElement("span", {
className: iconClassName
});
var label = item.label && /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-menuitem-text"
}, item.label);
var contentWrapperClassName = classNames('p-toggleable-content', {
'p-toggleable-content-collapsed': !active
});
var menuContentRef = /*#__PURE__*/React__default["default"].createRef();
var content = /*#__PURE__*/React__default["default"].createElement("a", {
href: item.url || '#',
className: "p-panelmenu-header-link",
onClick: function onClick(e) {
return _this5.onItemClick(e, item);
},
"aria-expanded": active,
id: this.state.id + '_header',
"aria-controls": this.state.id + 'content',
"aria-disabled": item.disabled
}, submenuIcon, itemIcon, label);
if (item.template) {
var defaultContentOptions = {
onClick: function onClick(event) {
return _this5.onItemClick(event, item);
},
className: 'p-panelmenu-header-link',
labelClassName: 'p-menuitem-text',
submenuIconClassName: submenuIconClassName,
iconClassName: iconClassName,
element: content,
props: this.props,
leaf: !item.items,
active: active
};
content = ObjectUtils.getJSXElement(item.template, item, defaultContentOptions);
}
return /*#__PURE__*/React__default["default"].createElement("div", {
key: item.label + '_' + index,
className: className,
style: item.style
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: headerClassName,
style: item.style
}, content), /*#__PURE__*/React__default["default"].createElement(CSSTransition, {
nodeRef: menuContentRef,
classNames: "p-toggleable-content",
timeout: {
enter: 1000,
exit: 450
},
"in": active,
unmountOnExit: true,
options: this.props.transitionOptions
}, /*#__PURE__*/React__default["default"].createElement("div", {
ref: menuContentRef,
className: contentWrapperClassName,
role: "region",
id: this.state.id + '_content',
"aria-labelledby": this.state.id + '_header'
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-panelmenu-content"
}, /*#__PURE__*/React__default["default"].createElement(PanelMenuSub, {
model: item.items,
className: "p-panelmenu-root-submenu",
multiple: this.props.multiple
})))));
}
}, {
key: "renderPanels",
value: function renderPanels() {
var _this6 = this;
if (this.props.model) {
return this.props.model.map(function (item, index) {
return _this6.renderPanel(item, index);
});
}
return null;
}
}, {
key: "render",
value: function render() {
var className = classNames('p-panelmenu p-component', this.props.className);
var panels = this.renderPanels();
return /*#__PURE__*/React__default["default"].createElement("div", {
id: this.props.id,
className: className,
style: this.props.style
}, panels);
}
}]);
return PanelMenu;
}(React.Component);
_defineProperty(PanelMenu, "defaultProps", {
id: null,
model: null,
style: null,
className: null,
multiple: false,
transitionOptions: null
});
function ownKeys$g(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$g(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$g(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$g(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createSuper$O(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$O(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$O() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var Password = /*#__PURE__*/function (_Component) {
_inherits(Password, _Component);
var _super = _createSuper$O(Password);
function Password(props) {
var _this;
_classCallCheck(this, Password);
_this = _super.call(this, props);
_this.state = {
overlayVisible: false,
meter: null,
infoText: _this.promptLabel(),
focused: false,
unmasked: false
};
_this.onFocus = _this.onFocus.bind(_assertThisInitialized(_this));
_this.onBlur = _this.onBlur.bind(_assertThisInitialized(_this));
_this.onKeyup = _this.onKeyup.bind(_assertThisInitialized(_this));
_this.onInput = _this.onInput.bind(_assertThisInitialized(_this));
_this.onMaskToggle = _this.onMaskToggle.bind(_assertThisInitialized(_this));
_this.onOverlayEnter = _this.onOverlayEnter.bind(_assertThisInitialized(_this));
_this.onOverlayEntered = _this.onOverlayEntered.bind(_assertThisInitialized(_this));
_this.onOverlayExit = _this.onOverlayExit.bind(_assertThisInitialized(_this));
_this.onOverlayExited = _this.onOverlayExited.bind(_assertThisInitialized(_this));
_this.onPanelClick = _this.onPanelClick.bind(_assertThisInitialized(_this));
_this.overlayRef = /*#__PURE__*/React.createRef();
_this.inputRef = /*#__PURE__*/React.createRef(_this.props.inputRef);
_this.mediumCheckRegExp = new RegExp(_this.props.mediumRegex);
_this.strongCheckRegExp = new RegExp(_this.props.strongRegex);
return _this;
}
_createClass(Password, [{
key: "promptLabel",
value: function promptLabel() {
return this.props.promptLabel || localeOption('passwordPrompt');
}
}, {
key: "weakLabel",
value: function weakLabel() {
return this.props.weakLabel || localeOption('weak');
}
}, {
key: "mediumLabel",
value: function mediumLabel() {
return this.props.mediumLabel || localeOption('medium');
}
}, {
key: "strongLabel",
value: function strongLabel() {
return this.props.strongLabel || localeOption('strong');
}
}, {
key: "isFilled",
value: function isFilled() {
return this.props.value != null && this.props.value.toString().length > 0 || this.props.defaultValue != null && this.props.defaultValue.toString().length > 0 || this.inputRef && this.inputRef.current && DomHandler.hasClass(this.inputRef.current, 'p-filled');
}
}, {
key: "getInputType",
value: function getInputType() {
return this.state.unmasked ? 'text' : 'password';
}
}, {
key: "updateLabels",
value: function updateLabels() {
if (this.state.meter) {
var label = null;
switch (this.state.meter.strength) {
case 'weak':
label = this.weakLabel();
break;
case 'medium':
label = this.mediumLabel();
break;
case 'strong':
label = this.strongLabel();
break;
}
if (label && this.state.infoText !== label) {
this.setState({
infoText: label
});
}
} else {
var promptLabel = this.promptLabel();
if (this.state.infoText !== promptLabel) {
this.setState({
infoText: promptLabel
});
}
}
}
}, {
key: "onPanelClick",
value: function onPanelClick(event) {
if (this.props.feedback) {
OverlayService.emit('overlay-click', {
originalEvent: event,
target: this.container
});
}
}
}, {
key: "onMaskToggle",
value: function onMaskToggle() {
this.setState(function (prevState) {
return {
unmasked: !prevState.unmasked
};
});
}
}, {
key: "showOverlay",
value: function showOverlay() {
this.updateLabels();
this.setState({
overlayVisible: true
});
}
}, {
key: "hideOverlay",
value: function hideOverlay() {
this.setState({
overlayVisible: false
});
}
}, {
key: "alignOverlay",
value: function alignOverlay() {
if (this.inputRef && this.inputRef.current) {
DomHandler.alignOverlay(this.overlayRef.current, this.inputRef.current.parentElement, this.props.appendTo || PrimeReact.appendTo);
}
}
}, {
key: "onOverlayEnter",
value: function onOverlayEnter() {
ZIndexUtils.set('overlay', this.overlayRef.current, PrimeReact.autoZIndex, PrimeReact.zIndex['overlay']);
this.alignOverlay();
}
}, {
key: "onOverlayEntered",
value: function onOverlayEntered() {
this.bindScrollListener();
this.bindResizeListener();
this.props.onShow && this.props.onShow();
}
}, {
key: "onOverlayExit",
value: function onOverlayExit() {
this.unbindScrollListener();
this.unbindResizeListener();
}
}, {
key: "onOverlayExited",
value: function onOverlayExited() {
ZIndexUtils.clear(this.overlayRef.current);
this.props.onHide && this.props.onHide();
}
}, {
key: "onFocus",
value: function onFocus(event) {
var _this2 = this;
event.persist();
this.setState({
focused: true
}, function () {
if (_this2.props.feedback) {
_this2.showOverlay();
}
if (_this2.props.onFocus) {
_this2.props.onFocus(event);
}
});
}
}, {
key: "onBlur",
value: function onBlur(event) {
var _this3 = this;
event.persist();
this.setState({
focused: false
}, function () {
if (_this3.props.feedback) {
_this3.hideOverlay();
}
if (_this3.props.onBlur) {
_this3.props.onBlur(event);
}
});
}
}, {
key: "onKeyup",
value: function onKeyup(e) {
var _this4 = this;
var keyCode = e.keyCode || e.which;
if (this.props.feedback) {
var value = e.target.value;
var label = null;
var meter = null;
switch (this.testStrength(value)) {
case 1:
label = this.weakLabel();
meter = {
strength: 'weak',
width: '33.33%'
};
break;
case 2:
label = this.mediumLabel();
meter = {
strength: 'medium',
width: '66.66%'
};
break;
case 3:
label = this.strongLabel();
meter = {
strength: 'strong',
width: '100%'
};
break;
default:
label = this.promptLabel();
meter = null;
break;
}
this.setState({
meter: meter,
infoText: label
}, function () {
if (!!keyCode && !_this4.state.overlayVisible) {
_this4.showOverlay();
}
});
}
if (this.props.onKeyUp) {
this.props.onKeyUp(e);
}
}
}, {
key: "onInput",
value: function onInput(event, validatePattern) {
if (this.props.onInput) {
this.props.onInput(event, validatePattern);
}
if (!this.props.onChange) {
if (event.target.value.length > 0) DomHandler.addClass(this.container, 'p-inputwrapper-filled');else DomHandler.removeClass(this.container, 'p-inputwrapper-filled');
}
}
}, {
key: "testStrength",
value: function testStrength(str) {
var level = 0;
if (this.strongCheckRegExp.test(str)) level = 3;else if (this.mediumCheckRegExp.test(str)) level = 2;else if (str.length) level = 1;
return level;
}
}, {
key: "bindScrollListener",
value: function bindScrollListener() {
var _this5 = this;
if (!this.scrollHandler) {
this.scrollHandler = new ConnectedOverlayScrollHandler(this.inputEl, function () {
if (_this5.state.overlayVisible) {
_this5.hideOverlay();
}
});
}
this.scrollHandler.bindScrollListener();
}
}, {
key: "unbindScrollListener",
value: function unbindScrollListener() {
if (this.scrollHandler) {
this.scrollHandler.unbindScrollListener();
}
}
}, {
key: "bindResizeListener",
value: function bindResizeListener() {
var _this6 = this;
if (!this.resizeListener) {
this.resizeListener = function () {
if (_this6.state.overlayVisible && !DomHandler.isTouchDevice()) {
_this6.hideOverlay();
}
};
window.addEventListener('resize', this.resizeListener);
}
}
}, {
key: "unbindResizeListener",
value: function unbindResizeListener() {
if (this.resizeListener) {
window.removeEventListener('resize', this.resizeListener);
this.resizeListener = null;
}
}
}, {
key: "updateInputRef",
value: function updateInputRef() {
var ref = this.props.inputRef;
if (ref) {
if (typeof ref === 'function') {
ref(this.inputRef.current);
} else {
ref.current = this.inputRef.current;
}
}
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
this.updateInputRef();
if (this.props.tooltip) {
this.renderTooltip();
}
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps) {
if (prevProps.tooltip !== this.props.tooltip || prevProps.tooltipOptions !== this.props.tooltipOptions) {
if (this.tooltip) this.tooltip.update(_objectSpread$g({
content: this.props.tooltip
}, this.props.tooltipOptions || {}));else this.renderTooltip();
}
if (prevProps.mediumRegex !== this.props.mediumRegex) {
this.mediumCheckRegExp = new RegExp(this.props.mediumRegex);
}
if (prevProps.strongRegex !== this.props.strongRegex) {
this.strongCheckRegExp = new RegExp(this.props.strongRegex);
}
if (!this.isFilled() && DomHandler.hasClass(this.container, 'p-inputwrapper-filled')) {
DomHandler.removeClass(this.container, 'p-inputwrapper-filled');
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
this.unbindResizeListener();
if (this.scrollHandler) {
this.scrollHandler.destroy();
this.scrollHandler = null;
}
if (this.tooltip) {
this.tooltip.destroy();
this.tooltip = null;
}
ZIndexUtils.clear(this.overlayRef.current);
}
}, {
key: "renderTooltip",
value: function renderTooltip() {
this.tooltip = tip({
target: this.inputEl,
content: this.props.tooltip,
options: this.props.tooltipOptions
});
}
}, {
key: "renderIcon",
value: function renderIcon() {
if (this.props.toggleMask) {
var iconClassName = this.state.unmasked ? 'pi pi-eye-slash' : 'pi pi-eye';
var content = /*#__PURE__*/React__default["default"].createElement("i", {
className: iconClassName,
onClick: this.onMaskToggle
});
if (this.props.icon) {
var defaultIconOptions = {
onClick: this.onMaskToggle,
className: iconClassName,
element: content,
props: this.props
};
content = ObjectUtils.getJSXElement(this.props.icon, defaultIconOptions);
}
return content;
}
return null;
}
}, {
key: "renderPanel",
value: function renderPanel() {
var panelClassName = classNames('p-password-panel p-component', this.props.panelClassName);
var _ref = this.state.meter || {
strength: '',
width: '0%'
},
strength = _ref.strength,
width = _ref.width;
var header = ObjectUtils.getJSXElement(this.props.header, this.props);
var footer = ObjectUtils.getJSXElement(this.props.footer, this.props);
var content = this.props.content ? ObjectUtils.getJSXElement(this.props.content, this.props) : /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-password-meter"
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-password-strength ".concat(strength),
style: {
width: width
}
})), /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-password-info"
}, this.state.infoText));
var panel = /*#__PURE__*/React__default["default"].createElement(CSSTransition, {
nodeRef: this.overlayRef,
classNames: "p-connected-overlay",
"in": this.state.overlayVisible,
timeout: {
enter: 120,
exit: 100
},
options: this.props.transitionOptions,
unmountOnExit: true,
onEnter: this.onOverlayEnter,
onEntered: this.onOverlayEntered,
onExit: this.onOverlayExit,
onExited: this.onOverlayExited
}, /*#__PURE__*/React__default["default"].createElement("div", {
ref: this.overlayRef,
className: panelClassName,
style: this.props.panelStyle,
onClick: this.onPanelClick
}, header, content, footer));
return /*#__PURE__*/React__default["default"].createElement(Portal, {
element: panel,
appendTo: this.props.appendTo
});
}
}, {
key: "render",
value: function render() {
var _this7 = this;
var containerClassName = classNames('p-password p-component p-inputwrapper', {
'p-inputwrapper-filled': this.isFilled(),
'p-inputwrapper-focus': this.state.focused,
'p-input-icon-right': this.props.toggleMask
}, this.props.className);
var inputClassName = classNames('p-password-input', this.props.inputClassName);
var type = this.getInputType();
var inputProps = ObjectUtils.findDiffKeys(this.props, Password.defaultProps);
var icon = this.renderIcon();
var panel = this.renderPanel();
return /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this7.container = el;
},
id: this.props.id,
className: containerClassName,
style: this.props.style
}, /*#__PURE__*/React__default["default"].createElement(InputText, _extends({
ref: this.inputRef,
id: this.props.inputId
}, inputProps, {
type: type,
className: inputClassName,
style: this.props.inputStyle,
onFocus: this.onFocus,
onBlur: this.onBlur,
onKeyUp: this.onKeyup,
onInput: this.onInput
})), icon, panel);
}
}]);
return Password;
}(React.Component);
_defineProperty(Password, "defaultProps", {
id: null,
inputId: null,
inputRef: null,
promptLabel: null,
weakLabel: null,
mediumLabel: null,
strongLabel: null,
mediumRegex: '^(((?=.*[a-z])(?=.*[A-Z]))|((?=.*[a-z])(?=.*[0-9]))|((?=.*[A-Z])(?=.*[0-9])))(?=.{6,})',
strongRegex: '^(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])(?=.{8,})',
feedback: true,
toggleMask: false,
appendTo: null,
header: null,
content: null,
footer: null,
icon: null,
tooltip: null,
tooltipOptions: null,
style: null,
className: null,
inputStyle: null,
inputClassName: null,
panelStyle: null,
panelClassName: null,
transitionOptions: null,
onInput: null,
onShow: null,
onHide: null
});
function _createSuper$N(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$N(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$N() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var PickListItem = /*#__PURE__*/function (_Component) {
_inherits(PickListItem, _Component);
var _super = _createSuper$N(PickListItem);
function PickListItem(props) {
var _this;
_classCallCheck(this, PickListItem);
_this = _super.call(this, props);
_this.onClick = _this.onClick.bind(_assertThisInitialized(_this));
_this.onKeyDown = _this.onKeyDown.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(PickListItem, [{
key: "onClick",
value: function onClick(event) {
if (this.props.onClick) {
this.props.onClick({
originalEvent: event,
value: this.props.value
});
}
}
}, {
key: "onKeyDown",
value: function onKeyDown(event) {
if (this.props.onKeyDown) {
this.props.onKeyDown({
originalEvent: event,
value: this.props.value
});
}
}
}, {
key: "render",
value: function render() {
var content = this.props.template ? this.props.template(this.props.value) : this.props.value;
var className = classNames('p-picklist-item', {
'p-highlight': this.props.selected
}, this.props.className);
return /*#__PURE__*/React__default["default"].createElement("li", {
className: className,
onClick: this.onClick,
onKeyDown: this.onKeyDown,
tabIndex: this.props.tabIndex,
role: "option",
"aria-selected": this.props.selected
}, content, /*#__PURE__*/React__default["default"].createElement(Ripple, null));
}
}]);
return PickListItem;
}(React.Component);
_defineProperty(PickListItem, "defaultProps", {
value: null,
className: null,
template: null,
selected: false,
tabIndex: null,
onClick: null,
onKeyDown: null
});
function _createSuper$M(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$M(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$M() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var PickListSubListComponent = /*#__PURE__*/function (_Component) {
_inherits(PickListSubListComponent, _Component);
var _super = _createSuper$M(PickListSubListComponent);
function PickListSubListComponent(props) {
var _this;
_classCallCheck(this, PickListSubListComponent);
_this = _super.call(this, props);
_this.onItemClick = _this.onItemClick.bind(_assertThisInitialized(_this));
_this.onItemKeyDown = _this.onItemKeyDown.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(PickListSubListComponent, [{
key: "onItemClick",
value: function onItemClick(event) {
var originalEvent = event.originalEvent;
var item = event.value;
var selection = _toConsumableArray(this.props.selection);
var index = ObjectUtils.findIndexInList(item, selection, this.props.dataKey);
var selected = index !== -1;
var metaSelection = this.props.metaKeySelection;
if (metaSelection) {
var metaKey = originalEvent.metaKey || originalEvent.ctrlKey;
if (selected && metaKey) {
selection.splice(index, 1);
} else {
if (!metaKey) {
selection.length = 0;
}
selection.push(item);
}
} else {
if (selected) selection.splice(index, 1);else selection.push(item);
}
if (this.props.onSelectionChange) {
this.props.onSelectionChange({
event: originalEvent,
value: selection
});
}
}
}, {
key: "onItemKeyDown",
value: function onItemKeyDown(event) {
var listItem = event.originalEvent.currentTarget;
switch (event.originalEvent.which) {
//down
case 40:
var nextItem = this.findNextItem(listItem);
if (nextItem) {
nextItem.focus();
}
event.originalEvent.preventDefault();
break;
//up
case 38:
var prevItem = this.findPrevItem(listItem);
if (prevItem) {
prevItem.focus();
}
event.originalEvent.preventDefault();
break;
//enter
case 13:
this.onItemClick(event);
event.originalEvent.preventDefault();
break;
}
}
}, {
key: "findNextItem",
value: function findNextItem(item) {
var nextItem = item.nextElementSibling;
if (nextItem) return !DomHandler.hasClass(nextItem, 'p-picklist-item') ? this.findNextItem(nextItem) : nextItem;else return null;
}
}, {
key: "findPrevItem",
value: function findPrevItem(item) {
var prevItem = item.previousElementSibling;
if (prevItem) return !DomHandler.hasClass(prevItem, 'p-picklist-item') ? this.findPrevItem(prevItem) : prevItem;else return null;
}
}, {
key: "isSelected",
value: function isSelected(item) {
return ObjectUtils.findIndexInList(item, this.props.selection, this.props.dataKey) !== -1;
}
}, {
key: "render",
value: function render() {
var _this2 = this;
var header = null;
var items = null;
var wrapperClassName = classNames('p-picklist-list-wrapper', this.props.className);
var listClassName = classNames('p-picklist-list', this.props.listClassName);
if (this.props.header) {
header = /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-picklist-header"
}, ObjectUtils.getJSXElement(this.props.header, this.props));
}
if (this.props.list) {
items = this.props.list.map(function (item, i) {
return /*#__PURE__*/React__default["default"].createElement(PickListItem, {
key: JSON.stringify(item),
value: item,
template: _this2.props.itemTemplate,
selected: _this2.isSelected(item),
onClick: _this2.onItemClick,
onKeyDown: _this2.onItemKeyDown,
tabIndex: _this2.props.tabIndex
});
});
}
return /*#__PURE__*/React__default["default"].createElement("div", {
ref: this.props.forwardRef,
className: wrapperClassName
}, header, /*#__PURE__*/React__default["default"].createElement("ul", {
className: listClassName,
style: this.props.style,
role: "listbox",
"aria-multiselectable": true
}, items));
}
}]);
return PickListSubListComponent;
}(React.Component);
var PickListSubList = /*#__PURE__*/React__default["default"].forwardRef(function (props, ref) {
return /*#__PURE__*/React__default["default"].createElement(PickListSubListComponent, _extends({
forwardRef: ref
}, props));
});
function _createSuper$L(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$L(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$L() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var PickListControls = /*#__PURE__*/function (_Component) {
_inherits(PickListControls, _Component);
var _super = _createSuper$L(PickListControls);
function PickListControls(props) {
var _this;
_classCallCheck(this, PickListControls);
_this = _super.call(this, props);
_this.moveUp = _this.moveUp.bind(_assertThisInitialized(_this));
_this.moveTop = _this.moveTop.bind(_assertThisInitialized(_this));
_this.moveDown = _this.moveDown.bind(_assertThisInitialized(_this));
_this.moveBottom = _this.moveBottom.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(PickListControls, [{
key: "moveUp",
value: function moveUp(event) {
var selectedItems = this.props.selection;
if (selectedItems && selectedItems.length) {
var list = _toConsumableArray(this.props.list);
for (var i = 0; i < selectedItems.length; i++) {
var selectedItem = selectedItems[i];
var selectedItemIndex = ObjectUtils.findIndexInList(selectedItem, list, this.props.dataKey);
if (selectedItemIndex !== 0) {
var movedItem = list[selectedItemIndex];
var temp = list[selectedItemIndex - 1];
list[selectedItemIndex - 1] = movedItem;
list[selectedItemIndex] = temp;
} else {
break;
}
}
if (this.props.onReorder) {
this.props.onReorder({
originalEvent: event,
value: list,
direction: 'up'
});
}
}
}
}, {
key: "moveTop",
value: function moveTop(event) {
var selectedItems = this.props.selection;
if (selectedItems && selectedItems.length) {
var list = _toConsumableArray(this.props.list);
for (var i = 0; i < selectedItems.length; i++) {
var selectedItem = selectedItems[i];
var selectedItemIndex = ObjectUtils.findIndexInList(selectedItem, list, this.props.dataKey);
if (selectedItemIndex !== 0) {
var movedItem = list.splice(selectedItemIndex, 1)[0];
list.unshift(movedItem);
} else {
break;
}
}
if (this.props.onReorder) {
this.props.onReorder({
originalEvent: event,
value: list,
direction: 'top'
});
}
}
}
}, {
key: "moveDown",
value: function moveDown(event) {
var selectedItems = this.props.selection;
if (selectedItems && selectedItems.length) {
var list = _toConsumableArray(this.props.list);
for (var i = selectedItems.length - 1; i >= 0; i--) {
var selectedItem = selectedItems[i];
var selectedItemIndex = ObjectUtils.findIndexInList(selectedItem, list, this.props.dataKey);
if (selectedItemIndex !== list.length - 1) {
var movedItem = list[selectedItemIndex];
var temp = list[selectedItemIndex + 1];
list[selectedItemIndex + 1] = movedItem;
list[selectedItemIndex] = temp;
} else {
break;
}
}
if (this.props.onReorder) {
this.props.onReorder({
originalEvent: event,
value: list,
direction: 'down'
});
}
this.movedDown = true;
}
}
}, {
key: "moveBottom",
value: function moveBottom(event) {
var selectedItems = this.props.selection;
if (selectedItems && selectedItems.length) {
var list = _toConsumableArray(this.props.list);
for (var i = selectedItems.length - 1; i >= 0; i--) {
var selectedItem = selectedItems[i];
var selectedItemIndex = ObjectUtils.findIndexInList(selectedItem, list, this.props.dataKey);
if (selectedItemIndex !== list.length - 1) {
var movedItem = list.splice(selectedItemIndex, 1)[0];
list.push(movedItem);
} else {
break;
}
}
if (this.props.onReorder) {
this.props.onReorder({
originalEvent: event,
value: list,
direction: 'bottom'
});
}
}
}
}, {
key: "render",
value: function render() {
var moveDisabled = !this.props.selection.length;
var className = classNames('p-picklist-buttons', this.props.className);
return /*#__PURE__*/React__default["default"].createElement("div", {
className: className
}, /*#__PURE__*/React__default["default"].createElement(Button, {
disabled: moveDisabled,
type: "button",
icon: "pi pi-angle-up",
onClick: this.moveUp
}), /*#__PURE__*/React__default["default"].createElement(Button, {
disabled: moveDisabled,
type: "button",
icon: "pi pi-angle-double-up",
onClick: this.moveTop
}), /*#__PURE__*/React__default["default"].createElement(Button, {
disabled: moveDisabled,
type: "button",
icon: "pi pi-angle-down",
onClick: this.moveDown
}), /*#__PURE__*/React__default["default"].createElement(Button, {
disabled: moveDisabled,
type: "button",
icon: "pi pi-angle-double-down",
onClick: this.moveBottom
}));
}
}]);
return PickListControls;
}(React.Component);
function _createSuper$K(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$K(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$K() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var PickListTransferControls = /*#__PURE__*/function (_Component) {
_inherits(PickListTransferControls, _Component);
var _super = _createSuper$K(PickListTransferControls);
function PickListTransferControls(props) {
var _this;
_classCallCheck(this, PickListTransferControls);
_this = _super.call(this, props);
_this.moveRight = _this.moveRight.bind(_assertThisInitialized(_this));
_this.moveAllRight = _this.moveAllRight.bind(_assertThisInitialized(_this));
_this.moveLeft = _this.moveLeft.bind(_assertThisInitialized(_this));
_this.moveAllLeft = _this.moveAllLeft.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(PickListTransferControls, [{
key: "moveRight",
value: function moveRight(event) {
var selection = this.props.sourceSelection;
if (ObjectUtils.isNotEmpty(selection)) {
var targetList = _toConsumableArray(this.props.target);
var sourceList = _toConsumableArray(this.props.source);
for (var i = 0; i < selection.length; i++) {
var selectedItem = selection[i];
if (ObjectUtils.findIndexInList(selectedItem, targetList, this.props.dataKey) === -1) {
targetList.push(sourceList.splice(ObjectUtils.findIndexInList(selectedItem, sourceList, this.props.dataKey), 1)[0]);
}
}
if (this.props.onTransfer) {
this.props.onTransfer({
originalEvent: event,
source: sourceList,
target: targetList,
direction: 'toTarget'
});
}
}
}
}, {
key: "moveAllRight",
value: function moveAllRight(event) {
if (this.props.source) {
var targetList = [].concat(_toConsumableArray(this.props.target), _toConsumableArray(this.props.source));
var sourceList = [];
if (this.props.onTransfer) {
this.props.onTransfer({
originalEvent: event,
source: sourceList,
target: targetList,
direction: 'allToTarget'
});
}
}
}
}, {
key: "moveLeft",
value: function moveLeft(event) {
var selection = this.props.targetSelection;
if (ObjectUtils.isNotEmpty(selection)) {
var targetList = _toConsumableArray(this.props.target);
var sourceList = _toConsumableArray(this.props.source);
for (var i = 0; i < selection.length; i++) {
var selectedItem = selection[i];
if (ObjectUtils.findIndexInList(selectedItem, sourceList, this.props.dataKey) === -1) {
sourceList.push(targetList.splice(ObjectUtils.findIndexInList(selectedItem, targetList, this.props.dataKey), 1)[0]);
}
}
if (this.props.onTransfer) {
this.props.onTransfer({
originalEvent: event,
source: sourceList,
target: targetList,
direction: 'toSource'
});
}
}
}
}, {
key: "moveAllLeft",
value: function moveAllLeft(event) {
if (this.props.source) {
var sourceList = [].concat(_toConsumableArray(this.props.source), _toConsumableArray(this.props.target));
var targetList = [];
if (this.props.onTransfer) {
this.props.onTransfer({
originalEvent: event,
source: sourceList,
target: targetList,
direction: 'allToSource'
});
}
}
}
}, {
key: "render",
value: function render() {
var moveRightDisabled = ObjectUtils.isEmpty(this.props.sourceSelection);
var moveLeftDisabled = ObjectUtils.isEmpty(this.props.targetSelection);
var moveAllRightDisabled = ObjectUtils.isEmpty(this.props.source);
var moveAllLeftDisabled = ObjectUtils.isEmpty(this.props.target);
var className = classNames('p-picklist-buttons p-picklist-transfer-buttons', this.props.className);
return /*#__PURE__*/React__default["default"].createElement("div", {
className: className
}, /*#__PURE__*/React__default["default"].createElement(Button, {
disabled: moveRightDisabled,
type: "button",
icon: "pi pi-angle-right",
onClick: this.moveRight
}), /*#__PURE__*/React__default["default"].createElement(Button, {
disabled: moveAllRightDisabled,
type: "button",
icon: "pi pi-angle-double-right",
onClick: this.moveAllRight
}), /*#__PURE__*/React__default["default"].createElement(Button, {
disabled: moveLeftDisabled,
type: "button",
icon: "pi pi-angle-left",
onClick: this.moveLeft
}), /*#__PURE__*/React__default["default"].createElement(Button, {
disabled: moveAllLeftDisabled,
type: "button",
icon: "pi pi-angle-double-left",
onClick: this.moveAllLeft
}));
}
}]);
return PickListTransferControls;
}(React.Component);
function _createSuper$J(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$J(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$J() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var PickList = /*#__PURE__*/function (_Component) {
_inherits(PickList, _Component);
var _super = _createSuper$J(PickList);
function PickList(props) {
var _this;
_classCallCheck(this, PickList);
_this = _super.call(this, props);
_this.state = {};
if (!_this.props.onSourceSelectionChange) {
_this.state.sourceSelection = [];
}
if (!_this.props.onTargetSelectionChange) {
_this.state.targetSelection = [];
}
_this.onSourceReorder = _this.onSourceReorder.bind(_assertThisInitialized(_this));
_this.onTargetReorder = _this.onTargetReorder.bind(_assertThisInitialized(_this));
_this.onTransfer = _this.onTransfer.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(PickList, [{
key: "getSourceSelection",
value: function getSourceSelection() {
return this.props.onSourceSelectionChange ? this.props.sourceSelection : this.state.sourceSelection;
}
}, {
key: "getTargetSelection",
value: function getTargetSelection() {
return this.props.onTargetSelectionChange ? this.props.targetSelection : this.state.targetSelection;
}
}, {
key: "onSourceReorder",
value: function onSourceReorder(event) {
this.handleChange(event, event.value, this.props.target);
this.reorderedListElement = this.sourceListElement;
this.reorderDirection = event.direction;
}
}, {
key: "onTargetReorder",
value: function onTargetReorder(event) {
this.handleChange(event, this.props.source, event.value);
this.reorderedListElement = this.targetListElement;
this.reorderDirection = event.direction;
}
}, {
key: "handleScrollPosition",
value: function handleScrollPosition(listElement, direction) {
if (listElement) {
var listContainer = DomHandler.findSingle(listElement, '.p-picklist-list');
switch (direction) {
case 'up':
this.scrollInView(listContainer, -1);
break;
case 'top':
listContainer.scrollTop = 0;
break;
case 'down':
this.scrollInView(listContainer, 1);
break;
case 'bottom':
listContainer.scrollTop = listContainer.scrollHeight;
break;
}
}
}
}, {
key: "handleChange",
value: function handleChange(event, source, target) {
if (this.props.onChange) {
this.props.onChange({
originalEvent: event.originalEvent,
source: source,
target: target
});
}
}
}, {
key: "onTransfer",
value: function onTransfer(event) {
var originalEvent = event.originalEvent,
source = event.source,
target = event.target,
direction = event.direction;
switch (direction) {
case 'toTarget':
if (this.props.onMoveToTarget) {
this.props.onMoveToTarget({
originalEvent: originalEvent,
value: this.getSourceSelection()
});
}
break;
case 'allToTarget':
if (this.props.onMoveAllToTarget) {
this.props.onMoveAllToTarget({
originalEvent: originalEvent,
value: this.props.source
});
}
break;
case 'toSource':
if (this.props.onMoveToSource) {
this.props.onMoveToSource({
originalEvent: originalEvent,
value: this.getTargetSelection()
});
}
break;
case 'allToSource':
if (this.props.onMoveAllToSource) {
this.props.onMoveAllToSource({
originalEvent: originalEvent,
value: this.props.target
});
}
break;
}
this.onSelectionChange({
originalEvent: originalEvent,
value: []
}, 'sourceSelection', this.props.onSourceSelectionChange);
this.onSelectionChange({
originalEvent: originalEvent,
value: []
}, 'targetSelection', this.props.onTargetSelectionChange);
this.handleChange(event, source, target);
}
}, {
key: "scrollInView",
value: function scrollInView(listContainer) {
var direction = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 1;
var selectedItems = listContainer.getElementsByClassName('p-highlight');
if (ObjectUtils.isNotEmpty(selectedItems)) {
DomHandler.scrollInView(listContainer, direction === -1 ? selectedItems[0] : selectedItems[selectedItems.length - 1]);
}
}
}, {
key: "onSelectionChange",
value: function onSelectionChange(e, stateKey, callback) {
if (callback) {
callback(e);
} else {
this.setState(_defineProperty({}, stateKey, e.value));
}
if (ObjectUtils.isNotEmpty(this.state.sourceSelection) && stateKey === 'targetSelection') {
this.setState({
sourceSelection: []
});
} else if (ObjectUtils.isNotEmpty(this.state.targetSelection) && stateKey === 'sourceSelection') {
this.setState({
targetSelection: []
});
}
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate() {
if (this.reorderedListElement) {
this.handleScrollPosition(this.reorderedListElement, this.reorderDirection);
this.reorderedListElement = null;
this.reorderDirection = null;
}
}
}, {
key: "render",
value: function render() {
var _this2 = this;
var className = classNames('p-picklist p-component', this.props.className);
var sourceSelection = this.getSourceSelection();
var targetSelection = this.getTargetSelection();
return /*#__PURE__*/React__default["default"].createElement("div", {
id: this.props.id,
className: className,
style: this.props.style
}, this.props.showSourceControls && /*#__PURE__*/React__default["default"].createElement(PickListControls, {
list: this.props.source,
selection: sourceSelection,
onReorder: this.onSourceReorder,
className: "p-picklist-source-controls",
dataKey: this.props.dataKey
}), /*#__PURE__*/React__default["default"].createElement(PickListSubList, {
ref: function ref(el) {
return _this2.sourceListElement = el;
},
list: this.props.source,
selection: sourceSelection,
onSelectionChange: function onSelectionChange(e) {
return _this2.onSelectionChange(e, 'sourceSelection', _this2.props.onSourceSelectionChange);
},
itemTemplate: this.props.itemTemplate,
header: this.props.sourceHeader,
style: this.props.sourceStyle,
className: "p-picklist-source-wrapper",
listClassName: "p-picklist-source",
metaKeySelection: this.props.metaKeySelection,
tabIndex: this.props.tabIndex,
dataKey: this.props.dataKey
}), /*#__PURE__*/React__default["default"].createElement(PickListTransferControls, {
onTransfer: this.onTransfer,
source: this.props.source,
target: this.props.target,
sourceSelection: sourceSelection,
targetSelection: targetSelection,
dataKey: this.props.dataKey
}), /*#__PURE__*/React__default["default"].createElement(PickListSubList, {
ref: function ref(el) {
return _this2.targetListElement = el;
},
list: this.props.target,
selection: targetSelection,
onSelectionChange: function onSelectionChange(e) {
return _this2.onSelectionChange(e, 'targetSelection', _this2.props.onTargetSelectionChange);
},
itemTemplate: this.props.itemTemplate,
header: this.props.targetHeader,
style: this.props.targetStyle,
className: "p-picklist-target-wrapper",
listClassName: "p-picklist-target",
metaKeySelection: this.props.metaKeySelection,
tabIndex: this.props.tabIndex,
dataKey: this.props.dataKey
}), this.props.showTargetControls && /*#__PURE__*/React__default["default"].createElement(PickListControls, {
list: this.props.target,
selection: targetSelection,
onReorder: this.onTargetReorder,
className: "p-picklist-target-controls",
dataKey: this.props.dataKey
}));
}
}]);
return PickList;
}(React.Component);
_defineProperty(PickList, "defaultProps", {
id: null,
source: null,
target: null,
sourceHeader: null,
targetHeader: null,
style: null,
className: null,
sourceStyle: null,
targetStyle: null,
sourceSelection: null,
targetSelection: null,
showSourceControls: true,
showTargetControls: true,
metaKeySelection: true,
tabIndex: 0,
dataKey: null,
itemTemplate: null,
onChange: null,
onMoveToSource: null,
onMoveAllToSource: null,
onMoveToTarget: null,
onMoveAllToTarget: null,
onSourceSelectionChange: null,
onTargetSelectionChange: null
});
function _createSuper$I(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$I(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$I() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var ProgressSpinner = /*#__PURE__*/function (_Component) {
_inherits(ProgressSpinner, _Component);
var _super = _createSuper$I(ProgressSpinner);
function ProgressSpinner() {
_classCallCheck(this, ProgressSpinner);
return _super.apply(this, arguments);
}
_createClass(ProgressSpinner, [{
key: "render",
value: function render() {
var spinnerClass = classNames('p-progress-spinner', this.props.className);
return /*#__PURE__*/React__default["default"].createElement("div", {
id: this.props.id,
style: this.props.style,
className: spinnerClass,
role: "alert",
"aria-busy": true
}, /*#__PURE__*/React__default["default"].createElement("svg", {
className: "p-progress-spinner-svg",
viewBox: "25 25 50 50",
style: {
animationDuration: this.props.animationDuration
}
}, /*#__PURE__*/React__default["default"].createElement("circle", {
className: "p-progress-spinner-circle",
cx: "50",
cy: "50",
r: "20",
fill: this.props.fill,
strokeWidth: this.props.strokeWidth,
strokeMiterlimit: "10"
})));
}
}]);
return ProgressSpinner;
}(React.Component);
_defineProperty(ProgressSpinner, "defaultProps", {
id: null,
style: null,
className: null,
strokeWidth: "2",
fill: "none",
animationDuration: "2s"
});
function ownKeys$f(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$f(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$f(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$f(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createSuper$H(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$H(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$H() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var RadioButton = /*#__PURE__*/function (_Component) {
_inherits(RadioButton, _Component);
var _super = _createSuper$H(RadioButton);
function RadioButton(props) {
var _this;
_classCallCheck(this, RadioButton);
_this = _super.call(this, props);
_this.state = {};
_this.onClick = _this.onClick.bind(_assertThisInitialized(_this));
_this.onFocus = _this.onFocus.bind(_assertThisInitialized(_this));
_this.onBlur = _this.onBlur.bind(_assertThisInitialized(_this));
_this.inputRef = /*#__PURE__*/React.createRef(_this.props.inputRef);
return _this;
}
_createClass(RadioButton, [{
key: "select",
value: function select(e) {
this.inputRef.current.checked = true;
this.onClick(e);
}
}, {
key: "onClick",
value: function onClick(e) {
if (!this.props.disabled && this.props.onChange) {
this.props.onChange({
originalEvent: e,
value: this.props.value,
checked: !this.props.checked,
stopPropagation: function stopPropagation() {},
preventDefault: function preventDefault() {},
target: {
name: this.props.name,
id: this.props.id,
value: this.props.value,
checked: !this.props.checked
}
});
this.inputRef.current.checked = !this.props.checked;
this.inputRef.current.focus();
}
}
}, {
key: "onFocus",
value: function onFocus() {
this.setState({
focused: true
});
}
}, {
key: "onBlur",
value: function onBlur() {
this.setState({
focused: false
});
}
}, {
key: "updateInputRef",
value: function updateInputRef() {
var ref = this.props.inputRef;
if (ref) {
if (typeof ref === 'function') {
ref(this.inputRef.current);
} else {
ref.current = this.inputRef.current;
}
}
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
this.updateInputRef();
if (this.props.tooltip) {
this.renderTooltip();
}
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps) {
if (prevProps.tooltip !== this.props.tooltip || prevProps.tooltipOptions !== this.props.tooltipOptions) {
if (this.tooltip) this.tooltip.update(_objectSpread$f({
content: this.props.tooltip
}, this.props.tooltipOptions || {}));else this.renderTooltip();
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
if (this.tooltip) {
this.tooltip.destroy();
this.tooltip = null;
}
}
}, {
key: "renderTooltip",
value: function renderTooltip() {
this.tooltip = tip({
target: this.element,
content: this.props.tooltip,
options: this.props.tooltipOptions
});
}
}, {
key: "render",
value: function render() {
var _this2 = this;
if (this.inputRef && this.inputRef.current) {
this.inputRef.current.checked = this.props.checked;
}
var containerClass = classNames('p-radiobutton p-component', {
'p-radiobutton-checked': this.props.checked,
'p-radiobutton-disabled': this.props.disabled,
'p-radiobutton-focused': this.state.focused
}, this.props.className);
var boxClass = classNames('p-radiobutton-box', {
'p-highlight': this.props.checked,
'p-disabled': this.props.disabled,
'p-focus': this.state.focused
});
return /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this2.element = el;
},
id: this.props.id,
className: containerClass,
style: this.props.style,
onClick: this.onClick
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-hidden-accessible"
}, /*#__PURE__*/React__default["default"].createElement("input", {
ref: this.inputRef,
id: this.props.inputId,
type: "radio",
"aria-labelledby": this.props.ariaLabelledBy,
name: this.props.name,
defaultChecked: this.props.checked,
onFocus: this.onFocus,
onBlur: this.onBlur,
disabled: this.props.disabled,
required: this.props.required,
tabIndex: this.props.tabIndex
})), /*#__PURE__*/React__default["default"].createElement("div", {
className: boxClass,
ref: function ref(el) {
_this2.box = el;
},
role: "radio",
"aria-checked": this.props.checked
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-radiobutton-icon"
})));
}
}]);
return RadioButton;
}(React.Component);
_defineProperty(RadioButton, "defaultProps", {
id: null,
inputRef: null,
inputId: null,
name: null,
value: null,
checked: false,
style: null,
className: null,
disabled: false,
required: false,
tabIndex: null,
tooltip: null,
tooltipOptions: null,
ariaLabelledBy: null,
onChange: null
});
function ownKeys$e(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$e(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$e(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$e(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createSuper$G(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$G(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$G() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var Rating = /*#__PURE__*/function (_Component) {
_inherits(Rating, _Component);
var _super = _createSuper$G(Rating);
function Rating(props) {
var _this;
_classCallCheck(this, Rating);
_this = _super.call(this, props);
_this.clear = _this.clear.bind(_assertThisInitialized(_this));
_this.onStarKeyDown = _this.onStarKeyDown.bind(_assertThisInitialized(_this));
_this.onCancelKeyDown = _this.onCancelKeyDown.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(Rating, [{
key: "rate",
value: function rate(event, i) {
if (!this.props.readOnly && !this.props.disabled && this.props.onChange) {
this.props.onChange({
originalEvent: event,
value: i,
stopPropagation: function stopPropagation() {},
preventDefault: function preventDefault() {},
target: {
name: this.props.name,
id: this.props.id,
value: i
}
});
}
event.preventDefault();
}
}, {
key: "clear",
value: function clear(event) {
if (!this.props.readOnly && !this.props.disabled && this.props.onChange) {
this.props.onChange({
originalEvent: event,
value: null,
stopPropagation: function stopPropagation() {},
preventDefault: function preventDefault() {},
target: {
name: this.props.name,
id: this.props.id,
value: null
}
});
}
event.preventDefault();
}
}, {
key: "shouldComponentUpdate",
value: function shouldComponentUpdate(nextProps, nextState) {
if (nextProps.value === this.props.value && nextProps.disabled === this.props.disabled) {
return false;
}
return true;
}
}, {
key: "onStarKeyDown",
value: function onStarKeyDown(event, value) {
if (event.key === 'Enter') {
this.rate(event, value);
}
}
}, {
key: "onCancelKeyDown",
value: function onCancelKeyDown(event) {
if (event.key === 'Enter') {
this.clear(event);
}
}
}, {
key: "getFocusIndex",
value: function getFocusIndex() {
return this.props.disabled || this.props.readOnly ? null : 0;
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
if (this.props.tooltip) {
this.renderTooltip();
}
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps) {
if (prevProps.tooltip !== this.props.tooltip || prevProps.tooltipOptions !== this.props.tooltipOptions) {
if (this.tooltip) this.tooltip.update(_objectSpread$e({
content: this.props.tooltip
}, this.props.tooltipOptions || {}));else this.renderTooltip();
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
if (this.tooltip) {
this.tooltip.destroy();
this.tooltip = null;
}
}
}, {
key: "renderTooltip",
value: function renderTooltip() {
this.tooltip = tip({
target: this.element,
content: this.props.tooltip,
options: this.props.tooltipOptions
});
}
}, {
key: "renderStars",
value: function renderStars() {
var _this2 = this;
var starsArray = [];
for (var i = 0; i < this.props.stars; i++) {
starsArray[i] = i + 1;
}
var stars = starsArray.map(function (value) {
var iconClass = classNames('p-rating-icon', {
'pi pi-star': !_this2.props.value || value > _this2.props.value,
'pi pi-star-fill': value <= _this2.props.value
});
return /*#__PURE__*/React__default["default"].createElement("span", {
className: iconClass,
onClick: function onClick(e) {
return _this2.rate(e, value);
},
key: value,
tabIndex: _this2.getFocusIndex(),
onKeyDown: function onKeyDown(e) {
return _this2.onStarKeyDown(e, value);
}
});
});
return stars;
}
}, {
key: "renderCancelIcon",
value: function renderCancelIcon() {
if (this.props.cancel) {
return /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-rating-icon p-rating-cancel pi pi-ban",
onClick: this.clear,
tabIndex: this.getFocusIndex(),
onKeyDown: this.onCancelKeyDown
});
}
return null;
}
}, {
key: "render",
value: function render() {
var _this3 = this;
var className = classNames('p-rating', {
'p-disabled': this.props.disabled,
'p-rating-readonly': this.props.readOnly
}, this.props.className);
var cancelIcon = this.renderCancelIcon();
var stars = this.renderStars();
return /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this3.element = el;
},
id: this.props.id,
className: className,
style: this.props.style
}, cancelIcon, stars);
}
}]);
return Rating;
}(React.Component);
_defineProperty(Rating, "defaultProps", {
id: null,
value: null,
disabled: false,
readOnly: false,
stars: 5,
cancel: true,
style: null,
className: null,
tooltip: null,
tooltipOptions: null,
onChange: null
});
function _createSuper$F(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$F(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$F() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var Row = /*#__PURE__*/function (_Component) {
_inherits(Row, _Component);
var _super = _createSuper$F(Row);
function Row() {
_classCallCheck(this, Row);
return _super.apply(this, arguments);
}
_createClass(Row, [{
key: "render",
value: function render() {
return /*#__PURE__*/React__default["default"].createElement("tr", null, this.props.children);
}
}]);
return Row;
}(React.Component);
_defineProperty(Row, "defaultProps", {
style: null,
className: null
});
function _createSuper$E(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$E(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$E() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var ScrollPanel = /*#__PURE__*/function (_Component) {
_inherits(ScrollPanel, _Component);
var _super = _createSuper$E(ScrollPanel);
function ScrollPanel(props) {
var _this;
_classCallCheck(this, ScrollPanel);
_this = _super.call(this, props);
_this.moveBar = _this.moveBar.bind(_assertThisInitialized(_this));
_this.onXBarMouseDown = _this.onXBarMouseDown.bind(_assertThisInitialized(_this));
_this.onYBarMouseDown = _this.onYBarMouseDown.bind(_assertThisInitialized(_this));
_this.onDocumentMouseMove = _this.onDocumentMouseMove.bind(_assertThisInitialized(_this));
_this.onDocumentMouseUp = _this.onDocumentMouseUp.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(ScrollPanel, [{
key: "calculateContainerHeight",
value: function calculateContainerHeight() {
var containerStyles = getComputedStyle(this.container),
xBarStyles = getComputedStyle(this.xBar),
pureContainerHeight = DomHandler.getHeight(this.container) - parseInt(xBarStyles['height'], 10);
if (containerStyles['max-height'] !== "none" && pureContainerHeight === 0) {
if (this.content.offsetHeight + parseInt(xBarStyles['height'], 10) > parseInt(containerStyles['max-height'], 10)) {
this.container.style.height = containerStyles['max-height'];
} else {
this.container.style.height = this.content.offsetHeight + parseFloat(containerStyles.paddingTop) + parseFloat(containerStyles.paddingBottom) + parseFloat(containerStyles.borderTopWidth) + parseFloat(containerStyles.borderBottomWidth) + "px";
}
}
}
}, {
key: "moveBar",
value: function moveBar() {
var _this2 = this;
/* horizontal scroll */
var totalWidth = this.content.scrollWidth;
var ownWidth = this.content.clientWidth;
var bottom = (this.container.clientHeight - this.xBar.clientHeight) * -1;
this.scrollXRatio = ownWidth / totalWidth;
/* vertical scroll */
var totalHeight = this.content.scrollHeight;
var ownHeight = this.content.clientHeight;
var right = (this.container.clientWidth - this.yBar.clientWidth) * -1;
this.scrollYRatio = ownHeight / totalHeight;
this.frame = this.requestAnimationFrame(function () {
if (_this2.scrollXRatio >= 1) {
DomHandler.addClass(_this2.xBar, 'p-scrollpanel-hidden');
} else {
DomHandler.removeClass(_this2.xBar, 'p-scrollpanel-hidden');
_this2.xBar.style.cssText = 'width:' + Math.max(_this2.scrollXRatio * 100, 10) + '%; left:' + _this2.content.scrollLeft / totalWidth * 100 + '%;bottom:' + bottom + 'px;';
}
if (_this2.scrollYRatio >= 1) {
DomHandler.addClass(_this2.yBar, 'p-scrollpanel-hidden');
} else {
DomHandler.removeClass(_this2.yBar, 'p-scrollpanel-hidden');
_this2.yBar.style.cssText = 'height:' + Math.max(_this2.scrollYRatio * 100, 10) + '%; top: calc(' + _this2.content.scrollTop / totalHeight * 100 + '% - ' + _this2.xBar.clientHeight + 'px);right:' + right + 'px;';
}
});
}
}, {
key: "onYBarMouseDown",
value: function onYBarMouseDown(e) {
this.isYBarClicked = true;
this.lastPageY = e.pageY;
DomHandler.addClass(this.yBar, 'p-scrollpanel-grabbed');
DomHandler.addClass(document.body, 'p-scrollpanel-grabbed');
document.addEventListener('mousemove', this.onDocumentMouseMove);
document.addEventListener('mouseup', this.onDocumentMouseUp);
e.preventDefault();
}
}, {
key: "onXBarMouseDown",
value: function onXBarMouseDown(e) {
this.isXBarClicked = true;
this.lastPageX = e.pageX;
DomHandler.addClass(this.xBar, 'p-scrollpanel-grabbed');
DomHandler.addClass(document.body, 'p-scrollpanel-grabbed');
document.addEventListener('mousemove', this.onDocumentMouseMove);
document.addEventListener('mouseup', this.onDocumentMouseUp);
e.preventDefault();
}
}, {
key: "onDocumentMouseMove",
value: function onDocumentMouseMove(e) {
if (this.isXBarClicked) {
this.onMouseMoveForXBar(e);
} else if (this.isYBarClicked) {
this.onMouseMoveForYBar(e);
} else {
this.onMouseMoveForXBar(e);
this.onMouseMoveForYBar(e);
}
}
}, {
key: "onMouseMoveForXBar",
value: function onMouseMoveForXBar(e) {
var _this3 = this;
var deltaX = e.pageX - this.lastPageX;
this.lastPageX = e.pageX;
this.frame = this.requestAnimationFrame(function () {
_this3.content.scrollLeft += deltaX / _this3.scrollXRatio;
});
}
}, {
key: "onMouseMoveForYBar",
value: function onMouseMoveForYBar(e) {
var _this4 = this;
var deltaY = e.pageY - this.lastPageY;
this.lastPageY = e.pageY;
this.frame = this.requestAnimationFrame(function () {
_this4.content.scrollTop += deltaY / _this4.scrollYRatio;
});
}
}, {
key: "onDocumentMouseUp",
value: function onDocumentMouseUp(e) {
DomHandler.removeClass(this.yBar, 'p-scrollpanel-grabbed');
DomHandler.removeClass(this.xBar, 'p-scrollpanel-grabbed');
DomHandler.removeClass(document.body, 'p-scrollpanel-grabbed');
document.removeEventListener('mousemove', this.onDocumentMouseMove);
document.removeEventListener('mouseup', this.onDocumentMouseUp);
this.isXBarClicked = false;
this.isYBarClicked = false;
}
}, {
key: "requestAnimationFrame",
value: function requestAnimationFrame(f) {
var frame = window.requestAnimationFrame || this.timeoutFrame;
return frame(f);
}
}, {
key: "refresh",
value: function refresh() {
this.moveBar();
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
this.moveBar();
this.moveBar = this.moveBar.bind(this);
window.addEventListener('resize', this.moveBar);
this.calculateContainerHeight();
this.initialized = true;
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
if (this.initialized) {
window.removeEventListener('resize', this.moveBar);
}
if (this.frame) {
window.cancelAnimationFrame(this.frame);
}
}
}, {
key: "render",
value: function render() {
var _this5 = this;
var className = classNames('p-scrollpanel p-component', this.props.className);
return /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this5.container = el;
},
id: this.props.id,
className: className,
style: this.props.style
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-scrollpanel-wrapper"
}, /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this5.content = el;
},
className: "p-scrollpanel-content",
onScroll: this.moveBar,
onMouseEnter: this.moveBar
}, this.props.children)), /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this5.xBar = el;
},
className: "p-scrollpanel-bar p-scrollpanel-bar-x",
onMouseDown: this.onXBarMouseDown
}), /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this5.yBar = el;
},
className: "p-scrollpanel-bar p-scrollpanel-bar-y",
onMouseDown: this.onYBarMouseDown
}));
}
}]);
return ScrollPanel;
}(React.Component);
_defineProperty(ScrollPanel, "defaultProps", {
id: null,
style: null,
className: null
});
function _createSuper$D(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$D(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$D() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var ScrollTop = /*#__PURE__*/function (_Component) {
_inherits(ScrollTop, _Component);
var _super = _createSuper$D(ScrollTop);
function ScrollTop(props) {
var _this;
_classCallCheck(this, ScrollTop);
_this = _super.call(this, props);
_this.state = {
visible: false
};
_this.onClick = _this.onClick.bind(_assertThisInitialized(_this));
_this.onEnter = _this.onEnter.bind(_assertThisInitialized(_this));
_this.onEntered = _this.onEntered.bind(_assertThisInitialized(_this));
_this.onExited = _this.onExited.bind(_assertThisInitialized(_this));
_this.scrollElementRef = /*#__PURE__*/React__default["default"].createRef();
return _this;
}
_createClass(ScrollTop, [{
key: "onClick",
value: function onClick() {
var scrollElement = this.props.target === 'window' ? window : this.helper.parentElement;
scrollElement.scroll({
top: 0,
behavior: this.props.behavior
});
}
}, {
key: "checkVisibility",
value: function checkVisibility(scrollY) {
this.setState({
visible: scrollY > this.props.threshold
});
}
}, {
key: "bindParentScrollListener",
value: function bindParentScrollListener() {
var _this2 = this;
this.scrollListener = function () {
_this2.checkVisibility(_this2.helper.parentElement.scrollTop);
};
this.helper.parentElement.addEventListener('scroll', this.scrollListener);
}
}, {
key: "bindDocumentScrollListener",
value: function bindDocumentScrollListener() {
var _this3 = this;
this.scrollListener = function () {
_this3.checkVisibility(DomHandler.getWindowScrollTop());
};
window.addEventListener('scroll', this.scrollListener);
}
}, {
key: "unbindParentScrollListener",
value: function unbindParentScrollListener() {
if (this.scrollListener) {
this.helper.parentElement.removeEventListener('scroll', this.scrollListener);
this.scrollListener = null;
}
}
}, {
key: "unbindDocumentScrollListener",
value: function unbindDocumentScrollListener() {
if (this.scrollListener) {
window.removeEventListener('scroll', this.scrollListener);
this.scrollListener = null;
}
}
}, {
key: "onEnter",
value: function onEnter() {
ZIndexUtils.set('overlay', this.scrollElementRef.current, PrimeReact.autoZIndex, PrimeReact.zIndex['overlay']);
}
}, {
key: "onEntered",
value: function onEntered() {
this.props.onShow && this.props.onShow();
}
}, {
key: "onExited",
value: function onExited() {
ZIndexUtils.clear(this.scrollElementRef.current);
this.props.onHide && this.props.onHide();
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
if (this.props.target === 'window') this.bindDocumentScrollListener();else if (this.props.target === 'parent') this.bindParentScrollListener();
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
if (this.props.target === 'window') this.unbindDocumentScrollListener();else if (this.props.target === 'parent') this.unbindParentScrollListener();
ZIndexUtils.clear(this.scrollElementRef.current);
}
}, {
key: "render",
value: function render() {
var _this4 = this;
var className = classNames('p-scrolltop p-link p-component', {
'p-scrolltop-sticky': this.props.target !== 'window'
}, this.props.className);
var isTargetParent = this.props.target === 'parent';
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(CSSTransition, {
nodeRef: this.scrollElementRef,
classNames: "p-scrolltop",
"in": this.state.visible,
timeout: {
enter: 150,
exit: 150
},
options: this.props.transitionOptions,
unmountOnExit: true,
onEnter: this.onEnter,
onEntered: this.onEntered,
onExited: this.onExited
}, /*#__PURE__*/React__default["default"].createElement("button", {
ref: this.scrollElementRef,
type: "button",
className: className,
style: this.props.style,
onClick: this.onClick
}, IconUtils.getJSXIcon(this.props.icon, {
className: 'p-scrolltop-icon'
}, {
props: this.props
}), /*#__PURE__*/React__default["default"].createElement(Ripple, null))), isTargetParent && /*#__PURE__*/React__default["default"].createElement("span", {
ref: function ref(el) {
return _this4.helper = el;
},
className: "p-scrolltop-helper"
}));
}
}]);
return ScrollTop;
}(React.Component);
_defineProperty(ScrollTop, "defaultProps", {
target: 'window',
threshold: 400,
icon: 'pi pi-chevron-up',
behavior: 'smooth',
className: null,
style: null,
transitionOptions: null,
onShow: null,
onHide: null
});
function _createSuper$C(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$C(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$C() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var SelectButtonItem = /*#__PURE__*/function (_Component) {
_inherits(SelectButtonItem, _Component);
var _super = _createSuper$C(SelectButtonItem);
function SelectButtonItem(props) {
var _this;
_classCallCheck(this, SelectButtonItem);
_this = _super.call(this, props);
_this.state = {
focused: false
};
_this.onClick = _this.onClick.bind(_assertThisInitialized(_this));
_this.onFocus = _this.onFocus.bind(_assertThisInitialized(_this));
_this.onBlur = _this.onBlur.bind(_assertThisInitialized(_this));
_this.onKeyDown = _this.onKeyDown.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(SelectButtonItem, [{
key: "onClick",
value: function onClick(event) {
if (this.props.onClick) {
this.props.onClick({
originalEvent: event,
option: this.props.option
});
}
}
}, {
key: "onFocus",
value: function onFocus() {
this.setState({
focused: true
});
}
}, {
key: "onBlur",
value: function onBlur() {
this.setState({
focused: false
});
}
}, {
key: "onKeyDown",
value: function onKeyDown(event) {
var keyCode = event.which;
if (keyCode === 32 || keyCode === 13) {
//space and enter
this.onClick(event);
event.preventDefault();
}
}
}, {
key: "renderContent",
value: function renderContent() {
if (this.props.template) {
return this.props.template(this.props.option);
} else {
return /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-button-label p-c"
}, this.props.label);
}
}
}, {
key: "render",
value: function render() {
var className = classNames('p-button p-component', {
'p-highlight': this.props.selected,
'p-disabled': this.props.disabled,
'p-focus': this.state.focused
}, this.props.className);
var content = this.renderContent();
return /*#__PURE__*/React__default["default"].createElement("div", {
className: className,
role: "button",
"aria-label": this.props.label,
"aria-pressed": this.props.selected,
"aria-labelledby": this.props.ariaLabelledBy,
onClick: this.onClick,
onKeyDown: this.onKeyDown,
tabIndex: this.props.tabIndex,
onFocus: this.onFocus,
onBlur: this.onBlur
}, content, !this.props.disabled && /*#__PURE__*/React__default["default"].createElement(Ripple, null));
}
}]);
return SelectButtonItem;
}(React.Component);
_defineProperty(SelectButtonItem, "defaultProps", {
option: null,
label: null,
className: null,
selected: null,
tabIndex: null,
ariaLabelledBy: null,
template: null,
onClick: null
});
function ownKeys$d(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$d(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$d(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$d(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createForOfIteratorHelper$7(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray$7(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it["return"] != null) it["return"](); } finally { if (didErr) throw err; } } }; }
function _unsupportedIterableToArray$7(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray$7(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray$7(o, minLen); }
function _arrayLikeToArray$7(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
function _createSuper$B(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$B(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$B() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var SelectButton = /*#__PURE__*/function (_Component) {
_inherits(SelectButton, _Component);
var _super = _createSuper$B(SelectButton);
function SelectButton(props) {
var _this;
_classCallCheck(this, SelectButton);
_this = _super.call(this, props);
_this.onOptionClick = _this.onOptionClick.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(SelectButton, [{
key: "onOptionClick",
value: function onOptionClick(event) {
var _this2 = this;
if (this.props.disabled || this.isOptionDisabled(event.option)) {
return;
}
var selected = this.isSelected(event.option);
if (selected && !this.props.unselectable) {
return;
}
var optionValue = this.getOptionValue(event.option);
var newValue;
if (this.props.multiple) {
var currentValue = this.props.value ? _toConsumableArray(this.props.value) : [];
if (selected) newValue = currentValue.filter(function (val) {
return !ObjectUtils.equals(val, optionValue, _this2.props.dataKey);
});else newValue = [].concat(_toConsumableArray(currentValue), [optionValue]);
} else {
if (selected) newValue = null;else newValue = optionValue;
}
if (this.props.onChange) {
this.props.onChange({
originalEvent: event.originalEvent,
value: newValue,
stopPropagation: function stopPropagation() {},
preventDefault: function preventDefault() {},
target: {
name: this.props.name,
id: this.props.id,
value: newValue
}
});
}
}
}, {
key: "getOptionLabel",
value: function getOptionLabel(option) {
return this.props.optionLabel ? ObjectUtils.resolveFieldData(option, this.props.optionLabel) : option && option['label'] !== undefined ? option['label'] : option;
}
}, {
key: "getOptionValue",
value: function getOptionValue(option) {
return this.props.optionValue ? ObjectUtils.resolveFieldData(option, this.props.optionValue) : option && option['value'] !== undefined ? option['value'] : option;
}
}, {
key: "isOptionDisabled",
value: function isOptionDisabled(option) {
if (this.props.optionDisabled) {
return ObjectUtils.isFunction(this.props.optionDisabled) ? this.props.optionDisabled(option) : ObjectUtils.resolveFieldData(option, this.props.optionDisabled);
}
return option && option['disabled'] !== undefined ? option['disabled'] : false;
}
}, {
key: "isSelected",
value: function isSelected(option) {
var selected = false;
var optionValue = this.getOptionValue(option);
if (this.props.multiple) {
if (this.props.value && this.props.value.length) {
var _iterator = _createForOfIteratorHelper$7(this.props.value),
_step;
try {
for (_iterator.s(); !(_step = _iterator.n()).done;) {
var val = _step.value;
if (ObjectUtils.equals(val, optionValue, this.props.dataKey)) {
selected = true;
break;
}
}
} catch (err) {
_iterator.e(err);
} finally {
_iterator.f();
}
}
} else {
selected = ObjectUtils.equals(this.props.value, optionValue, this.props.dataKey);
}
return selected;
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
if (this.props.tooltip) {
this.renderTooltip();
}
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps) {
if (prevProps.tooltip !== this.props.tooltip || prevProps.tooltipOptions !== this.props.tooltipOptions) {
if (this.tooltip) this.tooltip.update(_objectSpread$d({
content: this.props.tooltip
}, this.props.tooltipOptions || {}));else this.renderTooltip();
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
if (this.tooltip) {
this.tooltip.destroy();
this.tooltip = null;
}
}
}, {
key: "renderTooltip",
value: function renderTooltip() {
this.tooltip = tip({
target: this.element,
content: this.props.tooltip,
options: this.props.tooltipOptions
});
}
}, {
key: "renderItems",
value: function renderItems() {
var _this3 = this;
if (this.props.options && this.props.options.length) {
return this.props.options.map(function (option, index) {
var isDisabled = _this3.props.disabled || _this3.isOptionDisabled(option);
var optionLabel = _this3.getOptionLabel(option);
var tabIndex = isDisabled ? null : 0;
return /*#__PURE__*/React__default["default"].createElement(SelectButtonItem, {
key: "".concat(optionLabel, "_").concat(index),
label: optionLabel,
className: option.className,
option: option,
onClick: _this3.onOptionClick,
template: _this3.props.itemTemplate,
selected: _this3.isSelected(option),
tabIndex: tabIndex,
disabled: isDisabled,
ariaLabelledBy: _this3.props.ariaLabelledBy
});
});
}
return null;
}
}, {
key: "render",
value: function render() {
var _this4 = this;
var className = classNames('p-selectbutton p-buttonset p-component', this.props.className);
var items = this.renderItems();
return /*#__PURE__*/React__default["default"].createElement("div", {
id: this.props.id,
ref: function ref(el) {
return _this4.element = el;
},
className: className,
style: this.props.style,
role: "group"
}, items);
}
}]);
return SelectButton;
}(React.Component);
_defineProperty(SelectButton, "defaultProps", {
id: null,
value: null,
options: null,
optionLabel: null,
optionValue: null,
optionDisabled: null,
tabIndex: null,
multiple: false,
unselectable: true,
disabled: false,
style: null,
className: null,
dataKey: null,
tooltip: null,
tooltipOptions: null,
ariaLabelledBy: null,
itemTemplate: null,
onChange: null
});
function _createSuper$A(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$A(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$A() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var Sidebar = /*#__PURE__*/function (_Component) {
_inherits(Sidebar, _Component);
var _super = _createSuper$A(Sidebar);
function Sidebar(props) {
var _this;
_classCallCheck(this, Sidebar);
_this = _super.call(this, props);
_this.state = {
maskVisible: false,
visible: false
};
_this.onMaskClick = _this.onMaskClick.bind(_assertThisInitialized(_this));
_this.onClose = _this.onClose.bind(_assertThisInitialized(_this));
_this.onEntered = _this.onEntered.bind(_assertThisInitialized(_this));
_this.onExiting = _this.onExiting.bind(_assertThisInitialized(_this));
_this.onExited = _this.onExited.bind(_assertThisInitialized(_this));
_this.sidebarRef = /*#__PURE__*/React__default["default"].createRef();
return _this;
}
_createClass(Sidebar, [{
key: "getPositionClass",
value: function getPositionClass() {
var _this2 = this;
var positions = ['left', 'right', 'top', 'bottom'];
var pos = positions.find(function (item) {
return item === _this2.props.position;
});
return pos ? "p-sidebar-".concat(pos) : '';
}
}, {
key: "focus",
value: function focus() {
var activeElement = document.activeElement;
var isActiveElementInDialog = activeElement && this.sidebarRef && this.sidebarRef.current.contains(activeElement);
if (!isActiveElementInDialog && this.props.showCloseIcon) {
this.closeIcon.focus();
}
}
}, {
key: "onMaskClick",
value: function onMaskClick(event) {
if (this.props.dismissable && this.props.modal && this.mask === event.target) {
this.onClose(event);
}
}
}, {
key: "onClose",
value: function onClose(event) {
this.props.onHide();
event.preventDefault();
}
}, {
key: "onEntered",
value: function onEntered() {
if (this.props.onShow) {
this.props.onShow();
}
this.focus();
this.enableDocumentSettings();
}
}, {
key: "onExiting",
value: function onExiting() {
if (this.props.modal) {
DomHandler.addClass(this.mask, 'p-component-overlay-leave');
}
}
}, {
key: "onExited",
value: function onExited() {
ZIndexUtils.clear(this.mask);
this.setState({
maskVisible: false
});
this.disableDocumentSettings();
}
}, {
key: "enableDocumentSettings",
value: function enableDocumentSettings() {
this.bindGlobalListeners();
if (this.props.blockScroll) {
DomHandler.addClass(document.body, 'p-overflow-hidden');
}
}
}, {
key: "disableDocumentSettings",
value: function disableDocumentSettings() {
this.unbindGlobalListeners();
if (this.props.blockScroll) {
DomHandler.removeClass(document.body, 'p-overflow-hidden');
}
}
}, {
key: "bindGlobalListeners",
value: function bindGlobalListeners() {
if (this.props.closeOnEscape) {
this.bindDocumentEscapeListener();
}
}
}, {
key: "unbindGlobalListeners",
value: function unbindGlobalListeners() {
this.unbindDocumentEscapeListener();
}
}, {
key: "bindDocumentEscapeListener",
value: function bindDocumentEscapeListener() {
var _this3 = this;
this.documentEscapeListener = function (event) {
if (event.which === 27) {
if (ZIndexUtils.get(_this3.mask) === ZIndexUtils.getCurrent('modal', PrimeReact.autoZIndex)) {
_this3.onClose(event);
}
}
};
document.addEventListener('keydown', this.documentEscapeListener);
}
}, {
key: "unbindDocumentEscapeListener",
value: function unbindDocumentEscapeListener() {
if (this.documentEscapeListener) {
document.removeEventListener('keydown', this.documentEscapeListener);
this.documentEscapeListener = null;
}
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
var _this4 = this;
if (this.props.visible) {
this.setState({
maskVisible: true,
visible: true
}, function () {
ZIndexUtils.set('modal', _this4.mask, PrimeReact.autoZIndex, _this4.props.baseZIndex || PrimeReact.zIndex['modal']);
});
}
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps, prevState) {
var _this5 = this;
if (this.props.visible && !this.state.maskVisible) {
this.setState({
maskVisible: true
}, function () {
ZIndexUtils.set('modal', _this5.mask, PrimeReact.autoZIndex, _this5.props.baseZIndex || PrimeReact.zIndex['modal']);
});
}
if (this.props.visible !== this.state.visible && this.state.maskVisible) {
this.setState({
visible: this.props.visible
});
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
this.disableDocumentSettings();
ZIndexUtils.clear(this.mask);
}
}, {
key: "renderCloseIcon",
value: function renderCloseIcon() {
var _this6 = this;
if (this.props.showCloseIcon) {
return /*#__PURE__*/React__default["default"].createElement("button", {
type: "button",
ref: function ref(el) {
return _this6.closeIcon = el;
},
className: "p-sidebar-close p-sidebar-icon p-link",
onClick: this.onClose,
"aria-label": this.props.ariaCloseLabel
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-sidebar-close-icon pi pi-times"
}), /*#__PURE__*/React__default["default"].createElement(Ripple, null));
}
return null;
}
}, {
key: "renderIcons",
value: function renderIcons() {
if (this.props.icons) {
return ObjectUtils.getJSXElement(this.props.icons, this.props);
}
return null;
}
}, {
key: "renderElement",
value: function renderElement() {
var _this7 = this;
var className = classNames('p-sidebar p-component', this.props.className);
var maskClassName = classNames('p-sidebar-mask', {
'p-component-overlay p-component-overlay-enter': this.props.modal,
'p-sidebar-mask-scrollblocker': this.props.blockScroll,
'p-sidebar-visible': this.state.maskVisible,
'p-sidebar-full': this.props.fullScreen
}, this.props.maskClassName, this.getPositionClass());
var closeIcon = this.renderCloseIcon();
var icons = this.renderIcons();
var transitionTimeout = {
enter: this.props.fullScreen ? 150 : 300,
exit: this.props.fullScreen ? 150 : 300
};
return /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this7.mask = el;
},
style: this.props.maskStyle,
className: maskClassName,
onClick: this.onMaskClick
}, /*#__PURE__*/React__default["default"].createElement(CSSTransition, {
nodeRef: this.sidebarRef,
classNames: "p-sidebar",
"in": this.state.visible,
timeout: transitionTimeout,
options: this.props.transitionOptions,
unmountOnExit: true,
onEntered: this.onEntered,
onExiting: this.onExiting,
onExited: this.onExited
}, /*#__PURE__*/React__default["default"].createElement("div", {
ref: this.sidebarRef,
id: this.props.id,
className: className,
style: this.props.style,
role: "complementary"
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-sidebar-header"
}, icons, closeIcon), /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-sidebar-content"
}, this.props.children))));
}
}, {
key: "render",
value: function render() {
if (this.state.maskVisible) {
var element = this.renderElement();
return /*#__PURE__*/React__default["default"].createElement(Portal, {
element: element,
appendTo: this.props.appendTo,
visible: true
});
}
return null;
}
}]);
return Sidebar;
}(React.Component);
_defineProperty(Sidebar, "defaultProps", {
id: null,
style: null,
className: null,
maskStyle: null,
maskClassName: null,
visible: false,
position: 'left',
fullScreen: false,
blockScroll: false,
baseZIndex: 0,
dismissable: true,
showCloseIcon: true,
ariaCloseLabel: 'close',
closeOnEscape: true,
icons: null,
modal: true,
appendTo: null,
transitionOptions: null,
onShow: null,
onHide: null
});
function _createSuper$z(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$z(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$z() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var Skeleton = /*#__PURE__*/function (_Component) {
_inherits(Skeleton, _Component);
var _super = _createSuper$z(Skeleton);
function Skeleton() {
_classCallCheck(this, Skeleton);
return _super.apply(this, arguments);
}
_createClass(Skeleton, [{
key: "skeletonStyle",
value: function skeletonStyle() {
if (this.props.size) return {
width: this.props.size,
height: this.props.size,
borderRadius: this.props.borderRadius
};else return {
width: this.props.width,
height: this.props.height,
borderRadius: this.props.borderRadius
};
}
}, {
key: "render",
value: function render() {
var skeletonClassName = classNames('p-skeleton p-component', {
'p-skeleton-circle': this.props.shape === 'circle',
'p-skeleton-none': this.props.animation === 'none'
}, this.props.className);
var style = this.skeletonStyle();
return /*#__PURE__*/React__default["default"].createElement("div", {
style: style,
className: skeletonClassName
});
}
}]);
return Skeleton;
}(React.Component);
_defineProperty(Skeleton, "defaultProps", {
shape: 'rectangle',
size: null,
width: '100%',
height: '1rem',
borderRadius: null,
animation: 'wave',
style: null,
className: null
});
function _createSuper$y(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$y(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$y() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var SlideMenuSub = /*#__PURE__*/function (_Component) {
_inherits(SlideMenuSub, _Component);
var _super = _createSuper$y(SlideMenuSub);
function SlideMenuSub(props) {
var _this;
_classCallCheck(this, SlideMenuSub);
_this = _super.call(this, props);
_this.state = {
activeItem: null
};
return _this;
}
_createClass(SlideMenuSub, [{
key: "onItemClick",
value: function onItemClick(event, item) {
if (item.disabled) {
event.preventDefault();
return;
}
if (!item.url) {
event.preventDefault();
}
if (item.command) {
item.command({
originalEvent: event,
item: item
});
}
if (item.items) {
this.setState({
activeItem: item
});
this.props.onForward();
}
}
}, {
key: "renderSeparator",
value: function renderSeparator(index) {
return /*#__PURE__*/React__default["default"].createElement("li", {
key: 'separator_' + index,
className: "p-menu-separator"
});
}
}, {
key: "renderSubmenu",
value: function renderSubmenu(item) {
if (item.items) {
return /*#__PURE__*/React__default["default"].createElement(SlideMenuSub, {
model: item.items,
index: this.props.index + 1,
menuWidth: this.props.menuWidth,
effectDuration: this.props.effectDuration,
onForward: this.props.onForward,
parentActive: item === this.state.activeItem
});
}
return null;
}
}, {
key: "renderMenuitem",
value: function renderMenuitem(item, index) {
var _this2 = this;
var active = this.state.activeItem === item;
var className = classNames('p-menuitem', {
'p-menuitem-active': active,
'p-disabled': item.disabled
}, item.className);
var iconClassName = classNames('p-menuitem-icon', item.icon);
var submenuIconClassName = 'p-submenu-icon pi pi-fw pi-angle-right';
var icon = item.icon && /*#__PURE__*/React__default["default"].createElement("span", {
className: iconClassName
});
var label = item.label && /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-menuitem-text"
}, item.label);
var submenuIcon = item.items && /*#__PURE__*/React__default["default"].createElement("span", {
className: submenuIconClassName
});
var submenu = this.renderSubmenu(item);
var content = /*#__PURE__*/React__default["default"].createElement("a", {
href: item.url || '#',
className: "p-menuitem-link",
target: item.target,
onClick: function onClick(event) {
return _this2.onItemClick(event, item, index);
},
"aria-disabled": item.disabled
}, icon, label, submenuIcon);
if (item.template) {
var defaultContentOptions = {
onClick: function onClick(event) {
return _this2.onItemClick(event, item, index);
},
className: 'p-menuitem-link',
labelClassName: 'p-menuitem-text',
iconClassName: iconClassName,
submenuIconClassName: submenuIconClassName,
element: content,
props: this.props,
active: active
};
content = ObjectUtils.getJSXElement(item.template, item, defaultContentOptions);
}
return /*#__PURE__*/React__default["default"].createElement("li", {
key: item.label + '_' + index,
className: className,
style: item.style
}, content, submenu);
}
}, {
key: "renderItem",
value: function renderItem(item, index) {
if (item.separator) return this.renderSeparator(index);else return this.renderMenuitem(item, index);
}
}, {
key: "renderItems",
value: function renderItems() {
var _this3 = this;
if (this.props.model) {
return this.props.model.map(function (item, index) {
return _this3.renderItem(item, index);
});
}
return null;
}
}, {
key: "render",
value: function render() {
var className = classNames({
'p-slidemenu-rootlist': this.props.root,
'p-submenu-list': !this.props.root,
'p-active-submenu': this.props.parentActive
});
var style = {
width: this.props.menuWidth + 'px',
left: this.props.root ? -1 * this.props.level * this.props.menuWidth + 'px' : this.props.menuWidth + 'px',
transitionProperty: this.props.root ? 'left' : 'none',
transitionDuration: this.props.effectDuration + 'ms',
transitionTimingFunction: this.props.easing
};
var items = this.renderItems();
return /*#__PURE__*/React__default["default"].createElement("ul", {
className: className,
style: style
}, items);
}
}]);
return SlideMenuSub;
}(React.Component);
_defineProperty(SlideMenuSub, "defaultProps", {
model: null,
level: 0,
easing: 'ease-out',
effectDuration: 250,
menuWidth: 190,
parentActive: false,
onForward: null
});
var SlideMenu = /*#__PURE__*/function (_Component2) {
_inherits(SlideMenu, _Component2);
var _super2 = _createSuper$y(SlideMenu);
function SlideMenu(props) {
var _this4;
_classCallCheck(this, SlideMenu);
_this4 = _super2.call(this, props);
_this4.state = {
level: 0,
visible: false
};
_this4.navigateBack = _this4.navigateBack.bind(_assertThisInitialized(_this4));
_this4.navigateForward = _this4.navigateForward.bind(_assertThisInitialized(_this4));
_this4.onEnter = _this4.onEnter.bind(_assertThisInitialized(_this4));
_this4.onEntered = _this4.onEntered.bind(_assertThisInitialized(_this4));
_this4.onExit = _this4.onExit.bind(_assertThisInitialized(_this4));
_this4.onExited = _this4.onExited.bind(_assertThisInitialized(_this4));
_this4.onPanelClick = _this4.onPanelClick.bind(_assertThisInitialized(_this4));
_this4.menuRef = /*#__PURE__*/React__default["default"].createRef();
return _this4;
}
_createClass(SlideMenu, [{
key: "onPanelClick",
value: function onPanelClick(event) {
if (this.props.popup) {
OverlayService.emit('overlay-click', {
originalEvent: event,
target: this.target
});
}
}
}, {
key: "navigateForward",
value: function navigateForward() {
this.setState({
level: this.state.level + 1
});
}
}, {
key: "navigateBack",
value: function navigateBack() {
this.setState({
level: this.state.level - 1
});
}
}, {
key: "renderBackward",
value: function renderBackward() {
var _this5 = this;
var className = classNames('p-slidemenu-backward', {
'p-hidden': this.state.level === 0
});
return /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this5.backward = el;
},
className: className,
onClick: this.navigateBack
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-slidemenu-backward-icon pi pi-fw pi-chevron-left"
}), /*#__PURE__*/React__default["default"].createElement("span", null, this.props.backLabel));
}
}, {
key: "toggle",
value: function toggle(event) {
if (this.props.popup) {
if (this.state.visible) this.hide(event);else this.show(event);
}
}
}, {
key: "show",
value: function show(event) {
var _this6 = this;
this.target = event.currentTarget;
var currentEvent = event;
this.setState({
visible: true
}, function () {
if (_this6.props.onShow) {
_this6.props.onShow(currentEvent);
}
});
}
}, {
key: "hide",
value: function hide(event) {
var _this7 = this;
var currentEvent = event;
this.setState({
visible: false
}, function () {
if (_this7.props.onHide) {
_this7.props.onHide(currentEvent);
}
});
}
}, {
key: "onEnter",
value: function onEnter() {
if (this.props.autoZIndex) {
ZIndexUtils.set('menu', this.menuRef.current, PrimeReact.autoZIndex, this.props.baseZIndex || PrimeReact.zIndex['menu']);
}
DomHandler.absolutePosition(this.menuRef.current, this.target);
}
}, {
key: "onEntered",
value: function onEntered() {
this.bindDocumentClickListener();
this.bindDocumentResizeListener();
this.bindScrollListener();
}
}, {
key: "onExit",
value: function onExit() {
this.target = null;
this.unbindDocumentClickListener();
this.unbindDocumentResizeListener();
this.unbindScrollListener();
}
}, {
key: "onExited",
value: function onExited() {
ZIndexUtils.clear(this.menuRef.current);
this.setState({
level: 0
});
}
}, {
key: "bindDocumentClickListener",
value: function bindDocumentClickListener() {
var _this8 = this;
if (!this.documentClickListener) {
this.documentClickListener = function (event) {
if (_this8.state.visible && _this8.isOutsideClicked(event)) {
_this8.hide(event);
}
};
document.addEventListener('click', this.documentClickListener);
}
}
}, {
key: "isOutsideClicked",
value: function isOutsideClicked(event) {
return this.menuRef && this.menuRef.current && !(this.menuRef.current.isSameNode(event.target) || this.menuRef.current.contains(event.target));
}
}, {
key: "bindDocumentResizeListener",
value: function bindDocumentResizeListener() {
var _this9 = this;
if (!this.documentResizeListener) {
this.documentResizeListener = function (event) {
if (_this9.state.visible && !DomHandler.isTouchDevice()) {
_this9.hide(event);
}
};
window.addEventListener('resize', this.documentResizeListener);
}
}
}, {
key: "unbindDocumentClickListener",
value: function unbindDocumentClickListener() {
if (this.documentClickListener) {
document.removeEventListener('click', this.documentClickListener);
this.documentClickListener = null;
}
}
}, {
key: "unbindDocumentResizeListener",
value: function unbindDocumentResizeListener() {
if (this.documentResizeListener) {
window.removeEventListener('resize', this.documentResizeListener);
this.documentResizeListener = null;
}
}
}, {
key: "bindScrollListener",
value: function bindScrollListener() {
var _this10 = this;
if (!this.scrollHandler) {
this.scrollHandler = new ConnectedOverlayScrollHandler(this.target, function (event) {
if (_this10.state.visible) {
_this10.hide(event);
}
});
}
this.scrollHandler.bindScrollListener();
}
}, {
key: "unbindScrollListener",
value: function unbindScrollListener() {
if (this.scrollHandler) {
this.scrollHandler.unbindScrollListener();
}
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps, prevState) {
if (this.props.model !== prevProps.model) {
this.setState({
level: 0
});
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
this.unbindDocumentClickListener();
this.unbindDocumentResizeListener();
if (this.scrollHandler) {
this.scrollHandler.destroy();
this.scrollHandler = null;
}
ZIndexUtils.clear(this.menuRef.current);
}
}, {
key: "renderElement",
value: function renderElement() {
var _this11 = this;
var className = classNames('p-slidemenu p-component', {
'p-slidemenu-overlay': this.props.popup
}, this.props.className);
var backward = this.renderBackward();
return /*#__PURE__*/React__default["default"].createElement(CSSTransition, {
nodeRef: this.menuRef,
classNames: "p-connected-overlay",
"in": !this.props.popup || this.state.visible,
timeout: {
enter: 120,
exit: 100
},
options: this.props.transitionOptions,
unmountOnExit: true,
onEnter: this.onEnter,
onEntered: this.onEntered,
onExit: this.onExit,
onExited: this.onExited
}, /*#__PURE__*/React__default["default"].createElement("div", {
ref: this.menuRef,
id: this.props.id,
className: className,
style: this.props.style,
onClick: this.onPanelClick
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-slidemenu-wrapper",
style: {
height: this.props.viewportHeight + 'px'
}
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-slidemenu-content",
ref: function ref(el) {
return _this11.slideMenuContent = el;
}
}, /*#__PURE__*/React__default["default"].createElement(SlideMenuSub, {
model: this.props.model,
root: true,
index: 0,
menuWidth: this.props.menuWidth,
effectDuration: this.props.effectDuration,
level: this.state.level,
parentActive: this.state.level === 0,
onForward: this.navigateForward
})), backward)));
}
}, {
key: "render",
value: function render() {
var element = this.renderElement();
return this.props.popup ? /*#__PURE__*/React__default["default"].createElement(Portal, {
element: element,
appendTo: this.props.appendTo
}) : element;
}
}]);
return SlideMenu;
}(React.Component);
_defineProperty(SlideMenu, "defaultProps", {
id: null,
model: null,
popup: false,
style: null,
className: null,
easing: 'ease-out',
effectDuration: 250,
backLabel: 'Back',
menuWidth: 190,
viewportHeight: 175,
autoZIndex: true,
baseZIndex: 0,
appendTo: null,
transitionOptions: null,
onShow: null,
onHide: null
});
function _createSuper$x(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$x(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$x() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var Slider = /*#__PURE__*/function (_Component) {
_inherits(Slider, _Component);
var _super = _createSuper$x(Slider);
function Slider(props) {
var _this;
_classCallCheck(this, Slider);
_this = _super.call(this, props);
_this.onBarClick = _this.onBarClick.bind(_assertThisInitialized(_this));
_this.onKeyDown = _this.onKeyDown.bind(_assertThisInitialized(_this));
_this.handleIndex = 0;
return _this;
}
_createClass(Slider, [{
key: "value",
get: function get() {
return this.props.range ? this.props.value || [0, 100] : this.props.value || 0;
}
}, {
key: "spin",
value: function spin(event, dir) {
var value = this.props.range ? this.value[this.handleIndex] : this.value;
var step = (this.props.step || 1) * dir;
this.updateValue(event, value + step);
event.preventDefault();
}
}, {
key: "onDragStart",
value: function onDragStart(event, index) {
if (this.props.disabled) {
return;
}
this.dragging = true;
this.updateDomData();
this.sliderHandleClick = true;
this.handleIndex = index; //event.preventDefault();
}
}, {
key: "onMouseDown",
value: function onMouseDown(event, index) {
this.bindDragListeners();
this.onDragStart(event, index);
}
}, {
key: "onTouchStart",
value: function onTouchStart(event, index) {
this.bindTouchListeners();
this.onDragStart(event, index);
}
}, {
key: "onKeyDown",
value: function onKeyDown(event, index) {
if (this.props.disabled) {
return;
}
this.handleIndex = index;
var key = event.key;
if (key === 'ArrowRight' || key === 'ArrowUp') {
this.spin(event, 1);
} else if (key === 'ArrowLeft' || key === 'ArrowDown') {
this.spin(event, -1);
}
}
}, {
key: "onBarClick",
value: function onBarClick(event) {
if (this.props.disabled) {
return;
}
if (!this.sliderHandleClick) {
this.updateDomData();
var value = this.setValue(event);
if (this.props.onSlideEnd) {
this.props.onSlideEnd({
originalEvent: event,
value: value
});
}
}
this.sliderHandleClick = false;
}
}, {
key: "onDrag",
value: function onDrag(event) {
if (this.dragging) {
this.setValue(event);
event.preventDefault();
}
}
}, {
key: "onDragEnd",
value: function onDragEnd(event) {
if (this.dragging) {
this.dragging = false;
if (this.props.onSlideEnd) {
this.props.onSlideEnd({
originalEvent: event,
value: this.props.value
});
}
this.unbindDragListeners();
this.unbindTouchListeners();
}
}
}, {
key: "bindDragListeners",
value: function bindDragListeners() {
if (!this.dragListener) {
this.dragListener = this.onDrag.bind(this);
document.addEventListener('mousemove', this.dragListener);
}
if (!this.dragEndListener) {
this.dragEndListener = this.onDragEnd.bind(this);
document.addEventListener('mouseup', this.dragEndListener);
}
}
}, {
key: "unbindDragListeners",
value: function unbindDragListeners() {
if (this.dragListener) {
document.removeEventListener('mousemove', this.dragListener);
this.dragListener = null;
}
if (this.dragEndListener) {
document.removeEventListener('mouseup', this.dragEndListener);
this.dragEndListener = null;
}
}
}, {
key: "bindTouchListeners",
value: function bindTouchListeners() {
if (!this.dragListener) {
this.dragListener = this.onDrag.bind(this);
document.addEventListener('touchmove', this.dragListener);
}
if (!this.dragEndListener) {
this.dragEndListener = this.onDragEnd.bind(this);
document.addEventListener('touchend', this.dragEndListener);
}
}
}, {
key: "unbindTouchListeners",
value: function unbindTouchListeners() {
if (this.dragListener) {
document.removeEventListener('touchmove', this.dragListener);
this.dragListener = null;
}
if (this.dragEndListener) {
document.removeEventListener('touchend', this.dragEndListener);
this.dragEndListener = null;
}
}
}, {
key: "updateDomData",
value: function updateDomData() {
var rect = this.el.getBoundingClientRect();
this.initX = rect.left + DomHandler.getWindowScrollLeft();
this.initY = rect.top + DomHandler.getWindowScrollTop();
this.barWidth = this.el.offsetWidth;
this.barHeight = this.el.offsetHeight;
}
}, {
key: "setValue",
value: function setValue(event) {
var handleValue;
var pageX = event.touches ? event.touches[0].pageX : event.pageX;
var pageY = event.touches ? event.touches[0].pageY : event.pageY;
if (this.props.orientation === 'horizontal') handleValue = (pageX - this.initX) * 100 / this.barWidth;else handleValue = (this.initY + this.barHeight - pageY) * 100 / this.barHeight;
var newValue = (this.props.max - this.props.min) * (handleValue / 100) + this.props.min;
if (this.props.step) {
var oldValue = this.props.range ? this.value[this.handleIndex] : this.value;
var diff = newValue - oldValue;
if (diff < 0) newValue = oldValue + Math.ceil(newValue / this.props.step - oldValue / this.props.step) * this.props.step;else if (diff > 0) newValue = oldValue + Math.floor(newValue / this.props.step - oldValue / this.props.step) * this.props.step;
} else {
newValue = Math.floor(newValue);
}
return this.updateValue(event, newValue);
}
}, {
key: "updateValue",
value: function updateValue(event, value) {
var parsedValue = parseFloat(value.toFixed(10));
var newValue = parsedValue;
if (this.props.range) {
if (this.handleIndex === 0) {
if (parsedValue < this.props.min) parsedValue = this.props.min;else if (parsedValue > this.value[1]) parsedValue = this.value[1];
} else {
if (parsedValue > this.props.max) parsedValue = this.props.max;else if (parsedValue < this.value[0]) parsedValue = this.value[0];
}
newValue = _toConsumableArray(this.value);
newValue[this.handleIndex] = parsedValue;
if (this.props.onChange) {
this.props.onChange({
originalEvent: event,
value: newValue
});
}
} else {
if (parsedValue < this.props.min) parsedValue = this.props.min;else if (parsedValue > this.props.max) parsedValue = this.props.max;
newValue = parsedValue;
if (this.props.onChange) {
this.props.onChange({
originalEvent: event,
value: newValue
});
}
}
return newValue;
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
this.unbindDragListeners();
this.unbindTouchListeners();
}
}, {
key: "renderHandle",
value: function renderHandle(leftValue, bottomValue, index) {
var _this2 = this;
var handleClassName = classNames('p-slider-handle', {
'p-slider-handle-start': index === 0,
'p-slider-handle-end': index === 1,
'p-slider-handle-active': this.handleIndex === index
});
return /*#__PURE__*/React__default["default"].createElement("span", {
onMouseDown: function onMouseDown(event) {
return _this2.onMouseDown(event, index);
},
onTouchStart: function onTouchStart(event) {
return _this2.onTouchStart(event, index);
},
onKeyDown: function onKeyDown(event) {
return _this2.onKeyDown(event, index);
},
tabIndex: this.props.tabIndex,
className: handleClassName,
style: {
transition: this.dragging ? 'none' : null,
left: leftValue !== null && leftValue + '%',
bottom: bottomValue && bottomValue + '%'
},
role: "slider",
"aria-valuemin": this.props.min,
"aria-valuemax": this.props.max,
"aria-valuenow": leftValue || bottomValue,
"aria-labelledby": this.props.ariaLabelledBy
});
}
}, {
key: "renderRangeSlider",
value: function renderRangeSlider() {
var values = this.value;
var horizontal = this.props.orientation === 'horizontal';
var handleValueStart = (values[0] < this.props.min ? 0 : values[0] - this.props.min) * 100 / (this.props.max - this.props.min);
var handleValueEnd = (values[1] > this.props.max ? 100 : values[1] - this.props.min) * 100 / (this.props.max - this.props.min);
var rangeStartHandle = horizontal ? this.renderHandle(handleValueStart, null, 0) : this.renderHandle(null, handleValueStart, 0);
var rangeEndHandle = horizontal ? this.renderHandle(handleValueEnd, null, 1) : this.renderHandle(null, handleValueEnd, 1);
var rangeStyle = horizontal ? {
left: handleValueStart + '%',
width: handleValueEnd - handleValueStart + '%'
} : {
bottom: handleValueStart + '%',
height: handleValueEnd - handleValueStart + '%'
};
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-slider-range",
style: rangeStyle
}), rangeStartHandle, rangeEndHandle);
}
}, {
key: "renderSingleSlider",
value: function renderSingleSlider() {
var value = this.value;
var handleValue;
if (value < this.props.min) handleValue = 0;else if (value > this.props.max) handleValue = 100;else handleValue = (value - this.props.min) * 100 / (this.props.max - this.props.min);
var rangeStyle = this.props.orientation === 'horizontal' ? {
width: handleValue + '%'
} : {
height: handleValue + '%'
};
var handle = this.props.orientation === 'horizontal' ? this.renderHandle(handleValue, null, null) : this.renderHandle(null, handleValue, null);
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-slider-range",
style: rangeStyle
}), handle);
}
}, {
key: "render",
value: function render() {
var _this3 = this;
var className = classNames('p-slider p-component', this.props.className, {
'p-disabled': this.props.disabled,
'p-slider-horizontal': this.props.orientation === 'horizontal',
'p-slider-vertical': this.props.orientation === 'vertical'
});
var content = this.props.range ? this.renderRangeSlider() : this.renderSingleSlider();
return /*#__PURE__*/React__default["default"].createElement("div", {
id: this.props.id,
ref: function ref(el) {
return _this3.el = el;
},
style: this.props.style,
className: className,
onClick: this.onBarClick
}, content);
}
}]);
return Slider;
}(React.Component);
_defineProperty(Slider, "defaultProps", {
id: null,
value: null,
min: 0,
max: 100,
orientation: 'horizontal',
step: null,
range: false,
style: null,
className: null,
disabled: false,
tabIndex: 0,
ariaLabelledBy: null,
onChange: null,
onSlideEnd: null
});
function _createSuper$w(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$w(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$w() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var SplitButtonItem = /*#__PURE__*/function (_Component) {
_inherits(SplitButtonItem, _Component);
var _super = _createSuper$w(SplitButtonItem);
function SplitButtonItem(props) {
var _this;
_classCallCheck(this, SplitButtonItem);
_this = _super.call(this, props);
_this.onClick = _this.onClick.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(SplitButtonItem, [{
key: "onClick",
value: function onClick(e) {
if (this.props.menuitem.command) {
this.props.menuitem.command({
originalEvent: e,
item: this.props.menuitem
});
}
if (this.props.onItemClick) {
this.props.onItemClick(e);
}
e.preventDefault();
}
}, {
key: "renderSeparator",
value: function renderSeparator() {
return /*#__PURE__*/React__default["default"].createElement("li", {
className: "p-menu-separator",
role: "separator"
});
}
}, {
key: "renderMenuitem",
value: function renderMenuitem() {
var _this2 = this;
var _this$props$menuitem = this.props.menuitem,
disabled = _this$props$menuitem.disabled,
icon = _this$props$menuitem.icon,
label = _this$props$menuitem.label,
template = _this$props$menuitem.template,
url = _this$props$menuitem.url,
target = _this$props$menuitem.target;
var className = classNames('p-menuitem-link', {
'p-disabled': disabled
});
var iconClassName = classNames('p-menuitem-icon', icon);
icon = icon && /*#__PURE__*/React__default["default"].createElement("span", {
className: iconClassName
});
label = label && /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-menuitem-text"
}, label);
var content = /*#__PURE__*/React__default["default"].createElement("a", {
href: url || '#',
role: "menuitem",
className: className,
target: target,
onClick: this.onClick
}, icon, label);
if (template) {
var defaultContentOptions = {
onClick: function onClick(event) {
return _this2.onClick(event);
},
className: className,
labelClassName: 'p-menuitem-text',
iconClassName: iconClassName,
element: content,
props: this.props
};
content = ObjectUtils.getJSXElement(template, this.props.menuitem, defaultContentOptions);
}
return /*#__PURE__*/React__default["default"].createElement("li", {
className: "p-menuitem",
role: "none"
}, content);
}
}, {
key: "renderItem",
value: function renderItem() {
if (this.props.menuitem.separator) {
return this.renderSeparator();
}
return this.renderMenuitem();
}
}, {
key: "render",
value: function render() {
var item = this.renderItem();
return item;
}
}]);
return SplitButtonItem;
}(React.Component);
_defineProperty(SplitButtonItem, "defaultProps", {
menuitem: null,
onItemClick: null
});
function _createSuper$v(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$v(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$v() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var SplitButtonPanelComponent = /*#__PURE__*/function (_Component) {
_inherits(SplitButtonPanelComponent, _Component);
var _super = _createSuper$v(SplitButtonPanelComponent);
function SplitButtonPanelComponent() {
_classCallCheck(this, SplitButtonPanelComponent);
return _super.apply(this, arguments);
}
_createClass(SplitButtonPanelComponent, [{
key: "renderElement",
value: function renderElement() {
var className = classNames('p-menu p-menu-overlay p-component', this.props.menuClassName);
return /*#__PURE__*/React__default["default"].createElement(CSSTransition, {
nodeRef: this.props.forwardRef,
classNames: "p-connected-overlay",
"in": this.props["in"],
timeout: {
enter: 120,
exit: 100
},
options: this.props.transitionOptions,
unmountOnExit: true,
onEnter: this.props.onEnter,
onEntered: this.props.onEntered,
onExit: this.props.onExit,
onExited: this.props.onExited
}, /*#__PURE__*/React__default["default"].createElement("div", {
ref: this.props.forwardRef,
className: className,
style: this.props.menuStyle,
id: this.props.id,
onClick: this.onClick
}, /*#__PURE__*/React__default["default"].createElement("ul", {
className: "p-menu-list p-reset",
role: "menu"
}, this.props.children)));
}
}, {
key: "render",
value: function render() {
var element = this.renderElement();
return /*#__PURE__*/React__default["default"].createElement(Portal, {
element: element,
appendTo: this.props.appendTo
});
}
}]);
return SplitButtonPanelComponent;
}(React.Component);
_defineProperty(SplitButtonPanelComponent, "defaultProps", {
appendTo: null,
menuStyle: null,
menuClassName: null,
id: null,
onClick: null
});
var SplitButtonPanel = /*#__PURE__*/React__default["default"].forwardRef(function (props, ref) {
return /*#__PURE__*/React__default["default"].createElement(SplitButtonPanelComponent, _extends({
forwardRef: ref
}, props));
});
function ownKeys$c(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$c(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$c(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$c(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createSuper$u(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$u(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$u() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var SplitButton = /*#__PURE__*/function (_Component) {
_inherits(SplitButton, _Component);
var _super = _createSuper$u(SplitButton);
function SplitButton(props) {
var _this;
_classCallCheck(this, SplitButton);
_this = _super.call(this, props);
_this.state = {
id: props.id,
overlayVisible: false
};
_this.onDropdownButtonClick = _this.onDropdownButtonClick.bind(_assertThisInitialized(_this));
_this.onItemClick = _this.onItemClick.bind(_assertThisInitialized(_this));
_this.onOverlayEnter = _this.onOverlayEnter.bind(_assertThisInitialized(_this));
_this.onOverlayEntered = _this.onOverlayEntered.bind(_assertThisInitialized(_this));
_this.onOverlayExit = _this.onOverlayExit.bind(_assertThisInitialized(_this));
_this.onOverlayExited = _this.onOverlayExited.bind(_assertThisInitialized(_this));
_this.onPanelClick = _this.onPanelClick.bind(_assertThisInitialized(_this));
_this.overlayRef = /*#__PURE__*/React__default["default"].createRef();
return _this;
}
_createClass(SplitButton, [{
key: "onPanelClick",
value: function onPanelClick(event) {
OverlayService.emit('overlay-click', {
originalEvent: event,
target: this.container
});
}
}, {
key: "onDropdownButtonClick",
value: function onDropdownButtonClick() {
if (this.state.overlayVisible) this.hide();else this.show();
}
}, {
key: "onItemClick",
value: function onItemClick() {
this.hide();
}
}, {
key: "show",
value: function show() {
this.setState({
overlayVisible: true
});
}
}, {
key: "hide",
value: function hide() {
this.setState({
overlayVisible: false
});
}
}, {
key: "onOverlayEnter",
value: function onOverlayEnter() {
ZIndexUtils.set('overlay', this.overlayRef.current, PrimeReact.autoZIndex, PrimeReact.zIndex['overlay']);
this.alignOverlay();
}
}, {
key: "onOverlayEntered",
value: function onOverlayEntered() {
this.bindDocumentClickListener();
this.bindScrollListener();
this.bindResizeListener();
this.props.onShow && this.props.onShow();
}
}, {
key: "onOverlayExit",
value: function onOverlayExit() {
this.unbindDocumentClickListener();
this.unbindScrollListener();
this.unbindResizeListener();
}
}, {
key: "onOverlayExited",
value: function onOverlayExited() {
ZIndexUtils.clear(this.overlayRef.current);
this.props.onHide && this.props.onHide();
}
}, {
key: "alignOverlay",
value: function alignOverlay() {
DomHandler.alignOverlay(this.overlayRef.current, this.defaultButton.parentElement, this.props.appendTo || PrimeReact.appendTo);
}
}, {
key: "bindDocumentClickListener",
value: function bindDocumentClickListener() {
var _this2 = this;
if (!this.documentClickListener) {
this.documentClickListener = function (event) {
if (_this2.state.overlayVisible && _this2.isOutsideClicked(event)) {
_this2.hide();
}
};
document.addEventListener('click', this.documentClickListener);
}
}
}, {
key: "bindScrollListener",
value: function bindScrollListener() {
var _this3 = this;
if (!this.scrollHandler) {
this.scrollHandler = new ConnectedOverlayScrollHandler(this.container, function () {
if (_this3.state.overlayVisible) {
_this3.hide();
}
});
}
this.scrollHandler.bindScrollListener();
}
}, {
key: "unbindScrollListener",
value: function unbindScrollListener() {
if (this.scrollHandler) {
this.scrollHandler.unbindScrollListener();
}
}
}, {
key: "bindResizeListener",
value: function bindResizeListener() {
var _this4 = this;
if (!this.resizeListener) {
this.resizeListener = function () {
if (_this4.state.overlayVisible && !DomHandler.isTouchDevice()) {
_this4.hide();
}
};
window.addEventListener('resize', this.resizeListener);
}
}
}, {
key: "unbindResizeListener",
value: function unbindResizeListener() {
if (this.resizeListener) {
window.removeEventListener('resize', this.resizeListener);
this.resizeListener = null;
}
}
}, {
key: "isOutsideClicked",
value: function isOutsideClicked(event) {
return this.container && this.overlayRef && this.overlayRef.current && !this.overlayRef.current.contains(event.target);
}
}, {
key: "unbindDocumentClickListener",
value: function unbindDocumentClickListener() {
if (this.documentClickListener) {
document.removeEventListener('click', this.documentClickListener);
this.documentClickListener = null;
}
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
if (!this.state.id) {
this.setState({
id: UniqueComponentId()
});
}
if (this.props.tooltip) {
this.renderTooltip();
}
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps) {
if (prevProps.tooltip !== this.props.tooltip || prevProps.tooltipOptions !== this.props.tooltipOptions) {
if (this.tooltip) this.tooltip.update(_objectSpread$c({
content: this.props.tooltip
}, this.props.tooltipOptions || {}));else this.renderTooltip();
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
this.unbindDocumentClickListener();
this.unbindResizeListener();
if (this.scrollHandler) {
this.scrollHandler.destroy();
this.scrollHandler = null;
}
if (this.tooltip) {
this.tooltip.destroy();
this.tooltip = null;
}
ZIndexUtils.clear(this.overlayRef.current);
}
}, {
key: "renderTooltip",
value: function renderTooltip() {
this.tooltip = tip({
target: this.container,
content: this.props.tooltip,
options: this.props.tooltipOptions
});
}
}, {
key: "renderItems",
value: function renderItems() {
var _this5 = this;
if (this.props.model) {
return this.props.model.map(function (menuitem, index) {
return /*#__PURE__*/React__default["default"].createElement(SplitButtonItem, {
menuitem: menuitem,
key: index,
onItemClick: _this5.onItemClick
});
});
}
return null;
}
}, {
key: "render",
value: function render() {
var _this6 = this;
var className = classNames('p-splitbutton p-component', this.props.className, {
'p-disabled': this.props.disabled
});
var buttonClassName = classNames('p-splitbutton-defaultbutton', this.props.buttonClassName);
var menuButtonClassName = classNames('p-splitbutton-menubutton', this.props.menuButtonClassName);
var items = this.renderItems();
var buttonContent = this.props.buttonTemplate ? ObjectUtils.getJSXElement(this.props.buttonTemplate, this.props) : null;
return /*#__PURE__*/React__default["default"].createElement("div", {
id: this.state.id,
className: className,
style: this.props.style,
ref: function ref(el) {
return _this6.container = el;
}
}, /*#__PURE__*/React__default["default"].createElement(Button, {
ref: function ref(el) {
return _this6.defaultButton = el;
},
type: "button",
className: buttonClassName,
icon: this.props.icon,
label: this.props.label,
onClick: this.props.onClick,
disabled: this.props.disabled,
tabIndex: this.props.tabIndex
}, buttonContent), /*#__PURE__*/React__default["default"].createElement(Button, {
type: "button",
className: menuButtonClassName,
icon: this.props.dropdownIcon,
onClick: this.onDropdownButtonClick,
disabled: this.props.disabled,
"aria-expanded": this.state.overlayVisible,
"aria-haspopup": true,
"aria-owns": this.state.id + '_overlay'
}), /*#__PURE__*/React__default["default"].createElement(SplitButtonPanel, {
ref: this.overlayRef,
appendTo: this.props.appendTo,
id: this.state.id + '_overlay',
menuStyle: this.props.menuStyle,
menuClassName: this.props.menuClassName,
onClick: this.onPanelClick,
"in": this.state.overlayVisible,
onEnter: this.onOverlayEnter,
onEntered: this.onOverlayEntered,
onExit: this.onOverlayExit,
onExited: this.onOverlayExited,
transitionOptions: this.props.transitionOptions
}, items));
}
}]);
return SplitButton;
}(React.Component);
_defineProperty(SplitButton, "defaultProps", {
id: null,
label: null,
icon: null,
model: null,
disabled: null,
style: null,
className: null,
buttonClassName: null,
menuStyle: null,
menuClassName: null,
menuButtonClassName: null,
tabIndex: null,
appendTo: null,
tooltip: null,
tooltipOptions: null,
buttonTemplate: null,
transitionOptions: null,
dropdownIcon: 'pi pi-chevron-down',
onClick: null,
onShow: null,
onHide: null
});
function _createSuper$t(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$t(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$t() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var SplitterPanel = /*#__PURE__*/function (_Component) {
_inherits(SplitterPanel, _Component);
var _super = _createSuper$t(SplitterPanel);
function SplitterPanel() {
_classCallCheck(this, SplitterPanel);
return _super.apply(this, arguments);
}
return _createClass(SplitterPanel);
}(React.Component);
_defineProperty(SplitterPanel, "defaultProps", {
size: null,
minSize: null,
style: null,
className: null
});
var Splitter = /*#__PURE__*/function (_Component2) {
_inherits(Splitter, _Component2);
var _super2 = _createSuper$t(Splitter);
function Splitter() {
_classCallCheck(this, Splitter);
return _super2.apply(this, arguments);
}
_createClass(Splitter, [{
key: "bindMouseListeners",
value: function bindMouseListeners() {
var _this = this;
if (!this.mouseMoveListener) {
this.mouseMoveListener = function (event) {
return _this.onResize(event);
};
document.addEventListener('mousemove', this.mouseMoveListener);
}
if (!this.mouseUpListener) {
this.mouseUpListener = function (event) {
_this.onResizeEnd(event);
_this.unbindMouseListeners();
};
document.addEventListener('mouseup', this.mouseUpListener);
}
}
}, {
key: "validateResize",
value: function validateResize(newPrevPanelSize, newNextPanelSize) {
if (this.props.children[this.prevPanelIndex].props && this.props.children[this.prevPanelIndex].props.minSize && this.props.children[this.prevPanelIndex].props.minSize > newPrevPanelSize) {
return false;
}
if (this.props.children[this.prevPanelIndex + 1].props && this.props.children[this.prevPanelIndex + 1].props.minSize && this.props.children[this.prevPanelIndex + 1].props.minSize > newNextPanelSize) {
return false;
}
return true;
}
}, {
key: "unbindMouseListeners",
value: function unbindMouseListeners() {
if (this.mouseMoveListener) {
document.removeEventListener('mousemove', this.mouseMoveListener);
this.mouseMoveListener = null;
}
if (this.mouseUpListener) {
document.removeEventListener('mouseup', this.mouseUpListener);
this.mouseUpListener = null;
}
}
}, {
key: "clear",
value: function clear() {
this.dragging = false;
this.size = null;
this.startPos = null;
this.prevPanelElement = null;
this.nextPanelElement = null;
this.prevPanelSize = null;
this.nextPanelSize = null;
this.gutterElement = null;
this.prevPanelIndex = null;
}
}, {
key: "isStateful",
value: function isStateful() {
return this.props.stateKey != null;
}
}, {
key: "getStorage",
value: function getStorage() {
switch (this.props.stateStorage) {
case 'local':
return window.localStorage;
case 'session':
return window.sessionStorage;
default:
throw new Error(this.props.stateStorage + ' is not a valid value for the state storage, supported values are "local" and "session".');
}
}
}, {
key: "saveState",
value: function saveState() {
this.getStorage().setItem(this.props.stateKey, JSON.stringify(this.panelSizes));
}
}, {
key: "restoreState",
value: function restoreState() {
var _this2 = this;
var storage = this.getStorage();
var stateString = storage.getItem(this.props.stateKey);
if (stateString) {
this.panelSizes = JSON.parse(stateString);
var children = _toConsumableArray(this.container.children).filter(function (child) {
return DomHandler.hasClass(child, 'p-splitter-panel');
});
children.forEach(function (child, i) {
child.style.flexBasis = 'calc(' + _this2.panelSizes[i] + '% - ' + (_this2.props.children.length - 1) * _this2.props.gutterSize + 'px)';
});
return true;
}
return false;
}
}, {
key: "onResizeStart",
value: function onResizeStart(event, index) {
var pageX = event.type === 'touchstart' ? event.touches[0].pageX : event.pageX;
var pageY = event.type === 'touchstart' ? event.touches[0].pageY : event.pageY;
this.gutterElement = event.currentTarget;
this.size = this.props.layout === 'horizontal' ? DomHandler.getWidth(this.container) : DomHandler.getHeight(this.container);
this.dragging = true;
this.startPos = this.props.layout === 'horizontal' ? pageX : pageY;
this.prevPanelElement = this.gutterElement.previousElementSibling;
this.nextPanelElement = this.gutterElement.nextElementSibling;
this.prevPanelSize = 100 * (this.props.layout === 'horizontal' ? DomHandler.getOuterWidth(this.prevPanelElement, true) : DomHandler.getOuterHeight(this.prevPanelElement, true)) / this.size;
this.nextPanelSize = 100 * (this.props.layout === 'horizontal' ? DomHandler.getOuterWidth(this.nextPanelElement, true) : DomHandler.getOuterHeight(this.nextPanelElement, true)) / this.size;
this.prevPanelIndex = index;
DomHandler.addClass(this.gutterElement, 'p-splitter-gutter-resizing');
DomHandler.addClass(this.container, 'p-splitter-resizing');
}
}, {
key: "onResize",
value: function onResize(event) {
var newPos;
var pageX = event.type === 'touchmove' ? event.touches[0].pageX : event.pageX;
var pageY = event.type === 'touchmove' ? event.touches[0].pageY : event.pageY;
if (this.props.layout === 'horizontal') newPos = pageX * 100 / this.size - this.startPos * 100 / this.size;else newPos = pageY * 100 / this.size - this.startPos * 100 / this.size;
var newPrevPanelSize = this.prevPanelSize + newPos;
var newNextPanelSize = this.nextPanelSize - newPos;
if (this.validateResize(newPrevPanelSize, newNextPanelSize)) {
this.prevPanelElement.style.flexBasis = 'calc(' + newPrevPanelSize + '% - ' + (this.props.children.length - 1) * this.props.gutterSize + 'px)';
this.nextPanelElement.style.flexBasis = 'calc(' + newNextPanelSize + '% - ' + (this.props.children.length - 1) * this.props.gutterSize + 'px)';
this.panelSizes[this.prevPanelIndex] = newPrevPanelSize;
this.panelSizes[this.prevPanelIndex + 1] = newNextPanelSize;
}
}
}, {
key: "onResizeEnd",
value: function onResizeEnd(event) {
if (this.isStateful()) {
this.saveState();
}
if (this.props.onResizeEnd) {
this.props.onResizeEnd({
originalEvent: event,
sizes: this.panelSizes
});
}
DomHandler.removeClass(this.gutterElement, 'p-splitter-gutter-resizing');
DomHandler.removeClass(this.container, 'p-splitter-resizing');
this.clear();
}
}, {
key: "onGutterMouseDown",
value: function onGutterMouseDown(event, index) {
this.onResizeStart(event, index);
this.bindMouseListeners();
}
}, {
key: "onGutterTouchStart",
value: function onGutterTouchStart(event, index) {
this.onResizeStart(event, index);
this.windowTouchMoveListener = this.onGutterTouchMove.bind(this);
this.windowTouchEndListener = this.onGutterTouchEnd.bind(this);
window.addEventListener('touchmove', this.windowTouchMoveListener, {
passive: false,
cancelable: false
});
window.addEventListener('touchend', this.windowTouchEndListener);
}
}, {
key: "onGutterTouchMove",
value: function onGutterTouchMove(event) {
this.onResize(event);
}
}, {
key: "onGutterTouchEnd",
value: function onGutterTouchEnd(event) {
this.onResizeEnd(event);
window.removeEventListener('touchmove', this.windowTouchMoveListener);
window.removeEventListener('touchend', this.windowTouchEndListener);
this.windowTouchMoveListener = null;
this.windowTouchEndListener = null;
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
var _this3 = this;
if (this.panelElement) {
if (this.panelElement.childNodes && ObjectUtils.isNotEmpty(DomHandler.find(this.panelElement, '.p-splitter'))) {
DomHandler.addClass(this.panelElement, 'p-splitter-panel-nested');
}
}
if (this.props.children && this.props.children.length) {
var initialized = false;
if (this.isStateful()) {
initialized = this.restoreState();
}
if (!initialized) {
var children = _toConsumableArray(this.container.children).filter(function (child) {
return DomHandler.hasClass(child, 'p-splitter-panel');
});
var _panelSizes = [];
this.props.children.map(function (panel, i) {
var panelInitialSize = panel.props && panel.props.size ? panel.props.size : null;
var panelSize = panelInitialSize || 100 / _this3.props.children.length;
_panelSizes[i] = panelSize;
children[i].style.flexBasis = 'calc(' + panelSize + '% - ' + (_this3.props.children.length - 1) * _this3.props.gutterSize + 'px)';
return _panelSizes;
});
this.panelSizes = _panelSizes;
}
}
}
}, {
key: "renderPanel",
value: function renderPanel(panel, index) {
var _this4 = this;
var panelClassName = classNames('p-splitter-panel', panel.props.className);
var gutterStyle = this.props.layout === 'horizontal' ? {
width: this.props.gutterSize + 'px'
} : {
height: this.props.gutterSize + 'px'
};
var gutter = index !== this.props.children.length - 1 && /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this4.gutterElement = el;
},
className: 'p-splitter-gutter',
style: gutterStyle,
onMouseDown: function onMouseDown(event) {
return _this4.onGutterMouseDown(event, index);
},
onTouchStart: function onTouchStart(event) {
return _this4.onGutterTouchStart(event, index);
},
onTouchMove: function onTouchMove(event) {
return _this4.onGutterTouchMove(event);
},
onTouchEnd: function onTouchEnd(event) {
return _this4.onGutterTouchEnd(event);
}
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-splitter-gutter-handle"
}));
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this4.panelElement = el;
},
key: index,
className: panelClassName,
style: panel.props.style
}, panel.props.children), gutter);
}
}, {
key: "renderPanels",
value: function renderPanels() {
var _this5 = this;
return React__default["default"].Children.map(this.props.children, function (panel, index) {
return _this5.renderPanel(panel, index);
});
}
}, {
key: "render",
value: function render() {
var _this6 = this;
var className = classNames("p-splitter p-component p-splitter-".concat(this.props.layout), this.props.className);
var panels = this.renderPanels();
return /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this6.container = el;
},
id: this.props.id,
className: className,
style: this.props.style
}, panels);
}
}]);
return Splitter;
}(React.Component);
_defineProperty(Splitter, "defaultProps", {
id: null,
className: null,
style: null,
layout: 'horizontal',
gutterSize: 4,
stateKey: null,
stateStorage: 'session',
onResizeEnd: null
});
function _createSuper$s(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$s(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$s() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var Steps = /*#__PURE__*/function (_Component) {
_inherits(Steps, _Component);
var _super = _createSuper$s(Steps);
function Steps() {
_classCallCheck(this, Steps);
return _super.apply(this, arguments);
}
_createClass(Steps, [{
key: "itemClick",
value: function itemClick(event, item, index) {
if (this.props.readOnly || item.disabled) {
event.preventDefault();
return;
}
if (this.props.onSelect) {
this.props.onSelect({
originalEvent: event,
item: item,
index: index
});
}
if (!item.url) {
event.preventDefault();
}
if (item.command) {
item.command({
originalEvent: event,
item: item,
index: index
});
}
}
}, {
key: "renderItem",
value: function renderItem(item, index) {
var _this = this;
var active = index === this.props.activeIndex;
var disabled = item.disabled || index !== this.props.activeIndex && this.props.readOnly;
var className = classNames('p-steps-item', item.className, {
'p-highlight p-steps-current': active,
'p-disabled': disabled
});
var label = item.label && /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-steps-title"
}, item.label);
var tabIndex = disabled ? -1 : '';
var content = /*#__PURE__*/React__default["default"].createElement("a", {
href: item.url || '#',
className: "p-menuitem-link",
role: "presentation",
target: item.target,
onClick: function onClick(event) {
return _this.itemClick(event, item, index);
},
tabIndex: tabIndex,
"aria-disabled": disabled
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-steps-number"
}, index + 1), label);
if (item.template) {
var defaultContentOptions = {
onClick: function onClick(event) {
return _this.itemClick(event, item, index);
},
className: 'p-menuitem-link',
labelClassName: 'p-steps-title',
numberClassName: 'p-steps-number',
element: content,
props: this.props,
tabIndex: tabIndex,
active: active,
disabled: disabled
};
content = ObjectUtils.getJSXElement(item.template, item, defaultContentOptions);
}
return /*#__PURE__*/React__default["default"].createElement("li", {
key: item.label + '_' + index,
className: className,
style: item.style,
role: "tab",
"aria-selected": active,
"aria-expanded": active
}, content);
}
}, {
key: "renderItems",
value: function renderItems() {
var _this2 = this;
if (this.props.model) {
var items = this.props.model.map(function (item, index) {
return _this2.renderItem(item, index);
});
return /*#__PURE__*/React__default["default"].createElement("ul", {
role: "tablist"
}, items);
}
return null;
}
}, {
key: "render",
value: function render() {
var className = classNames('p-steps p-component', this.props.className, {
'p-readonly': this.props.readOnly
});
var items = this.renderItems();
return /*#__PURE__*/React__default["default"].createElement("div", {
id: this.props.id,
className: className,
style: this.props.style
}, items);
}
}]);
return Steps;
}(React.Component);
_defineProperty(Steps, "defaultProps", {
id: null,
model: null,
activeIndex: 0,
readOnly: true,
style: null,
className: null,
onSelect: null
});
function _createSuper$r(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$r(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$r() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var TabMenu = /*#__PURE__*/function (_Component) {
_inherits(TabMenu, _Component);
var _super = _createSuper$r(TabMenu);
function TabMenu(props) {
var _this;
_classCallCheck(this, TabMenu);
_this = _super.call(this, props);
if (!_this.props.onTabChange) {
_this.state = {
activeIndex: props.activeIndex
};
}
return _this;
}
_createClass(TabMenu, [{
key: "itemClick",
value: function itemClick(event, item, index) {
if (item.disabled) {
event.preventDefault();
return;
}
if (!item.url) {
event.preventDefault();
}
if (item.command) {
item.command({
originalEvent: event,
item: item
});
}
if (this.props.onTabChange) {
this.props.onTabChange({
originalEvent: event,
value: item,
index: index
});
} else {
this.setState({
activeIndex: index
});
}
}
}, {
key: "getActiveIndex",
value: function getActiveIndex() {
return this.props.onTabChange ? this.props.activeIndex : this.state.activeIndex;
}
}, {
key: "isSelected",
value: function isSelected(index) {
return index === (this.getActiveIndex() || 0);
}
}, {
key: "updateInkBar",
value: function updateInkBar() {
var activeIndex = this.getActiveIndex();
var tabHeader = this["tab_".concat(activeIndex)];
this.inkbar.style.width = DomHandler.getWidth(tabHeader) + 'px';
this.inkbar.style.left = DomHandler.getOffset(tabHeader).left - DomHandler.getOffset(this.nav).left + 'px';
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
this.updateInkBar();
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate() {
this.updateInkBar();
}
}, {
key: "renderMenuItem",
value: function renderMenuItem(item, index) {
var _this2 = this;
var active = this.isSelected(index);
var className = classNames('p-tabmenuitem', {
'p-highlight': active,
'p-disabled': item.disabled
}, item.className);
var iconClassName = classNames('p-menuitem-icon', item.icon);
var icon = item.icon && /*#__PURE__*/React__default["default"].createElement("span", {
className: iconClassName
});
var label = item.label && /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-menuitem-text"
}, item.label);
var content = /*#__PURE__*/React__default["default"].createElement("a", {
href: item.url || '#',
className: "p-menuitem-link",
target: item.target,
onClick: function onClick(event) {
return _this2.itemClick(event, item, index);
},
role: "presentation"
}, icon, label, /*#__PURE__*/React__default["default"].createElement(Ripple, null));
if (item.template) {
var defaultContentOptions = {
onClick: function onClick(event) {
return _this2.itemClick(event, item);
},
className: 'p-menuitem-link',
labelClassName: 'p-menuitem-text',
iconClassName: iconClassName,
element: content,
props: this.props,
active: active,
index: index
};
content = ObjectUtils.getJSXElement(item.template, item, defaultContentOptions);
}
return /*#__PURE__*/React__default["default"].createElement("li", {
ref: function ref(el) {
return _this2["tab_".concat(index)] = el;
},
key: item.label + '_' + index,
className: className,
style: item.style,
role: "tab",
"aria-selected": active,
"aria-expanded": active,
"aria-disabled": item.disabled
}, content);
}
}, {
key: "renderItems",
value: function renderItems() {
var _this3 = this;
return this.props.model.map(function (item, index) {
return _this3.renderMenuItem(item, index);
});
}
}, {
key: "render",
value: function render() {
var _this4 = this;
if (this.props.model) {
var className = classNames('p-tabmenu p-component', this.props.className);
var items = this.renderItems();
return /*#__PURE__*/React__default["default"].createElement("div", {
id: this.props.id,
className: className,
style: this.props.style
}, /*#__PURE__*/React__default["default"].createElement("ul", {
ref: function ref(el) {
return _this4.nav = el;
},
className: "p-tabmenu-nav p-reset",
role: "tablist"
}, items, /*#__PURE__*/React__default["default"].createElement("li", {
ref: function ref(el) {
return _this4.inkbar = el;
},
className: "p-tabmenu-ink-bar"
})));
}
return null;
}
}]);
return TabMenu;
}(React.Component);
_defineProperty(TabMenu, "defaultProps", {
id: null,
model: null,
activeIndex: 0,
style: null,
className: null,
onTabChange: null
});
function ownKeys$b(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$b(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$b(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$b(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createSuper$q(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$q(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$q() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var TabPanel = /*#__PURE__*/function (_Component) {
_inherits(TabPanel, _Component);
var _super = _createSuper$q(TabPanel);
function TabPanel() {
_classCallCheck(this, TabPanel);
return _super.apply(this, arguments);
}
return _createClass(TabPanel);
}(React.Component);
_defineProperty(TabPanel, "defaultProps", {
header: null,
headerTemplate: null,
leftIcon: null,
rightIcon: null,
closable: false,
disabled: false,
style: null,
className: null,
headerStyle: null,
headerClassName: null,
contentStyle: null,
contentClassName: null
});
var TabView = /*#__PURE__*/function (_Component2) {
_inherits(TabView, _Component2);
var _super2 = _createSuper$q(TabView);
function TabView(props) {
var _this;
_classCallCheck(this, TabView);
_this = _super2.call(this, props);
var state = {
id: props.id,
backwardIsDisabled: true,
forwardIsDisabled: false,
hiddenTabs: []
};
if (!_this.props.onTabChange) {
state = _objectSpread$b(_objectSpread$b({}, state), {}, {
activeIndex: props.activeIndex
});
}
_this.state = state;
_this.navBackward = _this.navBackward.bind(_assertThisInitialized(_this));
_this.navForward = _this.navForward.bind(_assertThisInitialized(_this));
_this.onScroll = _this.onScroll.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(TabView, [{
key: "getActiveIndex",
value: function getActiveIndex() {
return this.props.onTabChange ? this.props.activeIndex : this.state.activeIndex;
}
}, {
key: "isSelected",
value: function isSelected(index) {
return index === this.getActiveIndex();
}
}, {
key: "shouldTabRender",
value: function shouldTabRender(tab, index) {
return tab && tab.type === TabPanel && this.state.hiddenTabs.every(function (_i) {
return _i !== index;
});
}
}, {
key: "findVisibleActiveTab",
value: function findVisibleActiveTab(i) {
var _this2 = this;
var tabsInfo = React__default["default"].Children.map(this.props.children, function (tab, index) {
if (_this2.shouldTabRender(tab, index)) {
return {
tab: tab,
index: index
};
}
});
return tabsInfo.find(function (_ref) {
var tab = _ref.tab,
index = _ref.index;
return !tab.props.disabled && index >= i;
}) || tabsInfo.reverse().find(function (_ref2) {
var tab = _ref2.tab,
index = _ref2.index;
return !tab.props.disabled && i > index;
});
}
}, {
key: "onTabHeaderClose",
value: function onTabHeaderClose(event, index) {
var _this3 = this;
var hiddenTabs = [].concat(_toConsumableArray(this.state.hiddenTabs), [index]);
this.setState({
hiddenTabs: hiddenTabs
}, function () {
var tabInfo = _this3.findVisibleActiveTab(index);
tabInfo && _this3.onTabHeaderClick(event, tabInfo.tab, tabInfo.index);
});
if (this.props.onTabClose) {
this.props.onTabClose({
originalEvent: event,
index: index
});
}
event.preventDefault();
}
}, {
key: "onTabHeaderClick",
value: function onTabHeaderClick(event, tab, index) {
if (!tab.props.disabled) {
if (this.props.onTabChange) {
this.props.onTabChange({
originalEvent: event,
index: index
});
} else {
this.setState({
activeIndex: index
});
}
}
this.updateScrollBar(index);
event.preventDefault();
}
}, {
key: "onKeyDown",
value: function onKeyDown(event, tab, index) {
if (event.code === 'Enter') {
this.onTabHeaderClick(event, tab, index);
}
}
}, {
key: "updateInkBar",
value: function updateInkBar() {
var activeIndex = this.getActiveIndex();
var tabHeader = this["tab_".concat(activeIndex)];
this.inkbar.style.width = DomHandler.getWidth(tabHeader) + 'px';
this.inkbar.style.left = DomHandler.getOffset(tabHeader).left - DomHandler.getOffset(this.nav).left + 'px';
}
}, {
key: "updateScrollBar",
value: function updateScrollBar(index) {
var tabHeader = this["tab_".concat(index)];
if (tabHeader) {
tabHeader.scrollIntoView({
block: 'nearest'
});
}
}
}, {
key: "updateButtonState",
value: function updateButtonState() {
var content = this.content;
var scrollLeft = content.scrollLeft,
scrollWidth = content.scrollWidth;
var width = DomHandler.getWidth(content);
this.setState({
backwardIsDisabled: scrollLeft === 0
});
this.setState({
forwardIsDisabled: scrollLeft === scrollWidth - width
});
}
}, {
key: "onScroll",
value: function onScroll(event) {
this.props.scrollable && this.updateButtonState();
event.preventDefault();
}
}, {
key: "getVisibleButtonWidths",
value: function getVisibleButtonWidths() {
var prevBtn = this.prevBtn;
var nextBtn = this.nextBtn;
return [prevBtn, nextBtn].reduce(function (acc, el) {
return el ? acc + DomHandler.getWidth(el) : acc;
}, 0);
}
}, {
key: "navBackward",
value: function navBackward() {
var content = this.content;
var width = DomHandler.getWidth(content) - this.getVisibleButtonWidths();
var pos = content.scrollLeft - width;
content.scrollLeft = pos <= 0 ? 0 : pos;
}
}, {
key: "navForward",
value: function navForward() {
var content = this.content;
var width = DomHandler.getWidth(content) - this.getVisibleButtonWidths();
var pos = content.scrollLeft + width;
var lastPos = content.scrollWidth - width;
content.scrollLeft = pos >= lastPos ? lastPos : pos;
}
}, {
key: "reset",
value: function reset() {
var state = {
backwardIsDisabled: true,
forwardIsDisabled: false,
hiddenTabs: []
};
if (this.props.onTabChange) {
this.props.onTabChange({
index: this.props.activeIndex
});
} else {
state = _objectSpread$b(_objectSpread$b({}, state), {}, {
activeIndex: this.props.activeIndex
});
}
this.setState(state);
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
if (!this.state.id) {
this.setState({
id: UniqueComponentId()
});
}
this.updateInkBar();
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps) {
this.updateInkBar();
if (prevProps.activeIndex !== this.props.activeIndex) {
this.updateScrollBar(this.props.activeIndex);
}
}
}, {
key: "renderTabHeader",
value: function renderTabHeader(tab, index) {
var _this4 = this;
var selected = this.isSelected(index);
var style = _objectSpread$b(_objectSpread$b({}, tab.props.headerStyle || {}), tab.props.style || {});
var className = classNames('p-unselectable-text', {
'p-tabview-selected p-highlight': selected,
'p-disabled': tab.props.disabled
}, tab.props.headerClassName, tab.props.className);
var id = this.state.id + '_header_' + index;
var ariaControls = this.state.id + '_content_' + index;
var tabIndex = tab.props.disabled ? null : 0;
var leftIconElement = tab.props.leftIcon && /*#__PURE__*/React__default["default"].createElement("i", {
className: tab.props.leftIcon
});
var titleElement = /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-tabview-title"
}, tab.props.header);
var rightIconElement = tab.props.rightIcon && /*#__PURE__*/React__default["default"].createElement("i", {
className: tab.props.rightIcon
});
var closableIconElement = tab.props.closable && /*#__PURE__*/React__default["default"].createElement("i", {
className: "p-tabview-close pi pi-times",
onClick: function onClick(e) {
return _this4.onTabHeaderClose(e, index);
}
});
var content =
/*#__PURE__*/
/* eslint-disable */
React__default["default"].createElement("a", {
role: "tab",
className: "p-tabview-nav-link",
onClick: function onClick(event) {
return _this4.onTabHeaderClick(event, tab, index);
},
id: id,
onKeyDown: function onKeyDown(event) {
return _this4.onKeyDown(event, tab, index);
},
"aria-controls": ariaControls,
"aria-selected": selected,
tabIndex: tabIndex
}, leftIconElement, titleElement, rightIconElement, closableIconElement, /*#__PURE__*/React__default["default"].createElement(Ripple, null))
/* eslint-enable */
;
if (tab.props.headerTemplate) {
var defaultContentOptions = {
className: 'p-tabview-nav-link',
titleClassName: 'p-tabview-title',
onClick: function onClick(event) {
return _this4.onTabHeaderClick(event, tab, index);
},
onKeyDown: function onKeyDown(event) {
return _this4.onKeyDown(event, tab, index);
},
leftIconElement: leftIconElement,
titleElement: titleElement,
rightIconElement: rightIconElement,
element: content,
props: this.props,
index: index,
selected: selected,
ariaControls: ariaControls
};
content = ObjectUtils.getJSXElement(tab.props.headerTemplate, defaultContentOptions);
}
return /*#__PURE__*/React__default["default"].createElement("li", {
ref: function ref(el) {
return _this4["tab_".concat(index)] = el;
},
className: className,
style: style,
role: "presentation"
}, content);
}
}, {
key: "renderTabHeaders",
value: function renderTabHeaders() {
var _this5 = this;
return React__default["default"].Children.map(this.props.children, function (tab, index) {
if (_this5.shouldTabRender(tab, index)) {
return _this5.renderTabHeader(tab, index);
}
});
}
}, {
key: "renderNavigator",
value: function renderNavigator() {
var _this6 = this;
var headers = this.renderTabHeaders();
return /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this6.content = el;
},
id: this.props.id,
className: "p-tabview-nav-content",
style: this.props.style,
onScroll: this.onScroll
}, /*#__PURE__*/React__default["default"].createElement("ul", {
ref: function ref(el) {
return _this6.nav = el;
},
className: "p-tabview-nav",
role: "tablist"
}, headers, /*#__PURE__*/React__default["default"].createElement("li", {
ref: function ref(el) {
return _this6.inkbar = el;
},
className: "p-tabview-ink-bar"
})));
}
}, {
key: "renderContent",
value: function renderContent() {
var _this7 = this;
var contents = React__default["default"].Children.map(this.props.children, function (tab, index) {
if (_this7.shouldTabRender(tab, index) && (!_this7.props.renderActiveOnly || _this7.isSelected(index))) {
return _this7.createContent(tab, index);
}
});
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-tabview-panels"
}, contents);
}
}, {
key: "createContent",
value: function createContent(tab, index) {
var selected = this.isSelected(index);
var style = _objectSpread$b(_objectSpread$b({}, tab.props.contentStyle || {}), tab.props.style || {});
var className = classNames(tab.props.contentClassName, tab.props.className, 'p-tabview-panel', {
'p-hidden': !selected
});
var id = this.state.id + '_content_' + index;
var ariaLabelledBy = this.state.id + '_header_' + index;
return /*#__PURE__*/React__default["default"].createElement("div", {
id: id,
"aria-labelledby": ariaLabelledBy,
"aria-hidden": !selected,
className: className,
style: style,
role: "tabpanel"
}, !this.props.renderActiveOnly ? tab.props.children : selected && tab.props.children);
}
}, {
key: "renderPrevButton",
value: function renderPrevButton() {
var _this8 = this;
if (this.props.scrollable && !this.state.backwardIsDisabled) {
return /*#__PURE__*/React__default["default"].createElement("button", {
ref: function ref(el) {
return _this8.prevBtn = el;
},
className: "p-tabview-nav-prev p-tabview-nav-btn p-link",
onClick: this.navBackward,
type: "button"
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: "pi pi-chevron-left"
}), /*#__PURE__*/React__default["default"].createElement(Ripple, null));
}
return null;
}
}, {
key: "renderNextButton",
value: function renderNextButton() {
var _this9 = this;
if (this.props.scrollable && !this.state.forwardIsDisabled) {
return /*#__PURE__*/React__default["default"].createElement("button", {
ref: function ref(el) {
return _this9.nextBtn = el;
},
className: "p-tabview-nav-next p-tabview-nav-btn p-link",
onClick: this.navForward,
type: "button"
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: "pi pi-chevron-right"
}), /*#__PURE__*/React__default["default"].createElement(Ripple, null));
}
}
}, {
key: "render",
value: function render() {
var className = classNames('p-tabview p-component', this.props.className, {
'p-tabview-scrollable': this.props.scrollable
});
var navigator = this.renderNavigator();
var content = this.renderContent();
var prevButton = this.renderPrevButton();
var nextButton = this.renderNextButton();
return /*#__PURE__*/React__default["default"].createElement("div", {
className: className
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-tabview-nav-container"
}, prevButton, navigator, nextButton), content);
}
}]);
return TabView;
}(React.Component);
_defineProperty(TabView, "defaultProps", {
id: null,
activeIndex: 0,
style: null,
className: null,
renderActiveOnly: true,
onTabChange: null,
onTabClose: null,
scrollable: false
});
function _createSuper$p(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$p(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$p() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var Tag = /*#__PURE__*/function (_Component) {
_inherits(Tag, _Component);
var _super = _createSuper$p(Tag);
function Tag() {
_classCallCheck(this, Tag);
return _super.apply(this, arguments);
}
_createClass(Tag, [{
key: "render",
value: function render() {
var tagClassName = classNames('p-tag p-component', {
'p-tag-info': this.props.severity === 'info',
'p-tag-success': this.props.severity === 'success',
'p-tag-warning': this.props.severity === 'warning',
'p-tag-danger': this.props.severity === 'danger',
'p-tag-rounded': this.props.rounded
}, this.props.className);
return /*#__PURE__*/React__default["default"].createElement("span", {
className: tagClassName,
style: this.props.style
}, IconUtils.getJSXIcon(this.props.icon, {
className: 'p-tag-icon'
}, {
props: this.props
}), /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-tag-value"
}, this.props.value), /*#__PURE__*/React__default["default"].createElement("span", null, this.props.children));
}
}]);
return Tag;
}(React.Component);
_defineProperty(Tag, "defaultProps", {
value: null,
severity: null,
rounded: false,
icon: null,
style: null,
className: null
});
function _createSuper$o(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$o(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$o() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var TieredMenuSub = /*#__PURE__*/function (_Component) {
_inherits(TieredMenuSub, _Component);
var _super = _createSuper$o(TieredMenuSub);
function TieredMenuSub(props) {
var _this;
_classCallCheck(this, TieredMenuSub);
_this = _super.call(this, props);
_this.state = {
activeItem: null
};
_this.onLeafClick = _this.onLeafClick.bind(_assertThisInitialized(_this));
_this.onChildItemKeyDown = _this.onChildItemKeyDown.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(TieredMenuSub, [{
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps) {
if (prevProps.parentActive && !this.props.parentActive) {
this.setState({
activeItem: null
});
}
if (this.props.parentActive && !this.props.root) {
this.position();
}
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
var _this2 = this;
if (!this.documentClickListener) {
this.documentClickListener = function (event) {
if (_this2.element && !_this2.element.contains(event.target)) {
_this2.setState({
activeItem: null
});
}
};
document.addEventListener('click', this.documentClickListener);
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
if (this.documentClickListener) {
document.removeEventListener('click', this.documentClickListener);
this.documentClickListener = null;
}
}
}, {
key: "position",
value: function position() {
if (this.element) {
var parentItem = this.element.parentElement;
var containerOffset = DomHandler.getOffset(parentItem);
var viewport = DomHandler.getViewport();
var sublistWidth = this.element.offsetParent ? this.element.offsetWidth : DomHandler.getHiddenElementOuterWidth(this.element);
var itemOuterWidth = DomHandler.getOuterWidth(parentItem.children[0]);
if (parseInt(containerOffset.left, 10) + itemOuterWidth + sublistWidth > viewport.width - DomHandler.calculateScrollbarWidth()) {
DomHandler.addClass(this.element, 'p-submenu-list-flipped');
}
}
}
}, {
key: "onItemMouseEnter",
value: function onItemMouseEnter(event, item) {
if (item.disabled) {
event.preventDefault();
return;
}
if (this.props.root) {
if (this.state.activeItem || this.props.popup) {
this.setState({
activeItem: item
});
}
} else {
this.setState({
activeItem: item
});
}
}
}, {
key: "onItemClick",
value: function onItemClick(event, item) {
if (item.disabled) {
event.preventDefault();
return;
}
if (!item.url) {
event.preventDefault();
}
if (item.command) {
item.command({
originalEvent: event,
item: item
});
}
if (this.props.root) {
if (item.items) {
if (this.state.activeItem && item === this.state.activeItem) {
this.setState({
activeItem: null
});
} else {
this.setState({
activeItem: item
});
}
}
}
if (!item.items) {
this.onLeafClick();
}
}
}, {
key: "onItemKeyDown",
value: function onItemKeyDown(event, item) {
var listItem = event.currentTarget.parentElement;
switch (event.which) {
//down
case 40:
var nextItem = this.findNextItem(listItem);
if (nextItem) {
nextItem.children[0].focus();
}
event.preventDefault();
break;
//up
case 38:
var prevItem = this.findPrevItem(listItem);
if (prevItem) {
prevItem.children[0].focus();
}
event.preventDefault();
break;
//right
case 39:
if (item.items) {
this.setState({
activeItem: item
});
setTimeout(function () {
listItem.children[1].children[0].children[0].focus();
}, 50);
}
event.preventDefault();
break;
}
if (this.props.onKeyDown) {
this.props.onKeyDown(event, listItem);
}
}
}, {
key: "onChildItemKeyDown",
value: function onChildItemKeyDown(event, childListItem) {
//left
if (event.which === 37) {
this.setState({
activeItem: null
});
childListItem.parentElement.previousElementSibling.focus();
}
}
}, {
key: "findNextItem",
value: function findNextItem(item) {
var nextItem = item.nextElementSibling;
if (nextItem) return DomHandler.hasClass(nextItem, 'p-disabled') || !DomHandler.hasClass(nextItem, 'p-menuitem') ? this.findNextItem(nextItem) : nextItem;else return null;
}
}, {
key: "findPrevItem",
value: function findPrevItem(item) {
var prevItem = item.previousElementSibling;
if (prevItem) return DomHandler.hasClass(prevItem, 'p-disabled') || !DomHandler.hasClass(prevItem, 'p-menuitem') ? this.findPrevItem(prevItem) : prevItem;else return null;
}
}, {
key: "onLeafClick",
value: function onLeafClick() {
this.setState({
activeItem: null
});
if (this.props.onLeafClick) {
this.props.onLeafClick();
}
}
}, {
key: "renderSeparator",
value: function renderSeparator(index) {
return /*#__PURE__*/React__default["default"].createElement("li", {
key: 'separator_' + index,
className: "p-menu-separator",
role: "separator"
});
}
}, {
key: "renderSubmenu",
value: function renderSubmenu(item) {
if (item.items) {
return /*#__PURE__*/React__default["default"].createElement(TieredMenuSub, {
model: item.items,
onLeafClick: this.onLeafClick,
popup: this.props.popup,
onKeyDown: this.onChildItemKeyDown,
parentActive: item === this.state.activeItem
});
}
return null;
}
}, {
key: "renderMenuitem",
value: function renderMenuitem(item, index) {
var _this3 = this;
var active = this.state.activeItem === item;
var className = classNames('p-menuitem', {
'p-menuitem-active': active
}, item.className);
var linkClassName = classNames('p-menuitem-link', {
'p-disabled': item.disabled
});
var iconClassName = classNames('p-menuitem-icon', item.icon);
var submenuIconClassName = 'p-submenu-icon pi pi-angle-right';
var icon = item.icon && /*#__PURE__*/React__default["default"].createElement("span", {
className: iconClassName
});
var label = item.label && /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-menuitem-text"
}, item.label);
var submenuIcon = item.items && /*#__PURE__*/React__default["default"].createElement("span", {
className: submenuIconClassName
});
var submenu = this.renderSubmenu(item);
var content = /*#__PURE__*/React__default["default"].createElement("a", {
href: item.url || '#',
className: linkClassName,
target: item.target,
role: "menuitem",
"aria-haspopup": item.items != null,
onClick: function onClick(event) {
return _this3.onItemClick(event, item);
},
onKeyDown: function onKeyDown(event) {
return _this3.onItemKeyDown(event, item);
},
"aria-disabled": item.disabled
}, icon, label, submenuIcon, /*#__PURE__*/React__default["default"].createElement(Ripple, null));
if (item.template) {
var defaultContentOptions = {
onClick: function onClick(event) {
return _this3.onItemClick(event, item);
},
onKeyDown: function onKeyDown(event) {
return _this3.onItemKeyDown(event, item);
},
className: linkClassName,
labelClassName: 'p-menuitem-text',
iconClassName: iconClassName,
submenuIconClassName: submenuIconClassName,
element: content,
props: this.props,
active: active
};
content = ObjectUtils.getJSXElement(item.template, item, defaultContentOptions);
}
return /*#__PURE__*/React__default["default"].createElement("li", {
key: item.label + '_' + index,
className: className,
style: item.style,
onMouseEnter: function onMouseEnter(event) {
return _this3.onItemMouseEnter(event, item);
},
role: "none"
}, content, submenu);
}
}, {
key: "renderItem",
value: function renderItem(item, index) {
if (item.separator) return this.renderSeparator(index);else return this.renderMenuitem(item, index);
}
}, {
key: "renderMenu",
value: function renderMenu() {
var _this4 = this;
if (this.props.model) {
return this.props.model.map(function (item, index) {
return _this4.renderItem(item, index);
});
}
return null;
}
}, {
key: "render",
value: function render() {
var _this5 = this;
var className = classNames({
'p-submenu-list': !this.props.root
});
var submenu = this.renderMenu();
return /*#__PURE__*/React__default["default"].createElement("ul", {
ref: function ref(el) {
return _this5.element = el;
},
className: className,
role: this.props.root ? 'menubar' : 'menu',
"aria-orientation": "horizontal"
}, submenu);
}
}]);
return TieredMenuSub;
}(React.Component);
_defineProperty(TieredMenuSub, "defaultProps", {
model: null,
root: false,
className: null,
popup: false,
onLeafClick: null,
onKeyDown: null,
parentActive: false
});
function _createSuper$n(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$n(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$n() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var TieredMenu = /*#__PURE__*/function (_Component) {
_inherits(TieredMenu, _Component);
var _super = _createSuper$n(TieredMenu);
function TieredMenu(props) {
var _this;
_classCallCheck(this, TieredMenu);
_this = _super.call(this, props);
_this.state = {
visible: !props.popup
};
_this.onEnter = _this.onEnter.bind(_assertThisInitialized(_this));
_this.onEntered = _this.onEntered.bind(_assertThisInitialized(_this));
_this.onExit = _this.onExit.bind(_assertThisInitialized(_this));
_this.onExited = _this.onExited.bind(_assertThisInitialized(_this));
_this.onPanelClick = _this.onPanelClick.bind(_assertThisInitialized(_this));
_this.menuRef = /*#__PURE__*/React__default["default"].createRef();
return _this;
}
_createClass(TieredMenu, [{
key: "onPanelClick",
value: function onPanelClick(event) {
if (this.props.popup) {
OverlayService.emit('overlay-click', {
originalEvent: event,
target: this.target
});
}
}
}, {
key: "toggle",
value: function toggle(event) {
if (this.props.popup) {
if (this.state.visible) this.hide(event);else this.show(event);
}
}
}, {
key: "show",
value: function show(event) {
var _this2 = this;
this.target = event.currentTarget;
var currentEvent = event;
this.setState({
visible: true
}, function () {
if (_this2.props.onShow) {
_this2.props.onShow(currentEvent);
}
});
}
}, {
key: "hide",
value: function hide(event) {
var _this3 = this;
var currentEvent = event;
this.setState({
visible: false
}, function () {
if (_this3.props.onHide) {
_this3.props.onHide(currentEvent);
}
});
}
}, {
key: "onEnter",
value: function onEnter() {
if (this.props.autoZIndex) {
ZIndexUtils.set('menu', this.menuRef.current, PrimeReact.autoZIndex, this.props.baseZIndex || PrimeReact.zIndex['menu']);
}
DomHandler.absolutePosition(this.menuRef.current, this.target);
}
}, {
key: "onEntered",
value: function onEntered() {
this.bindDocumentListeners();
this.bindScrollListener();
}
}, {
key: "onExit",
value: function onExit() {
this.target = null;
this.unbindDocumentListeners();
this.unbindScrollListener();
}
}, {
key: "onExited",
value: function onExited() {
ZIndexUtils.clear(this.menuRef.current);
}
}, {
key: "bindDocumentListeners",
value: function bindDocumentListeners() {
this.bindDocumentClickListener();
this.bindDocumentResizeListener();
}
}, {
key: "unbindDocumentListeners",
value: function unbindDocumentListeners() {
this.unbindDocumentClickListener();
this.unbindDocumentResizeListener();
}
}, {
key: "bindDocumentClickListener",
value: function bindDocumentClickListener() {
var _this4 = this;
if (!this.documentClickListener) {
this.documentClickListener = function (event) {
if (_this4.props.popup && _this4.state.visible && _this4.menuRef.current && !_this4.menuRef.current.contains(event.target)) {
_this4.hide(event);
}
};
document.addEventListener('click', this.documentClickListener);
}
}
}, {
key: "unbindDocumentClickListener",
value: function unbindDocumentClickListener() {
if (this.documentClickListener) {
document.removeEventListener('click', this.documentClickListener);
this.documentClickListener = null;
}
}
}, {
key: "bindDocumentResizeListener",
value: function bindDocumentResizeListener() {
var _this5 = this;
if (!this.documentResizeListener) {
this.documentResizeListener = function (event) {
if (_this5.state.visible && !DomHandler.isTouchDevice()) {
_this5.hide(event);
}
};
window.addEventListener('resize', this.documentResizeListener);
}
}
}, {
key: "unbindDocumentResizeListener",
value: function unbindDocumentResizeListener() {
if (this.documentResizeListener) {
window.removeEventListener('resize', this.documentResizeListener);
this.documentResizeListener = null;
}
}
}, {
key: "bindScrollListener",
value: function bindScrollListener() {
var _this6 = this;
if (!this.scrollHandler) {
this.scrollHandler = new ConnectedOverlayScrollHandler(this.target, function (event) {
if (_this6.state.visible) {
_this6.hide(event);
}
});
}
this.scrollHandler.bindScrollListener();
}
}, {
key: "unbindScrollListener",
value: function unbindScrollListener() {
if (this.scrollHandler) {
this.scrollHandler.unbindScrollListener();
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
this.unbindDocumentListeners();
if (this.scrollHandler) {
this.scrollHandler.destroy();
this.scrollHandler = null;
}
ZIndexUtils.clear(this.menuRef.current);
}
}, {
key: "renderElement",
value: function renderElement() {
var className = classNames('p-tieredmenu p-component', {
'p-tieredmenu-overlay': this.props.popup
}, this.props.className);
return /*#__PURE__*/React__default["default"].createElement(CSSTransition, {
nodeRef: this.menuRef,
classNames: "p-connected-overlay",
"in": this.state.visible,
timeout: {
enter: 120,
exit: 100
},
options: this.props.transitionOptions,
unmountOnExit: true,
onEnter: this.onEnter,
onEntered: this.onEntered,
onExit: this.onExit,
onExited: this.onExited
}, /*#__PURE__*/React__default["default"].createElement("div", {
ref: this.menuRef,
id: this.props.id,
className: className,
style: this.props.style,
onClick: this.onPanelClick
}, /*#__PURE__*/React__default["default"].createElement(TieredMenuSub, {
model: this.props.model,
root: true,
popup: this.props.popup
})));
}
}, {
key: "render",
value: function render() {
var element = this.renderElement();
return this.props.popup ? /*#__PURE__*/React__default["default"].createElement(Portal, {
element: element,
appendTo: this.props.appendTo
}) : element;
}
}]);
return TieredMenu;
}(React.Component);
_defineProperty(TieredMenu, "defaultProps", {
id: null,
model: null,
popup: false,
style: null,
className: null,
autoZIndex: true,
baseZIndex: 0,
appendTo: null,
transitionOptions: null,
onShow: null,
onHide: null
});
function _createSuper$m(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$m(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$m() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var Timeline = /*#__PURE__*/function (_Component) {
_inherits(Timeline, _Component);
var _super = _createSuper$m(Timeline);
function Timeline() {
_classCallCheck(this, Timeline);
return _super.apply(this, arguments);
}
_createClass(Timeline, [{
key: "getKey",
value: function getKey(item, index) {
return this.props.dataKey ? ObjectUtils.resolveFieldData(item, this.props.dataKey) : "pr_id__".concat(index);
}
}, {
key: "renderEvents",
value: function renderEvents() {
var _this = this;
return this.props.value && this.props.value.map(function (item, index) {
var opposite = ObjectUtils.getJSXElement(_this.props.opposite, item, index);
var marker = ObjectUtils.getJSXElement(_this.props.marker, item, index) || /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-timeline-event-marker"
});
var connector = index !== _this.props.value.length - 1 && /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-timeline-event-connector"
});
var content = ObjectUtils.getJSXElement(_this.props.content, item, index);
return /*#__PURE__*/React__default["default"].createElement("div", {
key: _this.getKey(item, index),
className: "p-timeline-event"
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-timeline-event-opposite"
}, opposite), /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-timeline-event-separator"
}, marker, connector), /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-timeline-event-content"
}, content));
});
}
}, {
key: "render",
value: function render() {
var _classNames;
var containerClassName = classNames('p-timeline p-component', (_classNames = {}, _defineProperty(_classNames, "p-timeline-".concat(this.props.align), true), _defineProperty(_classNames, "p-timeline-".concat(this.props.layout), true), _classNames), this.props.className);
var events = this.renderEvents();
return /*#__PURE__*/React__default["default"].createElement("div", {
id: this.props.id,
className: containerClassName,
style: this.props.style
}, events);
}
}]);
return Timeline;
}(React.Component);
_defineProperty(Timeline, "defaultProps", {
id: null,
value: null,
align: 'left',
layout: 'vertical',
dataKey: null,
className: null,
style: null,
opposite: null,
marker: null,
content: null
});
function ownKeys$a(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$a(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$a(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$a(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createSuper$l(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$l(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$l() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var ToastMessageComponent = /*#__PURE__*/function (_Component) {
_inherits(ToastMessageComponent, _Component);
var _super = _createSuper$l(ToastMessageComponent);
function ToastMessageComponent(props) {
var _this;
_classCallCheck(this, ToastMessageComponent);
_this = _super.call(this, props);
_this.onClick = _this.onClick.bind(_assertThisInitialized(_this));
_this.onClose = _this.onClose.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(ToastMessageComponent, [{
key: "componentWillUnmount",
value: function componentWillUnmount() {
if (this.timeout) {
clearTimeout(this.timeout);
}
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
var _this2 = this;
if (!this.props.message.sticky) {
this.timeout = setTimeout(function () {
_this2.onClose(null);
}, this.props.message.life || 3000);
}
}
}, {
key: "onClose",
value: function onClose() {
if (this.timeout) {
clearTimeout(this.timeout);
}
if (this.props.onClose) {
this.props.onClose(this.props.message);
}
}
}, {
key: "onClick",
value: function onClick(event) {
if (this.props.onClick && !(DomHandler.hasClass(event.target, 'p-toast-icon-close') || DomHandler.hasClass(event.target, 'p-toast-icon-close-icon'))) {
this.props.onClick(this.props.message);
}
}
}, {
key: "renderCloseIcon",
value: function renderCloseIcon() {
if (this.props.message.closable !== false) {
return /*#__PURE__*/React__default["default"].createElement("button", {
type: "button",
className: "p-toast-icon-close p-link",
onClick: this.onClose
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-toast-icon-close-icon pi pi-times"
}), /*#__PURE__*/React__default["default"].createElement(Ripple, null));
}
return null;
}
}, {
key: "renderMessage",
value: function renderMessage() {
if (this.props.message) {
var _this$props$message = this.props.message,
severity = _this$props$message.severity,
content = _this$props$message.content,
summary = _this$props$message.summary,
detail = _this$props$message.detail;
var contentEl = ObjectUtils.getJSXElement(content, _objectSpread$a(_objectSpread$a({}, this.props), {}, {
onClose: this.onClose
}));
var iconClassName = classNames('p-toast-message-icon pi', {
'pi-info-circle': severity === 'info',
'pi-exclamation-triangle': severity === 'warn',
'pi-times': severity === 'error',
'pi-check': severity === 'success'
});
return contentEl || /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("span", {
className: iconClassName
}), /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-toast-message-text"
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-toast-summary"
}, summary), detail && /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-toast-detail"
}, detail)));
}
return null;
}
}, {
key: "render",
value: function render() {
var severity = this.props.message.severity;
var contentClassName = this.props.message.contentClassName;
var contentStyle = this.props.message.contentStyle;
var style = this.props.message.style;
var className = classNames('p-toast-message', {
'p-toast-message-info': severity === 'info',
'p-toast-message-warn': severity === 'warn',
'p-toast-message-error': severity === 'error',
'p-toast-message-success': severity === 'success'
}, this.props.message.className);
var message = this.renderMessage();
var closeIcon = this.renderCloseIcon();
return /*#__PURE__*/React__default["default"].createElement("div", {
ref: this.props.forwardRef,
className: className,
style: style,
role: "alert",
"aria-live": "assertive",
"aria-atomic": "true",
onClick: this.onClick
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: classNames('p-toast-message-content', contentClassName),
style: contentStyle
}, message, closeIcon));
}
}]);
return ToastMessageComponent;
}(React.Component);
_defineProperty(ToastMessageComponent, "defaultProps", {
message: null,
onClose: null,
onClick: null
});
var ToastMessage = /*#__PURE__*/React__default["default"].forwardRef(function (props, ref) {
return /*#__PURE__*/React__default["default"].createElement(ToastMessageComponent, _extends({
forwardRef: ref
}, props));
});
function _createSuper$k(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$k(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$k() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var messageIdx = 0;
var Toast = /*#__PURE__*/function (_Component) {
_inherits(Toast, _Component);
var _super = _createSuper$k(Toast);
function Toast(props) {
var _this;
_classCallCheck(this, Toast);
_this = _super.call(this, props);
_this.state = {
messages: []
};
_this.onClose = _this.onClose.bind(_assertThisInitialized(_this));
_this.onEntered = _this.onEntered.bind(_assertThisInitialized(_this));
_this.onExited = _this.onExited.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(Toast, [{
key: "show",
value: function show(value) {
if (value) {
if (value) {
var newMessages;
if (Array.isArray(value)) {
for (var i = 0; i < value.length; i++) {
value[i].id = messageIdx++;
newMessages = [].concat(_toConsumableArray(this.state.messages), _toConsumableArray(value));
}
} else {
value.id = messageIdx++;
newMessages = this.state.messages ? [].concat(_toConsumableArray(this.state.messages), [value]) : [value];
}
this.state.messages.length === 0 && ZIndexUtils.set('toast', this.container, PrimeReact.autoZIndex, this.props.baseZIndex || PrimeReact.zIndex['toast']);
this.setState({
messages: newMessages
});
}
}
}
}, {
key: "clear",
value: function clear() {
ZIndexUtils.clear(this.container);
this.setState({
messages: []
});
}
}, {
key: "onClose",
value: function onClose(message) {
var newMessages = this.state.messages.filter(function (msg) {
return msg.id !== message.id;
});
this.setState({
messages: newMessages
});
if (this.props.onRemove) {
this.props.onRemove(message);
}
}
}, {
key: "onEntered",
value: function onEntered() {
this.props.onShow && this.props.onShow();
}
}, {
key: "onExited",
value: function onExited() {
this.state.messages.length === 0 && ZIndexUtils.clear(this.container);
this.props.onHide && this.props.onHide();
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
ZIndexUtils.clear(this.container);
}
}, {
key: "renderElement",
value: function renderElement() {
var _this2 = this;
var className = classNames('p-toast p-component p-toast-' + this.props.position, this.props.className);
return /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
_this2.container = el;
},
id: this.props.id,
className: className,
style: this.props.style
}, /*#__PURE__*/React__default["default"].createElement(reactTransitionGroup.TransitionGroup, null, this.state.messages.map(function (message) {
var messageRef = /*#__PURE__*/React__default["default"].createRef();
return /*#__PURE__*/React__default["default"].createElement(CSSTransition, {
nodeRef: messageRef,
key: message.id,
classNames: "p-toast-message",
unmountOnExit: true,
timeout: {
enter: 300,
exit: 300
},
onEntered: _this2.onEntered,
onExited: _this2.onExited,
options: _this2.props.transitionOptions
}, /*#__PURE__*/React__default["default"].createElement(ToastMessage, {
ref: messageRef,
message: message,
onClick: _this2.props.onClick,
onClose: _this2.onClose
}));
})));
}
}, {
key: "render",
value: function render() {
var element = this.renderElement();
return /*#__PURE__*/React__default["default"].createElement(Portal, {
element: element,
appendTo: this.props.appendTo
});
}
}]);
return Toast;
}(React.Component);
_defineProperty(Toast, "defaultProps", {
id: null,
className: null,
style: null,
baseZIndex: 0,
position: 'top-right',
transitionOptions: null,
appendTo: 'self',
onClick: null,
onRemove: null,
onShow: null,
onHide: null
});
function ownKeys$9(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$9(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$9(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$9(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createSuper$j(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$j(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$j() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var ToggleButton = /*#__PURE__*/function (_Component) {
_inherits(ToggleButton, _Component);
var _super = _createSuper$j(ToggleButton);
function ToggleButton(props) {
var _this;
_classCallCheck(this, ToggleButton);
_this = _super.call(this, props);
_this.toggle = _this.toggle.bind(_assertThisInitialized(_this));
_this.onKeyDown = _this.onKeyDown.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(ToggleButton, [{
key: "toggle",
value: function toggle(e) {
if (!this.props.disabled && this.props.onChange) {
this.props.onChange({
originalEvent: e,
value: !this.props.checked,
stopPropagation: function stopPropagation() {},
preventDefault: function preventDefault() {},
target: {
name: this.props.name,
id: this.props.id,
value: !this.props.checked
}
});
}
}
}, {
key: "onKeyDown",
value: function onKeyDown(event) {
if (event.key === 'Enter') {
this.toggle(event);
event.preventDefault();
}
}
}, {
key: "hasLabel",
value: function hasLabel() {
return this.props.onLabel && this.props.onLabel.length > 0 && this.props.offLabel && this.props.offLabel.length > 0;
}
}, {
key: "hasIcon",
value: function hasIcon() {
return this.props.onIcon && this.props.onIcon.length > 0 && this.props.offIcon && this.props.offIcon.length > 0;
}
}, {
key: "getLabel",
value: function getLabel() {
return this.hasLabel() ? this.props.checked ? this.props.onLabel : this.props.offLabel : ' ';
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
if (this.props.tooltip) {
this.renderTooltip();
}
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps) {
if (prevProps.tooltip !== this.props.tooltip || prevProps.tooltipOptions !== this.props.tooltipOptions) {
if (this.tooltip) this.tooltip.update(_objectSpread$9({
content: this.props.tooltip
}, this.props.tooltipOptions || {}));else this.renderTooltip();
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
if (this.tooltip) {
this.tooltip.destroy();
this.tooltip = null;
}
}
}, {
key: "renderTooltip",
value: function renderTooltip() {
this.tooltip = tip({
target: this.container,
content: this.props.tooltip,
options: this.props.tooltipOptions
});
}
}, {
key: "render",
value: function render() {
var _this2 = this;
var className = classNames('p-button p-togglebutton p-component', {
'p-button-icon-only': this.hasIcon() && !this.hasLabel(),
'p-highlight': this.props.checked,
'p-disabled': this.props.disabled
}, this.props.className),
iconClassName = null;
var hasIcon = this.hasIcon();
var label = this.getLabel();
var icon = this.props.checked ? this.props.onIcon : this.props.offIcon;
if (hasIcon) {
iconClassName = classNames('p-button-icon p-c', {
'p-button-icon-left': this.props.iconPos === 'left' && label,
'p-button-icon-right': this.props.iconPos === 'right' && label
});
}
return /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this2.container = el;
},
id: this.props.id,
className: className,
style: this.props.style,
onClick: this.toggle,
onFocus: this.props.onFocus,
onBlur: this.props.onBlur,
onKeyDown: this.onKeyDown,
tabIndex: !this.props.disabled && this.props.tabIndex,
"aria-labelledby": this.props.ariaLabelledBy
}, hasIcon && IconUtils.getJSXIcon(icon, {
className: iconClassName
}, {
props: this.props
}), /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-button-label"
}, label), /*#__PURE__*/React__default["default"].createElement(Ripple, null));
}
}]);
return ToggleButton;
}(React.Component);
_defineProperty(ToggleButton, "defaultProps", {
id: null,
onIcon: null,
offIcon: null,
onLabel: 'Yes',
offLabel: 'No',
iconPos: 'left',
style: null,
className: null,
checked: false,
tabIndex: 0,
tooltip: null,
tooltipOptions: null,
ariaLabelledBy: null,
onChange: null,
onFocus: null,
onBlur: null
});
function _createSuper$i(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$i(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$i() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var Toolbar = /*#__PURE__*/function (_Component) {
_inherits(Toolbar, _Component);
var _super = _createSuper$i(Toolbar);
function Toolbar() {
_classCallCheck(this, Toolbar);
return _super.apply(this, arguments);
}
_createClass(Toolbar, [{
key: "render",
value: function render() {
var toolbarClass = classNames('p-toolbar p-component', this.props.className);
var left = ObjectUtils.getJSXElement(this.props.left, this.props);
var right = ObjectUtils.getJSXElement(this.props.right, this.props);
return /*#__PURE__*/React__default["default"].createElement("div", {
id: this.props.id,
className: toolbarClass,
style: this.props.style,
role: "toolbar"
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-toolbar-group-left"
}, left), /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-toolbar-group-right"
}, right));
}
}]);
return Toolbar;
}(React.Component);
_defineProperty(Toolbar, "defaultProps", {
id: null,
style: null,
className: null,
left: null,
right: null
});
function _createForOfIteratorHelper$6(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray$6(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it["return"] != null) it["return"](); } finally { if (didErr) throw err; } } }; }
function _unsupportedIterableToArray$6(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray$6(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray$6(o, minLen); }
function _arrayLikeToArray$6(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
function ownKeys$8(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$8(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$8(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$8(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createSuper$h(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$h(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$h() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var UITreeNode = /*#__PURE__*/function (_Component) {
_inherits(UITreeNode, _Component);
var _super = _createSuper$h(UITreeNode);
function UITreeNode(props) {
var _this;
_classCallCheck(this, UITreeNode);
_this = _super.call(this, props);
_this.onClick = _this.onClick.bind(_assertThisInitialized(_this));
_this.onDoubleClick = _this.onDoubleClick.bind(_assertThisInitialized(_this));
_this.onRightClick = _this.onRightClick.bind(_assertThisInitialized(_this));
_this.onTouchEnd = _this.onTouchEnd.bind(_assertThisInitialized(_this));
_this.onTogglerClick = _this.onTogglerClick.bind(_assertThisInitialized(_this));
_this.onNodeKeyDown = _this.onNodeKeyDown.bind(_assertThisInitialized(_this));
_this.propagateUp = _this.propagateUp.bind(_assertThisInitialized(_this));
_this.onDrop = _this.onDrop.bind(_assertThisInitialized(_this));
_this.onDragOver = _this.onDragOver.bind(_assertThisInitialized(_this));
_this.onDragEnter = _this.onDragEnter.bind(_assertThisInitialized(_this));
_this.onDragLeave = _this.onDragLeave.bind(_assertThisInitialized(_this));
_this.onDragStart = _this.onDragStart.bind(_assertThisInitialized(_this));
_this.onDragEnd = _this.onDragEnd.bind(_assertThisInitialized(_this));
_this.onDropPointDragOver = _this.onDropPointDragOver.bind(_assertThisInitialized(_this));
_this.onDropPointDragEnter = _this.onDropPointDragEnter.bind(_assertThisInitialized(_this));
_this.onDropPointDragLeave = _this.onDropPointDragLeave.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(UITreeNode, [{
key: "isLeaf",
value: function isLeaf() {
return this.props.isNodeLeaf(this.props.node);
}
}, {
key: "expand",
value: function expand(event) {
var expandedKeys = this.props.expandedKeys ? _objectSpread$8({}, this.props.expandedKeys) : {};
expandedKeys[this.props.node.key] = true;
this.props.onToggle({
originalEvent: event,
value: expandedKeys
});
this.invokeToggleEvents(event, true);
}
}, {
key: "collapse",
value: function collapse(event) {
var expandedKeys = _objectSpread$8({}, this.props.expandedKeys);
delete expandedKeys[this.props.node.key];
this.props.onToggle({
originalEvent: event,
value: expandedKeys
});
this.invokeToggleEvents(event, false);
}
}, {
key: "onTogglerClick",
value: function onTogglerClick(event) {
if (this.props.disabled) {
return;
}
if (this.isExpanded()) this.collapse(event);else this.expand(event);
}
}, {
key: "invokeToggleEvents",
value: function invokeToggleEvents(event, expanded) {
if (expanded) {
if (this.props.onExpand) {
this.props.onExpand({
originalEvent: event,
node: this.props.node
});
}
} else {
if (this.props.onCollapse) {
this.props.onCollapse({
originalEvent: event,
node: this.props.node
});
}
}
}
}, {
key: "isExpanded",
value: function isExpanded() {
return (this.props.expandedKeys ? this.props.expandedKeys[this.props.node.key] !== undefined : false) || this.props.node.expanded;
}
}, {
key: "onNodeKeyDown",
value: function onNodeKeyDown(event) {
if (this.props.disabled) {
return;
}
var nodeElement = event.target.parentElement;
if (!DomHandler.hasClass(nodeElement, 'p-treenode')) {
return;
}
switch (event.which) {
//down arrow
case 40:
var listElement = nodeElement.children[1];
if (listElement) {
this.focusNode(listElement.children[0]);
} else {
var nextNodeElement = nodeElement.nextElementSibling;
if (nextNodeElement) {
this.focusNode(nextNodeElement);
} else {
var nextSiblingAncestor = this.findNextSiblingOfAncestor(nodeElement);
if (nextSiblingAncestor) {
this.focusNode(nextSiblingAncestor);
}
}
}
event.preventDefault();
break;
//up arrow
case 38:
if (nodeElement.previousElementSibling) {
this.focusNode(this.findLastVisibleDescendant(nodeElement.previousElementSibling));
} else {
var parentNodeElement = this.getParentNodeElement(nodeElement);
if (parentNodeElement) {
this.focusNode(parentNodeElement);
}
}
event.preventDefault();
break;
//right arrow
case 39:
if (!this.isExpanded()) {
this.expand(event);
}
event.preventDefault();
break;
//left arrow
case 37:
if (this.isExpanded()) {
this.collapse(event);
}
event.preventDefault();
break;
//enter
case 13:
this.onClick(event);
event.preventDefault();
break;
}
}
}, {
key: "findNextSiblingOfAncestor",
value: function findNextSiblingOfAncestor(nodeElement) {
var parentNodeElement = this.getParentNodeElement(nodeElement);
if (parentNodeElement) {
if (parentNodeElement.nextElementSibling) return parentNodeElement.nextElementSibling;else return this.findNextSiblingOfAncestor(parentNodeElement);
} else {
return null;
}
}
}, {
key: "findLastVisibleDescendant",
value: function findLastVisibleDescendant(nodeElement) {
var childrenListElement = nodeElement.children[1];
if (childrenListElement) {
var lastChildElement = childrenListElement.children[childrenListElement.children.length - 1];
return this.findLastVisibleDescendant(lastChildElement);
} else {
return nodeElement;
}
}
}, {
key: "getParentNodeElement",
value: function getParentNodeElement(nodeElement) {
var parentNodeElement = nodeElement.parentElement.parentElement;
return DomHandler.hasClass(parentNodeElement, 'p-treenode') ? parentNodeElement : null;
}
}, {
key: "focusNode",
value: function focusNode(element) {
element.children[0].focus();
}
}, {
key: "onClick",
value: function onClick(event) {
if (this.props.onClick) {
this.props.onClick({
originalEvent: event,
node: this.props.node
});
}
if (event.target.className && event.target.className.constructor === String && event.target.className.indexOf('p-tree-toggler') === 0 || this.props.disabled) {
return;
}
if (this.props.selectionMode && this.props.node.selectable !== false) {
var selectionKeys;
if (this.isCheckboxSelectionMode()) {
var checked = this.isChecked();
selectionKeys = this.props.selectionKeys ? _objectSpread$8({}, this.props.selectionKeys) : {};
if (checked) {
if (this.props.propagateSelectionDown) this.propagateDown(this.props.node, false, selectionKeys);else delete selectionKeys[this.props.node.key];
if (this.props.propagateSelectionUp && this.props.onPropagateUp) {
this.props.onPropagateUp({
originalEvent: event,
check: false,
selectionKeys: selectionKeys
});
}
if (this.props.onUnselect) {
this.props.onUnselect({
originalEvent: event,
node: this.props.node
});
}
} else {
if (this.props.propagateSelectionDown) this.propagateDown(this.props.node, true, selectionKeys);else selectionKeys[this.props.node.key] = {
checked: true
};
if (this.props.propagateSelectionUp && this.props.onPropagateUp) {
this.props.onPropagateUp({
originalEvent: event,
check: true,
selectionKeys: selectionKeys
});
}
if (this.props.onSelect) {
this.props.onSelect({
originalEvent: event,
node: this.props.node
});
}
}
} else {
var selected = this.isSelected();
var metaSelection = this.nodeTouched ? false : this.props.metaKeySelection;
if (metaSelection) {
var metaKey = event.metaKey || event.ctrlKey;
if (selected && metaKey) {
if (this.isSingleSelectionMode()) {
selectionKeys = null;
} else {
selectionKeys = _objectSpread$8({}, this.props.selectionKeys);
delete selectionKeys[this.props.node.key];
}
if (this.props.onUnselect) {
this.props.onUnselect({
originalEvent: event,
node: this.props.node
});
}
} else {
if (this.isSingleSelectionMode()) {
selectionKeys = this.props.node.key;
} else if (this.isMultipleSelectionMode()) {
selectionKeys = !metaKey ? {} : this.props.selectionKeys ? _objectSpread$8({}, this.props.selectionKeys) : {};
selectionKeys[this.props.node.key] = true;
}
if (this.props.onSelect) {
this.props.onSelect({
originalEvent: event,
node: this.props.node
});
}
}
} else {
if (this.isSingleSelectionMode()) {
if (selected) {
selectionKeys = null;
if (this.props.onUnselect) {
this.props.onUnselect({
originalEvent: event,
node: this.props.node
});
}
} else {
selectionKeys = this.props.node.key;
if (this.props.onSelect) {
this.props.onSelect({
originalEvent: event,
node: this.props.node
});
}
}
} else {
if (selected) {
selectionKeys = _objectSpread$8({}, this.props.selectionKeys);
delete selectionKeys[this.props.node.key];
if (this.props.onUnselect) {
this.props.onUnselect({
originalEvent: event,
node: this.props.node
});
}
} else {
selectionKeys = this.props.selectionKeys ? _objectSpread$8({}, this.props.selectionKeys) : {};
selectionKeys[this.props.node.key] = true;
if (this.props.onSelect) {
this.props.onSelect({
originalEvent: event,
node: this.props.node
});
}
}
}
}
}
if (this.props.onSelectionChange) {
this.props.onSelectionChange({
originalEvent: event,
value: selectionKeys
});
}
}
this.nodeTouched = false;
}
}, {
key: "onDoubleClick",
value: function onDoubleClick(event) {
if (this.props.onDoubleClick) {
this.props.onDoubleClick({
originalEvent: event,
node: this.props.node
});
}
}
}, {
key: "onRightClick",
value: function onRightClick(event) {
if (this.props.disabled) {
return;
}
DomHandler.clearSelection();
if (this.props.onContextMenuSelectionChange) {
this.props.onContextMenuSelectionChange({
originalEvent: event,
value: this.props.node.key
});
}
if (this.props.onContextMenu) {
this.props.onContextMenu({
originalEvent: event,
node: this.props.node
});
}
}
}, {
key: "propagateUp",
value: function propagateUp(event) {
var check = event.check;
var selectionKeys = event.selectionKeys;
var checkedChildCount = 0;
var childPartialSelected = false;
var _iterator = _createForOfIteratorHelper$6(this.props.node.children),
_step;
try {
for (_iterator.s(); !(_step = _iterator.n()).done;) {
var child = _step.value;
if (selectionKeys[child.key] && selectionKeys[child.key].checked) checkedChildCount++;else if (selectionKeys[child.key] && selectionKeys[child.key].partialChecked) childPartialSelected = true;
}
} catch (err) {
_iterator.e(err);
} finally {
_iterator.f();
}
if (check && checkedChildCount === this.props.node.children.length) {
selectionKeys[this.props.node.key] = {
checked: true,
partialChecked: false
};
} else {
if (!check) {
delete selectionKeys[this.props.node.key];
}
if (childPartialSelected || checkedChildCount > 0 && checkedChildCount !== this.props.node.children.length) selectionKeys[this.props.node.key] = {
checked: false,
partialChecked: true
};else delete selectionKeys[this.props.node.key];
}
if (this.props.propagateSelectionUp && this.props.onPropagateUp) {
this.props.onPropagateUp(event);
}
}
}, {
key: "propagateDown",
value: function propagateDown(node, check, selectionKeys) {
if (check) selectionKeys[node.key] = {
checked: true,
partialChecked: false
};else delete selectionKeys[node.key];
if (node.children && node.children.length) {
for (var i = 0; i < node.children.length; i++) {
this.propagateDown(node.children[i], check, selectionKeys);
}
}
}
}, {
key: "isSelected",
value: function isSelected() {
if (this.props.selectionMode && this.props.selectionKeys) return this.isSingleSelectionMode() ? this.props.selectionKeys === this.props.node.key : this.props.selectionKeys[this.props.node.key] !== undefined;else return false;
}
}, {
key: "isChecked",
value: function isChecked() {
return this.props.selectionKeys ? this.props.selectionKeys[this.props.node.key] && this.props.selectionKeys[this.props.node.key].checked : false;
}
}, {
key: "isPartialChecked",
value: function isPartialChecked() {
return this.props.selectionKeys ? this.props.selectionKeys[this.props.node.key] && this.props.selectionKeys[this.props.node.key].partialChecked : false;
}
}, {
key: "isSingleSelectionMode",
value: function isSingleSelectionMode() {
return this.props.selectionMode && this.props.selectionMode === 'single';
}
}, {
key: "isMultipleSelectionMode",
value: function isMultipleSelectionMode() {
return this.props.selectionMode && this.props.selectionMode === 'multiple';
}
}, {
key: "isCheckboxSelectionMode",
value: function isCheckboxSelectionMode() {
return this.props.selectionMode && this.props.selectionMode === 'checkbox';
}
}, {
key: "onTouchEnd",
value: function onTouchEnd() {
this.nodeTouched = true;
}
}, {
key: "onDropPoint",
value: function onDropPoint(event, position) {
event.preventDefault();
if (this.props.node.droppable !== false) {
DomHandler.removeClass(event.target, 'p-treenode-droppoint-active');
if (this.props.onDropPoint) {
this.props.onDropPoint({
originalEvent: event,
path: this.props.path,
index: this.props.index,
position: position
});
}
}
}
}, {
key: "onDropPointDragOver",
value: function onDropPointDragOver(event) {
if (event.dataTransfer.types[1] === this.props.dragdropScope.toLocaleLowerCase()) {
event.dataTransfer.dropEffect = 'move';
event.preventDefault();
}
}
}, {
key: "onDropPointDragEnter",
value: function onDropPointDragEnter(event) {
if (event.dataTransfer.types[1] === this.props.dragdropScope.toLocaleLowerCase()) {
DomHandler.addClass(event.target, 'p-treenode-droppoint-active');
}
}
}, {
key: "onDropPointDragLeave",
value: function onDropPointDragLeave(event) {
if (event.dataTransfer.types[1] === this.props.dragdropScope.toLocaleLowerCase()) {
DomHandler.removeClass(event.target, 'p-treenode-droppoint-active');
}
}
}, {
key: "onDrop",
value: function onDrop(event) {
if (this.props.dragdropScope && this.props.node.droppable !== false) {
DomHandler.removeClass(this.contentElement, 'p-treenode-dragover');
event.preventDefault();
event.stopPropagation();
if (this.props.onDrop) {
this.props.onDrop({
originalEvent: event,
path: this.props.path,
index: this.props.index
});
}
}
}
}, {
key: "onDragOver",
value: function onDragOver(event) {
if (event.dataTransfer.types[1] === this.props.dragdropScope.toLocaleLowerCase() && this.props.node.droppable !== false) {
event.dataTransfer.dropEffect = 'move';
event.preventDefault();
event.stopPropagation();
}
}
}, {
key: "onDragEnter",
value: function onDragEnter(event) {
if (event.dataTransfer.types[1] === this.props.dragdropScope.toLocaleLowerCase() && this.props.node.droppable !== false) {
DomHandler.addClass(this.contentElement, 'p-treenode-dragover');
}
}
}, {
key: "onDragLeave",
value: function onDragLeave(event) {
if (event.dataTransfer.types[1] === this.props.dragdropScope.toLocaleLowerCase() && this.props.node.droppable !== false) {
var rect = event.currentTarget.getBoundingClientRect();
if (event.nativeEvent.x > rect.left + rect.width || event.nativeEvent.x < rect.left || event.nativeEvent.y >= Math.floor(rect.top + rect.height) || event.nativeEvent.y < rect.top) {
DomHandler.removeClass(this.contentElement, 'p-treenode-dragover');
}
}
}
}, {
key: "onDragStart",
value: function onDragStart(event) {
event.dataTransfer.setData("text", this.props.dragdropScope);
event.dataTransfer.setData(this.props.dragdropScope, this.props.dragdropScope);
if (this.props.onDragStart) {
this.props.onDragStart({
originalEvent: event,
path: this.props.path,
index: this.props.index
});
}
}
}, {
key: "onDragEnd",
value: function onDragEnd(event) {
if (this.props.onDragEnd) {
this.props.onDragEnd({
originalEvent: event
});
}
}
}, {
key: "renderLabel",
value: function renderLabel() {
var content = /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-treenode-label"
}, this.props.node.label);
if (this.props.nodeTemplate) {
var defaultContentOptions = {
onTogglerClick: this.onTogglerClick,
className: 'p-treenode-label',
element: content,
props: this.props,
expanded: this.isExpanded()
};
content = ObjectUtils.getJSXElement(this.props.nodeTemplate, this.props.node, defaultContentOptions);
}
return content;
}
}, {
key: "renderCheckbox",
value: function renderCheckbox() {
if (this.isCheckboxSelectionMode() && this.props.node.selectable !== false) {
var checked = this.isChecked();
var partialChecked = this.isPartialChecked();
var className = classNames('p-checkbox-box', {
'p-highlight': checked,
'p-indeterminate': partialChecked,
'p-disabled': this.props.disabled
});
var icon = classNames('p-checkbox-icon p-c', {
'pi pi-check': checked,
'pi pi-minus': partialChecked
});
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-checkbox p-component"
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: className,
role: "checkbox",
"aria-checked": checked
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: icon
})));
}
return null;
}
}, {
key: "renderIcon",
value: function renderIcon(expanded) {
var icon = this.props.node.icon || (expanded ? this.props.node.expandedIcon : this.props.node.collapsedIcon);
if (icon) {
var className = classNames('p-treenode-icon', icon);
return /*#__PURE__*/React__default["default"].createElement("span", {
className: className
});
}
return null;
}
}, {
key: "renderToggler",
value: function renderToggler(expanded) {
var iconClassName = classNames('p-tree-toggler-icon pi pi-fw', {
'pi-chevron-right': !expanded,
'pi-chevron-down': expanded
});
var content = /*#__PURE__*/React__default["default"].createElement("button", {
type: "button",
className: "p-tree-toggler p-link",
tabIndex: -1,
onClick: this.onTogglerClick
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: iconClassName
}), /*#__PURE__*/React__default["default"].createElement(Ripple, null));
if (this.props.togglerTemplate) {
var defaultContentOptions = {
onClick: this.onTogglerClick,
containerClassName: 'p-tree-toggler p-link',
iconClassName: 'p-tree-toggler-icon',
element: content,
props: this.props,
expanded: expanded
};
content = ObjectUtils.getJSXElement(this.props.togglerTemplate, this.props.node, defaultContentOptions);
}
return content;
}
}, {
key: "renderDropPoint",
value: function renderDropPoint(position) {
var _this2 = this;
if (this.props.dragdropScope) {
return /*#__PURE__*/React__default["default"].createElement("li", {
className: "p-treenode-droppoint",
onDrop: function onDrop(event) {
return _this2.onDropPoint(event, position);
},
onDragOver: this.onDropPointDragOver,
onDragEnter: this.onDropPointDragEnter,
onDragLeave: this.onDropPointDragLeave
});
}
return null;
}
}, {
key: "renderContent",
value: function renderContent() {
var _this3 = this;
var selected = this.isSelected();
var checked = this.isChecked();
var className = classNames('p-treenode-content', this.props.node.className, {
'p-treenode-selectable': this.props.selectionMode && this.props.node.selectable !== false,
'p-highlight': this.isCheckboxSelectionMode() ? checked : selected,
'p-highlight-contextmenu': this.props.contextMenuSelectionKey && this.props.contextMenuSelectionKey === this.props.node.key,
'p-disabled': this.props.disabled
});
var expanded = this.isExpanded();
var toggler = this.renderToggler(expanded);
var checkbox = this.renderCheckbox();
var icon = this.renderIcon(expanded);
var label = this.renderLabel();
var tabIndex = this.props.disabled ? undefined : 0;
return /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this3.contentElement = el;
},
className: className,
style: this.props.node.style,
onClick: this.onClick,
onDoubleClick: this.onDoubleClick,
onContextMenu: this.onRightClick,
onTouchEnd: this.onTouchEnd,
draggable: this.props.dragdropScope && this.props.node.draggable !== false && !this.props.disabled,
onDrop: this.onDrop,
onDragOver: this.onDragOver,
onDragEnter: this.onDragEnter,
onDragLeave: this.onDragLeave,
onDragStart: this.onDragStart,
onDragEnd: this.onDragEnd,
tabIndex: tabIndex,
onKeyDown: this.onNodeKeyDown,
role: "treeitem",
"aria-posinset": this.props.index + 1,
"aria-expanded": this.isExpanded(),
"aria-selected": checked || selected
}, toggler, checkbox, icon, label);
}
}, {
key: "renderChildren",
value: function renderChildren() {
var _this4 = this;
if (this.props.node.children && this.props.node.children.length && this.isExpanded()) {
return /*#__PURE__*/React__default["default"].createElement("ul", {
className: "p-treenode-children",
role: "group"
}, this.props.node.children.map(function (childNode, index) {
return /*#__PURE__*/React__default["default"].createElement(UITreeNode, {
key: childNode.key || childNode.label,
node: childNode,
parent: _this4.props.node,
index: index,
last: index === _this4.props.node.children.length - 1,
path: _this4.props.path + '-' + index,
disabled: _this4.props.disabled,
selectionMode: _this4.props.selectionMode,
selectionKeys: _this4.props.selectionKeys,
onSelectionChange: _this4.props.onSelectionChange,
metaKeySelection: _this4.props.metaKeySelection,
propagateSelectionDown: _this4.props.propagateSelectionDown,
propagateSelectionUp: _this4.props.propagateSelectionUp,
contextMenuSelectionKey: _this4.props.contextMenuSelectionKey,
onContextMenuSelectionChange: _this4.props.onContextMenuSelectionChange,
onContextMenu: _this4.props.onContextMenu,
onExpand: _this4.props.onExpand,
onCollapse: _this4.props.onCollapse,
onSelect: _this4.props.onSelect,
onUnselect: _this4.props.onUnselect,
expandedKeys: _this4.props.expandedKeys,
onToggle: _this4.props.onToggle,
onPropagateUp: _this4.propagateUp,
nodeTemplate: _this4.props.nodeTemplate,
togglerTemplate: _this4.props.togglerTemplate,
isNodeLeaf: _this4.props.isNodeLeaf,
dragdropScope: _this4.props.dragdropScope,
onDragStart: _this4.props.onDragStart,
onDragEnd: _this4.props.onDragEnd,
onDrop: _this4.props.onDrop,
onDropPoint: _this4.props.onDropPoint
});
}));
}
return null;
}
}, {
key: "renderNode",
value: function renderNode() {
var className = classNames('p-treenode', {
'p-treenode-leaf': this.isLeaf()
}, this.props.node.className);
var content = this.renderContent();
var children = this.renderChildren();
return /*#__PURE__*/React__default["default"].createElement("li", {
className: className,
style: this.props.node.style
}, content, children);
}
}, {
key: "render",
value: function render() {
var node = this.renderNode();
if (this.props.dragdropScope && !this.props.disabled) {
var beforeDropPoint = this.renderDropPoint(-1);
var afterDropPoint = this.props.last ? this.renderDropPoint(1) : null;
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, beforeDropPoint, node, afterDropPoint);
} else {
return node;
}
}
}]);
return UITreeNode;
}(React.Component);
_defineProperty(UITreeNode, "defaultProps", {
node: null,
index: null,
last: null,
parent: null,
path: null,
disabled: false,
selectionMode: null,
selectionKeys: null,
contextMenuSelectionKey: null,
metaKeySelection: true,
expandedKeys: null,
propagateSelectionUp: true,
propagateSelectionDown: true,
dragdropScope: null,
ariaLabel: null,
ariaLabelledBy: null,
nodeTemplate: null,
togglerTemplate: null,
isNodeLeaf: null,
onSelect: null,
onUnselect: null,
onExpand: null,
onCollapse: null,
onToggle: null,
onSelectionChange: null,
onContextMenuSelectionChange: null,
onPropagateUp: null,
onDragStart: null,
onDragEnd: null,
onDrop: null,
onDropPoint: null,
onContextMenu: null,
onNodeClick: null,
onNodeDoubleClick: null
});
function ownKeys$7(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$7(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$7(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$7(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createForOfIteratorHelper$5(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray$5(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it["return"] != null) it["return"](); } finally { if (didErr) throw err; } } }; }
function _unsupportedIterableToArray$5(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray$5(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray$5(o, minLen); }
function _arrayLikeToArray$5(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
function _createSuper$g(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$g(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$g() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var Tree = /*#__PURE__*/function (_Component) {
_inherits(Tree, _Component);
var _super = _createSuper$g(Tree);
function Tree(props) {
var _this;
_classCallCheck(this, Tree);
_this = _super.call(this, props);
_this.state = {};
if (!_this.props.onFilterValueChange) {
_this.state['filterValue'] = '';
}
if (!_this.props.onToggle) {
_this.state['expandedKeys'] = _this.props.expandedKeys;
}
_this.isNodeLeaf = _this.isNodeLeaf.bind(_assertThisInitialized(_this));
_this.onToggle = _this.onToggle.bind(_assertThisInitialized(_this));
_this.onDragStart = _this.onDragStart.bind(_assertThisInitialized(_this));
_this.onDragEnd = _this.onDragEnd.bind(_assertThisInitialized(_this));
_this.onDrop = _this.onDrop.bind(_assertThisInitialized(_this));
_this.onDropPoint = _this.onDropPoint.bind(_assertThisInitialized(_this));
_this.onFilterInputChange = _this.onFilterInputChange.bind(_assertThisInitialized(_this));
_this.onFilterInputKeyDown = _this.onFilterInputKeyDown.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(Tree, [{
key: "getFilterValue",
value: function getFilterValue() {
return this.props.onFilterValueChange ? this.props.filterValue : this.state.filterValue;
}
}, {
key: "getExpandedKeys",
value: function getExpandedKeys() {
return this.props.onToggle ? this.props.expandedKeys : this.state.expandedKeys;
}
}, {
key: "getRootNode",
value: function getRootNode() {
return this.props.filter && this.filteredNodes ? this.filteredNodes : this.props.value;
}
}, {
key: "onToggle",
value: function onToggle(event) {
if (this.props.onToggle) {
this.props.onToggle(event);
} else {
this.setState({
expandedKeys: event.value
});
}
}
}, {
key: "onDragStart",
value: function onDragStart(event) {
this.dragState = {
path: event.path,
index: event.index
};
}
}, {
key: "onDragEnd",
value: function onDragEnd() {
this.dragState = null;
}
}, {
key: "onDrop",
value: function onDrop(event) {
if (this.validateDropNode(this.dragState.path, event.path)) {
var value = JSON.parse(JSON.stringify(this.props.value));
var dragPaths = this.dragState.path.split('-');
dragPaths.pop();
var dragNodeParent = this.findNode(value, dragPaths);
var dragNode = dragNodeParent ? dragNodeParent.children[this.dragState.index] : value[this.dragState.index];
var dropNode = this.findNode(value, event.path.split('-'));
if (dropNode.children) dropNode.children.push(dragNode);else dropNode.children = [dragNode];
if (dragNodeParent) dragNodeParent.children.splice(this.dragState.index, 1);else value.splice(this.dragState.index, 1);
if (this.props.onDragDrop) {
this.props.onDragDrop({
originalEvent: event.originalEvent,
value: value,
dragNode: dragNode,
dropNode: dropNode,
dropIndex: event.index
});
}
}
}
}, {
key: "onDropPoint",
value: function onDropPoint(event) {
if (this.validateDropPoint(event)) {
var value = JSON.parse(JSON.stringify(this.props.value));
var dragPaths = this.dragState.path.split('-');
dragPaths.pop();
var dropPaths = event.path.split('-');
dropPaths.pop();
var dragNodeParent = this.findNode(value, dragPaths);
var dropNodeParent = this.findNode(value, dropPaths);
var dragNode = dragNodeParent ? dragNodeParent.children[this.dragState.index] : value[this.dragState.index];
var siblings = this.areSiblings(this.dragState.path, event.path);
if (dragNodeParent) dragNodeParent.children.splice(this.dragState.index, 1);else value.splice(this.dragState.index, 1);
if (event.position < 0) {
var dropIndex = siblings ? this.dragState.index > event.index ? event.index : event.index - 1 : event.index;
if (dropNodeParent) dropNodeParent.children.splice(dropIndex, 0, dragNode);else value.splice(dropIndex, 0, dragNode);
} else {
if (dropNodeParent) dropNodeParent.children.push(dragNode);else value.push(dragNode);
}
if (this.props.onDragDrop) {
this.props.onDragDrop({
originalEvent: event.originalEvent,
value: value,
dragNode: dragNode,
dropNode: dropNodeParent,
dropIndex: event.index
});
}
}
}
}, {
key: "validateDrop",
value: function validateDrop(dragPath, dropPath) {
if (!dragPath) {
return false;
} else {
//same node
if (dragPath === dropPath) {
return false;
} //parent dropped on an descendant
if (dropPath.indexOf(dragPath) === 0) {
return false;
}
return true;
}
}
}, {
key: "validateDropNode",
value: function validateDropNode(dragPath, dropPath) {
var validateDrop = this.validateDrop(dragPath, dropPath);
if (validateDrop) {
//child dropped on parent
if (dragPath.indexOf('-') > 0 && dragPath.substring(0, dragPath.lastIndexOf('-')) === dropPath) {
return false;
}
return true;
} else {
return false;
}
}
}, {
key: "validateDropPoint",
value: function validateDropPoint(event) {
var validateDrop = this.validateDrop(this.dragState.path, event.path);
if (validateDrop) {
//child dropped to next sibling's drop point
if (event.position === -1 && this.areSiblings(this.dragState.path, event.path) && this.dragState.index + 1 === event.index) {
return false;
}
return true;
} else {
return false;
}
}
}, {
key: "areSiblings",
value: function areSiblings(path1, path2) {
if (path1.length === 1 && path2.length === 1) return true;else return path1.substring(0, path1.lastIndexOf('-')) === path2.substring(0, path2.lastIndexOf('-'));
}
}, {
key: "findNode",
value: function findNode(value, path) {
if (path.length === 0) {
return null;
} else {
var index = parseInt(path[0], 10);
var nextSearchRoot = value.children ? value.children[index] : value[index];
if (path.length === 1) {
return nextSearchRoot;
} else {
path.shift();
return this.findNode(nextSearchRoot, path);
}
}
}
}, {
key: "isNodeLeaf",
value: function isNodeLeaf(node) {
return node.leaf === false ? false : !(node.children && node.children.length);
}
}, {
key: "onFilterInputKeyDown",
value: function onFilterInputKeyDown(event) {
//enter
if (event.which === 13) {
event.preventDefault();
}
}
}, {
key: "onFilterInputChange",
value: function onFilterInputChange(event) {
this.filterChanged = true;
var filterValue = event.target.value;
if (this.props.onFilterValueChange) {
this.props.onFilterValueChange({
originalEvent: event,
value: filterValue
});
} else {
this.setState({
filterValue: filterValue
});
}
}
}, {
key: "filter",
value: function filter(value) {
this.setState({
filterValue: ObjectUtils.isNotEmpty(value) ? value : ''
}, this._filter);
}
}, {
key: "_filter",
value: function _filter() {
if (!this.filterChanged) {
return;
}
var filterValue = this.getFilterValue();
if (ObjectUtils.isEmpty(filterValue)) {
this.filteredNodes = this.props.value;
} else {
this.filteredNodes = [];
var searchFields = this.props.filterBy.split(',');
var filterText = filterValue.toLocaleLowerCase(this.props.filterLocale);
var isStrictMode = this.props.filterMode === 'strict';
var _iterator = _createForOfIteratorHelper$5(this.props.value),
_step;
try {
for (_iterator.s(); !(_step = _iterator.n()).done;) {
var node = _step.value;
var copyNode = _objectSpread$7({}, node);
var paramsWithoutNode = {
searchFields: searchFields,
filterText: filterText,
isStrictMode: isStrictMode
};
if (isStrictMode && (this.findFilteredNodes(copyNode, paramsWithoutNode) || this.isFilterMatched(copyNode, paramsWithoutNode)) || !isStrictMode && (this.isFilterMatched(copyNode, paramsWithoutNode) || this.findFilteredNodes(copyNode, paramsWithoutNode))) {
this.filteredNodes.push(copyNode);
}
}
} catch (err) {
_iterator.e(err);
} finally {
_iterator.f();
}
}
this.filterChanged = false;
}
}, {
key: "findFilteredNodes",
value: function findFilteredNodes(node, paramsWithoutNode) {
if (node) {
var matched = false;
if (node.children) {
var childNodes = _toConsumableArray(node.children);
node.children = [];
var _iterator2 = _createForOfIteratorHelper$5(childNodes),
_step2;
try {
for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
var childNode = _step2.value;
var copyChildNode = _objectSpread$7({}, childNode);
if (this.isFilterMatched(copyChildNode, paramsWithoutNode)) {
matched = true;
node.children.push(copyChildNode);
}
}
} catch (err) {
_iterator2.e(err);
} finally {
_iterator2.f();
}
}
if (matched) {
node.expanded = true;
return true;
}
}
}
}, {
key: "isFilterMatched",
value: function isFilterMatched(node, _ref) {
var searchFields = _ref.searchFields,
filterText = _ref.filterText,
isStrictMode = _ref.isStrictMode;
var matched = false;
var _iterator3 = _createForOfIteratorHelper$5(searchFields),
_step3;
try {
for (_iterator3.s(); !(_step3 = _iterator3.n()).done;) {
var field = _step3.value;
var fieldValue = String(ObjectUtils.resolveFieldData(node, field)).toLocaleLowerCase(this.props.filterLocale);
if (fieldValue.indexOf(filterText) > -1) {
matched = true;
}
}
} catch (err) {
_iterator3.e(err);
} finally {
_iterator3.f();
}
if (!matched || isStrictMode && !this.isNodeLeaf(node)) {
matched = this.findFilteredNodes(node, {
searchFields: searchFields,
filterText: filterText,
isStrictMode: isStrictMode
}) || matched;
}
return matched;
}
}, {
key: "renderRootChild",
value: function renderRootChild(node, index, last) {
return /*#__PURE__*/React__default["default"].createElement(UITreeNode, {
key: node.key || node.label,
node: node,
index: index,
last: last,
path: String(index),
disabled: this.props.disabled,
selectionMode: this.props.selectionMode,
selectionKeys: this.props.selectionKeys,
onSelectionChange: this.props.onSelectionChange,
metaKeySelection: this.props.metaKeySelection,
contextMenuSelectionKey: this.props.contextMenuSelectionKey,
onContextMenuSelectionChange: this.props.onContextMenuSelectionChange,
onContextMenu: this.props.onContextMenu,
propagateSelectionDown: this.props.propagateSelectionDown,
propagateSelectionUp: this.props.propagateSelectionUp,
onExpand: this.props.onExpand,
onCollapse: this.props.onCollapse,
onSelect: this.props.onSelect,
onUnselect: this.props.onUnselect,
expandedKeys: this.getExpandedKeys(),
onToggle: this.onToggle,
nodeTemplate: this.props.nodeTemplate,
togglerTemplate: this.props.togglerTemplate,
isNodeLeaf: this.isNodeLeaf,
dragdropScope: this.props.dragdropScope,
onDragStart: this.onDragStart,
onDragEnd: this.onDragEnd,
onDrop: this.onDrop,
onDropPoint: this.onDropPoint,
onNodeClick: this.props.onNodeClick,
onNodeDoubleClick: this.props.onNodeDoubleClick
});
}
}, {
key: "renderRootChildren",
value: function renderRootChildren() {
var _this2 = this;
if (this.props.filter) {
this.filterChanged = true;
this._filter();
}
var value = this.getRootNode();
return value.map(function (node, index) {
return _this2.renderRootChild(node, index, index === value.length - 1);
});
}
}, {
key: "renderModel",
value: function renderModel() {
if (this.props.value) {
var rootNodes = this.renderRootChildren();
var contentClass = classNames('p-tree-container', this.props.contentClassName);
return /*#__PURE__*/React__default["default"].createElement("ul", {
className: contentClass,
role: "tree",
"aria-label": this.props.ariaLabel,
"aria-labelledby": this.props.ariaLabelledBy,
style: this.props.contentStyle
}, rootNodes);
}
return null;
}
}, {
key: "renderLoader",
value: function renderLoader() {
if (this.props.loading) {
var icon = classNames('p-tree-loading-icon pi-spin', this.props.loadingIcon);
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-tree-loading-overlay p-component-overlay"
}, /*#__PURE__*/React__default["default"].createElement("i", {
className: icon
}));
}
return null;
}
}, {
key: "renderFilter",
value: function renderFilter() {
if (this.props.filter) {
var filterValue = this.getFilterValue();
filterValue = ObjectUtils.isNotEmpty(filterValue) ? filterValue : '';
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-tree-filter-container"
}, /*#__PURE__*/React__default["default"].createElement("input", {
type: "text",
value: filterValue,
autoComplete: "off",
className: "p-tree-filter p-inputtext p-component",
placeholder: this.props.filterPlaceholder,
onKeyDown: this.onFilterInputKeyDown,
onChange: this.onFilterInputChange,
disabled: this.props.disabled
}), /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-tree-filter-icon pi pi-search"
}));
}
return null;
}
}, {
key: "renderHeader",
value: function renderHeader() {
if (this.props.showHeader) {
var filterElement = this.renderFilter();
var content = filterElement;
if (this.props.header) {
var defaultContentOptions = {
filterContainerClassName: 'p-tree-filter-container',
filterIconClasssName: 'p-tree-filter-icon pi pi-search',
filterInput: {
className: 'p-tree-filter p-inputtext p-component',
onKeyDown: this.onFilterInputKeyDown,
onChange: this.onFilterInputChange
},
filterElement: filterElement,
element: content,
props: this.props
};
content = ObjectUtils.getJSXElement(this.props.header, defaultContentOptions);
}
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-tree-header"
}, content);
}
return null;
}
}, {
key: "renderFooter",
value: function renderFooter() {
var content = ObjectUtils.getJSXElement(this.props.footer, this.props);
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-tree-footer"
}, content);
}
}, {
key: "render",
value: function render() {
var className = classNames('p-tree p-component', this.props.className, {
'p-tree-selectable': this.props.selectionMode,
'p-tree-loading': this.props.loading,
'p-disabled': this.props.disabled
});
var loader = this.renderLoader();
var content = this.renderModel();
var header = this.renderHeader();
var footer = this.renderFooter();
return /*#__PURE__*/React__default["default"].createElement("div", {
id: this.props.id,
className: className,
style: this.props.style
}, loader, header, content, footer);
}
}]);
return Tree;
}(React.Component);
_defineProperty(Tree, "defaultProps", {
id: null,
value: null,
disabled: false,
selectionMode: null,
selectionKeys: null,
onSelectionChange: null,
contextMenuSelectionKey: null,
onContextMenuSelectionChange: null,
expandedKeys: null,
style: null,
className: null,
contentStyle: null,
contentClassName: null,
metaKeySelection: true,
propagateSelectionUp: true,
propagateSelectionDown: true,
loading: false,
loadingIcon: 'pi pi-spinner',
dragdropScope: null,
header: null,
footer: null,
showHeader: true,
filter: false,
filterValue: null,
filterBy: 'label',
filterMode: 'lenient',
filterPlaceholder: null,
filterLocale: undefined,
nodeTemplate: null,
togglerTemplate: null,
onSelect: null,
onUnselect: null,
onExpand: null,
onCollapse: null,
onToggle: null,
onDragDrop: null,
onContextMenu: null,
onFilterValueChange: null,
onNodeClick: null,
onNodeDoubleClick: null
});
function _createSuper$f(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$f(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$f() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var TreeSelectPanelComponent = /*#__PURE__*/function (_Component) {
_inherits(TreeSelectPanelComponent, _Component);
var _super = _createSuper$f(TreeSelectPanelComponent);
function TreeSelectPanelComponent() {
_classCallCheck(this, TreeSelectPanelComponent);
return _super.apply(this, arguments);
}
_createClass(TreeSelectPanelComponent, [{
key: "renderElement",
value: function renderElement() {
var className = classNames('p-treeselect-panel p-component', this.props.panelClassName);
return /*#__PURE__*/React__default["default"].createElement(CSSTransition, {
nodeRef: this.props.forwardRef,
classNames: "p-connected-overlay",
"in": this.props["in"],
timeout: {
enter: 120,
exit: 100
},
options: this.props.transitionOptions,
unmountOnExit: true,
onEnter: this.props.onEnter,
onEntering: this.props.onEntering,
onEntered: this.props.onEntered,
onExit: this.props.onExit,
onExited: this.props.onExited
}, /*#__PURE__*/React__default["default"].createElement("div", {
ref: this.props.forwardRef,
className: className,
style: this.props.panelStyle,
onClick: this.props.onClick
}, this.props.header, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-treeselect-items-wrapper",
style: {
maxHeight: this.props.scrollHeight || 'auto'
}
}, this.props.children), this.props.footer));
}
}, {
key: "render",
value: function render() {
var element = this.renderElement();
return /*#__PURE__*/React__default["default"].createElement(Portal, {
element: element,
appendTo: this.props.appendTo
});
}
}]);
return TreeSelectPanelComponent;
}(React.Component);
var TreeSelectPanel = /*#__PURE__*/React__default["default"].forwardRef(function (props, ref) {
return /*#__PURE__*/React__default["default"].createElement(TreeSelectPanelComponent, _extends({
forwardRef: ref
}, props));
});
function _createForOfIteratorHelper$4(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray$4(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it["return"] != null) it["return"](); } finally { if (didErr) throw err; } } }; }
function _unsupportedIterableToArray$4(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray$4(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray$4(o, minLen); }
function _arrayLikeToArray$4(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
function ownKeys$6(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$6(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$6(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$6(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createSuper$e(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$e(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$e() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var TreeSelect = /*#__PURE__*/function (_Component) {
_inherits(TreeSelect, _Component);
var _super = _createSuper$e(TreeSelect);
function TreeSelect(props) {
var _this;
_classCallCheck(this, TreeSelect);
_this = _super.call(this, props);
_this.state = {
focused: false,
overlayVisible: false,
expandedKeys: {}
};
if (!_this.props.onFilterValueChange) {
_this.state['filterValue'] = '';
}
_this.onClick = _this.onClick.bind(_assertThisInitialized(_this));
_this.onInputFocus = _this.onInputFocus.bind(_assertThisInitialized(_this));
_this.onInputBlur = _this.onInputBlur.bind(_assertThisInitialized(_this));
_this.onInputKeyDown = _this.onInputKeyDown.bind(_assertThisInitialized(_this));
_this.onFilterInputChange = _this.onFilterInputChange.bind(_assertThisInitialized(_this));
_this.onFilterInputKeyDown = _this.onFilterInputKeyDown.bind(_assertThisInitialized(_this));
_this.onOverlayClick = _this.onOverlayClick.bind(_assertThisInitialized(_this));
_this.onOverlayEnter = _this.onOverlayEnter.bind(_assertThisInitialized(_this));
_this.onOverlayEntered = _this.onOverlayEntered.bind(_assertThisInitialized(_this));
_this.onOverlayExit = _this.onOverlayExit.bind(_assertThisInitialized(_this));
_this.onOverlayExited = _this.onOverlayExited.bind(_assertThisInitialized(_this));
_this.onSelectionChange = _this.onSelectionChange.bind(_assertThisInitialized(_this));
_this.onNodeSelect = _this.onNodeSelect.bind(_assertThisInitialized(_this));
_this.onNodeUnselect = _this.onNodeUnselect.bind(_assertThisInitialized(_this));
_this.onNodeToggle = _this.onNodeToggle.bind(_assertThisInitialized(_this));
_this.onFilterValueChange = _this.onFilterValueChange.bind(_assertThisInitialized(_this));
_this.hide = _this.hide.bind(_assertThisInitialized(_this));
_this.show = _this.show.bind(_assertThisInitialized(_this));
_this.overlayRef = /*#__PURE__*/React.createRef();
return _this;
}
_createClass(TreeSelect, [{
key: "getFilterValue",
value: function getFilterValue() {
return this.props.onFilterValueChange ? this.props.filterValue : this.state.filterValue;
}
}, {
key: "getSelectedNodes",
value: function getSelectedNodes() {
var selectedNodes = [];
if (ObjectUtils.isNotEmpty(this.props.value) && this.props.options) {
var keys = this.props.selectionMode === 'single' ? _defineProperty({}, "".concat(this.props.value), true) : _objectSpread$6({}, this.props.value);
this.findSelectedNodes(null, keys, selectedNodes);
}
return selectedNodes;
}
}, {
key: "getLabel",
value: function getLabel() {
var value = this.getSelectedNodes();
return value.length ? value.map(function (node) {
return node.label;
}).join(', ') : this.props.placeholder;
}
}, {
key: "isValueEmpty",
value: function isValueEmpty() {
return !this.props.value || Object.keys(this.props.value).length === 0;
}
}, {
key: "hasNoOptions",
value: function hasNoOptions() {
return !this.props.options || this.props.options.length === 0;
}
}, {
key: "show",
value: function show() {
this.setState({
overlayVisible: true
});
}
}, {
key: "hide",
value: function hide() {
this.setState({
overlayVisible: false
});
}
}, {
key: "onInputFocus",
value: function onInputFocus() {
this.setState({
focused: true
});
}
}, {
key: "onInputBlur",
value: function onInputBlur() {
this.setState({
focused: false
});
}
}, {
key: "onClick",
value: function onClick(event) {
if (!this.props.disabled && (!this.overlayRef || !this.overlayRef.current || !this.overlayRef.current.contains(event.target)) && !DomHandler.hasClass(event.target, 'p-treeselect-close')) {
this.focusInput.focus();
if (this.state.overlayVisible) {
this.hide();
} else {
this.show();
}
}
}
}, {
key: "onSelectionChange",
value: function onSelectionChange(event) {
if (this.props.onChange) {
this.selfChange = true;
this.props.onChange({
originalEvent: event.originalEvent,
value: event.value,
stopPropagation: function stopPropagation() {},
preventDefault: function preventDefault() {},
target: {
name: this.props.name,
id: this.props.id,
value: event.value
}
});
}
}
}, {
key: "onNodeSelect",
value: function onNodeSelect(node) {
this.props.onNodeSelect && this.props.onNodeSelect(node);
if (this.props.selectionMode === 'single') {
this.hide();
}
}
}, {
key: "onNodeUnselect",
value: function onNodeUnselect(node) {
this.props.onNodeUnselect && this.props.onNodeUnselect(node);
}
}, {
key: "onNodeToggle",
value: function onNodeToggle(e) {
this.setState({
expandedKeys: e.value
});
}
}, {
key: "onFilterValueChange",
value: function onFilterValueChange(e) {
this.setState({
filterValue: e.value
});
}
}, {
key: "onOverlayClick",
value: function onOverlayClick(event) {
OverlayService.emit('overlay-click', {
originalEvent: event,
target: this.container
});
}
}, {
key: "onInputKeyDown",
value: function onInputKeyDown(event) {
switch (event.which) {
//down
case 40:
if (!this.state.overlayVisible && event.altKey) {
this.show();
}
break;
//space
case 32:
if (!this.state.overlayVisible) {
this.show();
event.preventDefault();
}
break;
//enter and escape
case 13:
case 27:
if (this.state.overlayVisible) {
this.hide();
event.preventDefault();
}
break;
//tab
case 9:
this.hide();
break;
}
}
}, {
key: "onFilterInputKeyDown",
value: function onFilterInputKeyDown(event) {
//enter
if (event.which === 13) {
event.preventDefault();
}
}
}, {
key: "onFilterInputChange",
value: function onFilterInputChange(event) {
var filterValue = event.target.value;
if (this.props.onFilterValueChange) {
this.props.onFilterValueChange({
originalEvent: event,
value: filterValue
});
} else {
this.setState({
filterValue: filterValue
});
}
}
}, {
key: "resetFilter",
value: function resetFilter() {
this.setState({
filterValue: ''
});
}
}, {
key: "onOverlayEnter",
value: function onOverlayEnter() {
ZIndexUtils.set('overlay', this.overlayRef.current, PrimeReact.autoZIndex, PrimeReact.zIndex['overlay']);
this.alignOverlay();
this.scrollInView();
}
}, {
key: "onOverlayEntered",
value: function onOverlayEntered() {
this.bindDocumentClickListener();
this.bindScrollListener();
this.bindResizeListener();
if (this.props.filter && this.props.filterInputAutoFocus) {
this.filterInput.focus();
}
this.props.onShow && this.props.onShow();
}
}, {
key: "onOverlayExit",
value: function onOverlayExit() {
this.unbindDocumentClickListener();
this.unbindScrollListener();
this.unbindResizeListener();
}
}, {
key: "onOverlayExited",
value: function onOverlayExited() {
if (this.props.filter && this.props.resetFilterOnHide) {
this.resetFilter();
}
ZIndexUtils.clear(this.overlayRef.current);
this.props.onHide && this.props.onHide();
}
}, {
key: "alignOverlay",
value: function alignOverlay() {
DomHandler.alignOverlay(this.overlayRef.current, this.trigger.parentElement, this.props.appendTo || PrimeReact.appendTo);
}
}, {
key: "scrollInView",
value: function scrollInView() {
var highlightItem = DomHandler.findSingle(this.overlayRef.current, '.p-treenode-content.p-highlight');
if (highlightItem) {
highlightItem.scrollIntoView({
block: 'nearest',
inline: 'start'
});
}
}
}, {
key: "bindDocumentClickListener",
value: function bindDocumentClickListener() {
var _this2 = this;
if (!this.documentClickListener) {
this.documentClickListener = function (event) {
if (_this2.state.overlayVisible && _this2.isOutsideClicked(event)) {
_this2.hide();
}
};
document.addEventListener('click', this.documentClickListener);
}
}
}, {
key: "unbindDocumentClickListener",
value: function unbindDocumentClickListener() {
if (this.documentClickListener) {
document.removeEventListener('click', this.documentClickListener);
this.documentClickListener = null;
}
}
}, {
key: "bindScrollListener",
value: function bindScrollListener() {
var _this3 = this;
if (!this.scrollHandler) {
this.scrollHandler = new ConnectedOverlayScrollHandler(this.container, function () {
if (_this3.state.overlayVisible) {
_this3.hide();
}
});
}
this.scrollHandler.bindScrollListener();
}
}, {
key: "unbindScrollListener",
value: function unbindScrollListener() {
if (this.scrollHandler) {
this.scrollHandler.unbindScrollListener();
}
}
}, {
key: "bindResizeListener",
value: function bindResizeListener() {
var _this4 = this;
if (!this.resizeListener) {
this.resizeListener = function () {
if (_this4.state.overlayVisible && !DomHandler.isTouchDevice()) {
_this4.hide();
}
};
window.addEventListener('resize', this.resizeListener);
}
}
}, {
key: "unbindResizeListener",
value: function unbindResizeListener() {
if (this.resizeListener) {
window.removeEventListener('resize', this.resizeListener);
this.resizeListener = null;
}
}
}, {
key: "isOutsideClicked",
value: function isOutsideClicked(event) {
return this.container && !(this.container.isSameNode(event.target) || this.container.contains(event.target) || this.overlayRef && this.overlayRef.current.contains(event.target));
}
}, {
key: "findSelectedNodes",
value: function findSelectedNodes(node, keys, selectedNodes) {
if (node) {
if (this.isSelected(node, keys)) {
selectedNodes.push(node);
delete keys[node.key];
}
if (Object.keys(keys).length && node.children) {
var _iterator = _createForOfIteratorHelper$4(node.children),
_step;
try {
for (_iterator.s(); !(_step = _iterator.n()).done;) {
var childNode = _step.value;
this.findSelectedNodes(childNode, keys, selectedNodes);
}
} catch (err) {
_iterator.e(err);
} finally {
_iterator.f();
}
}
} else {
var _iterator2 = _createForOfIteratorHelper$4(this.props.options),
_step2;
try {
for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
var _childNode = _step2.value;
this.findSelectedNodes(_childNode, keys, selectedNodes);
}
} catch (err) {
_iterator2.e(err);
} finally {
_iterator2.f();
}
}
}
}, {
key: "isSelected",
value: function isSelected(node, keys) {
return this.props.selectionMode === 'checkbox' ? keys[node.key] && keys[node.key].checked : keys[node.key];
}
}, {
key: "updateTreeState",
value: function updateTreeState() {
var keys = this.props.selectionMode === 'single' ? _defineProperty({}, "".concat(this.props.value), true) : _objectSpread$6({}, this.props.value);
this.setState({
expandedKeys: {}
});
if (keys && this.props.options) {
this.updateTreeBranchState(null, null, keys);
}
}
}, {
key: "updateTreeBranchState",
value: function updateTreeBranchState(node, path, keys) {
if (node) {
if (this.isSelected(node, keys)) {
this.expandPath(path);
delete keys[node.key];
}
if (Object.keys(keys).length && node.children) {
var _iterator3 = _createForOfIteratorHelper$4(node.children),
_step3;
try {
for (_iterator3.s(); !(_step3 = _iterator3.n()).done;) {
var childNode = _step3.value;
path.push(node.key);
this.updateTreeBranchState(childNode, path, keys);
}
} catch (err) {
_iterator3.e(err);
} finally {
_iterator3.f();
}
}
} else {
var _iterator4 = _createForOfIteratorHelper$4(this.props.options),
_step4;
try {
for (_iterator4.s(); !(_step4 = _iterator4.n()).done;) {
var _childNode2 = _step4.value;
this.updateTreeBranchState(_childNode2, [], keys);
}
} catch (err) {
_iterator4.e(err);
} finally {
_iterator4.f();
}
}
}
}, {
key: "expandPath",
value: function expandPath(path) {
if (path.length > 0) {
var expandedKeys = _objectSpread$6({}, this.state.expandedKeys || {});
var _iterator5 = _createForOfIteratorHelper$4(path),
_step5;
try {
for (_iterator5.s(); !(_step5 = _iterator5.n()).done;) {
var key = _step5.value;
expandedKeys[key] = true;
}
} catch (err) {
_iterator5.e(err);
} finally {
_iterator5.f();
}
this.setState({
expandedKeys: expandedKeys
});
}
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
this.updateTreeState();
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps, prevState) {
if (this.state.overlayVisible) {
if (this.props.filter || prevState.expandedKeys !== this.state.expandedKeys) {
this.alignOverlay();
}
if (prevProps.value !== this.props.value) {
if (!this.selfChange) {
this.updateTreeState();
}
this.scrollInView();
this.selfChange = false;
}
}
if (prevProps.options !== this.props.options) {
this.updateTreeState();
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
this.unbindDocumentClickListener();
this.unbindResizeListener();
if (this.scrollHandler) {
this.scrollHandler.destroy();
this.scrollHandler = null;
}
ZIndexUtils.clear(this.overlayRef.current);
}
}, {
key: "renderKeyboardHelper",
value: function renderKeyboardHelper() {
var _this5 = this;
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-hidden-accessible"
}, /*#__PURE__*/React__default["default"].createElement("input", {
ref: function ref(el) {
return _this5.focusInput = el;
},
role: "listbox",
id: this.props.inputId,
type: "text",
readOnly: true,
"aria-haspopup": "true",
"aria-expanded": this.state.overlayVisible,
onFocus: this.onInputFocus,
onBlur: this.onInputBlur,
onKeyDown: this.onInputKeyDown,
disabled: this.props.disabled,
tabIndex: this.props.tabIndex,
"aria-label": this.props.ariaLabel,
"aria-labelledby": this.props.ariaLabelledBy
}));
}
}, {
key: "renderLabel",
value: function renderLabel(selectedNodes) {
var isValueEmpty = this.isValueEmpty();
var labelClassName = classNames('p-treeselect-label', {
'p-placeholder': this.getLabel() === this.props.placeholder,
'p-treeselect-label-empty': !this.props.placeholder && isValueEmpty
});
var content = null;
if (this.props.valueTemplate) {
content = ObjectUtils.getJSXElement(this.props.valueTemplate, selectedNodes, this.props);
} else {
if (this.props.display === 'comma') {
content = this.getLabel() || 'empty';
} else if (this.props.display === 'chip') {
var _selectedNodes = this.getSelectedNodes();
content = /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, _selectedNodes && _selectedNodes.map(function (node, index) {
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-treeselect-token",
key: "".concat(node.key, "_").concat(index)
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-treeselect-token-label"
}, node.label));
}), isValueEmpty && (this.props.placeholder || 'empty'));
}
}
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-treeselect-label-container"
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: labelClassName
}, content));
}
}, {
key: "renderDropdownIcon",
value: function renderDropdownIcon() {
var _this6 = this;
var iconClassName = classNames('p-treeselect-trigger-icon p-clickable', this.props.dropdownIcon);
return /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this6.trigger = el;
},
className: "p-treeselect-trigger",
role: "button",
"aria-haspopup": "listbox",
"aria-expanded": this.state.overlayVisible
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: iconClassName
}));
}
}, {
key: "renderContent",
value: function renderContent() {
var filterValue = this.getFilterValue();
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(Tree, {
value: this.props.options,
selectionMode: this.props.selectionMode,
selectionKeys: this.props.value,
metaKeySelection: this.props.metaKeySelection,
onSelectionChange: this.onSelectionChange,
onSelect: this.onNodeSelect,
onUnselect: this.onNodeUnselect,
expandedKeys: this.state.expandedKeys,
onToggle: this.onNodeToggle,
onExpand: this.props.onNodeExpand,
onCollapse: this.props.onNodeCollapse,
filter: this.props.filter,
filterValue: filterValue,
filterBy: this.props.filterBy,
filterMode: this.props.filterMode,
filterPlaceholder: this.props.filterPlaceholder,
filterLocale: this.props.filterLocale,
showHeader: false,
onFilterValueChange: this.onFilterValueChange
}), this.hasNoOptions() && /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-treeselect-empty-message"
}, this.props.emptyMessage || localeOption('emptyMessage')));
}
}, {
key: "renderFilterElement",
value: function renderFilterElement() {
var _this7 = this;
if (this.props.filter) {
var filterValue = this.getFilterValue();
filterValue = ObjectUtils.isNotEmpty(filterValue) ? filterValue : '';
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-treeselect-filter-container"
}, /*#__PURE__*/React__default["default"].createElement("input", {
ref: function ref(el) {
return _this7.filterInput = el;
},
type: "text",
value: filterValue,
autoComplete: "off",
className: "p-treeselect-filter p-inputtext p-component",
placeholder: this.props.filterPlaceholder,
onKeyDown: this.onFilterInputKeyDown,
onChange: this.onFilterInputChange,
disabled: this.props.disabled
}), /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-treeselect-filter-icon pi pi-search"
}));
}
return null;
}
}, {
key: "renderHeader",
value: function renderHeader() {
var filterElement = this.renderFilterElement();
var closeElement = /*#__PURE__*/React__default["default"].createElement("button", {
type: "button",
className: "p-treeselect-close p-link",
onClick: this.hide
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-treeselect-close-icon pi pi-times"
}), /*#__PURE__*/React__default["default"].createElement(Ripple, null));
var content = /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-treeselect-header"
}, filterElement, closeElement);
if (this.props.header) {
var defaultOptions = {
className: 'p-treeselect-header',
filterElement: filterElement,
closeElement: closeElement,
closeElementClassName: 'p-treeselect-close p-link',
closeIconClassName: 'p-treeselect-close-icon pi pi-times',
onCloseClick: this.hide,
element: content,
props: this.props
};
return ObjectUtils.getJSXElement(this.props.header, defaultOptions);
}
return content;
}
}, {
key: "render",
value: function render() {
var _this8 = this;
var className = classNames('p-treeselect p-component p-inputwrapper', {
'p-treeselect-chip': this.props.display === 'chip',
'p-disabled': this.props.disabled,
'p-focus': this.state.focused,
'p-inputwrapper-filled': !this.isValueEmpty(),
'p-inputwrapper-focus': this.state.focused || this.state.overlayVisible
}, this.props.className);
var selectedNodes = this.getSelectedNodes();
var keyboardHelper = this.renderKeyboardHelper();
var labelElement = this.renderLabel(selectedNodes);
var dropdownIcon = this.renderDropdownIcon();
var content = this.renderContent();
var header = this.renderHeader();
var footer = ObjectUtils.getJSXElement(this.props.footer, this.props);
return /*#__PURE__*/React__default["default"].createElement("div", {
id: this.props.id,
ref: function ref(el) {
return _this8.container = el;
},
className: className,
style: this.props.style,
onClick: this.onClick
}, keyboardHelper, labelElement, dropdownIcon, /*#__PURE__*/React__default["default"].createElement(TreeSelectPanel, {
ref: this.overlayRef,
appendTo: this.props.appendTo,
panelStyle: this.props.panelStyle,
panelClassName: this.props.panelClassName,
scrollHeight: this.props.scrollHeight,
onClick: this.onOverlayClick,
header: header,
footer: footer,
transitionOptions: this.props.transitionOptions,
"in": this.state.overlayVisible,
onEnter: this.onOverlayEnter,
onEntered: this.onOverlayEntered,
onExit: this.onOverlayExit,
onExited: this.onOverlayExited
}, content));
}
}]);
return TreeSelect;
}(React.Component);
_defineProperty(TreeSelect, "defaultProps", {
id: null,
value: null,
name: null,
style: null,
className: null,
disabled: false,
options: null,
scrollHeight: '400px',
placeholder: null,
tabIndex: null,
inputId: null,
ariaLabel: null,
ariaLabelledBy: null,
selectionMode: 'single',
panelStyle: null,
panelClassName: null,
appendTo: null,
emptyMessage: null,
display: 'comma',
metaKeySelection: true,
valueTemplate: null,
panelHeaderTemplate: null,
panelFooterTemplate: null,
transitionOptions: null,
dropdownIcon: 'pi pi-chevron-down',
filter: false,
filterValue: null,
filterBy: 'label',
filterMode: 'lenient',
filterPlaceholder: null,
filterLocale: undefined,
filterInputAutoFocus: true,
resetFilterOnHide: false,
onShow: null,
onHide: null,
onChange: null,
onNodeSelect: null,
onNodeUnselect: null,
onNodeExpand: null,
onNodeCollapse: null,
onFilterValueChange: null
});
function _createForOfIteratorHelper$3(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray$3(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it["return"] != null) it["return"](); } finally { if (didErr) throw err; } } }; }
function _unsupportedIterableToArray$3(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray$3(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray$3(o, minLen); }
function _arrayLikeToArray$3(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
function _createSuper$d(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$d(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$d() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var TreeTableHeader = /*#__PURE__*/function (_Component) {
_inherits(TreeTableHeader, _Component);
var _super = _createSuper$d(TreeTableHeader);
function TreeTableHeader(props) {
var _this;
_classCallCheck(this, TreeTableHeader);
_this = _super.call(this, props);
_this.state = {
badgeVisible: false
};
_this.onFilterInput = _this.onFilterInput.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(TreeTableHeader, [{
key: "onHeaderClick",
value: function onHeaderClick(event, column) {
if (column.props.sortable) {
var targetNode = event.target;
if (DomHandler.hasClass(targetNode, 'p-sortable-column') || DomHandler.hasClass(targetNode, 'p-column-title') || DomHandler.hasClass(targetNode, 'p-sortable-column-icon') || DomHandler.hasClass(targetNode.parentElement, 'p-sortable-column-icon')) {
this.props.onSort({
originalEvent: event,
sortField: column.props.sortField || column.props.field,
sortFunction: column.props.sortFunction,
sortable: column.props.sortable
});
DomHandler.clearSelection();
}
}
}
}, {
key: "onHeaderMouseDown",
value: function onHeaderMouseDown(event, column) {
if (this.props.reorderableColumns && column.props.reorderable) {
if (event.target.nodeName !== 'INPUT') event.currentTarget.draggable = true;else if (event.target.nodeName === 'INPUT') event.currentTarget.draggable = false;
}
}
}, {
key: "onHeaderKeyDown",
value: function onHeaderKeyDown(event, column) {
if (event.key === 'Enter') {
this.onHeaderClick(event, column);
event.preventDefault();
}
}
}, {
key: "getMultiSortMetaDataIndex",
value: function getMultiSortMetaDataIndex(column) {
if (this.props.multiSortMeta) {
for (var i = 0; i < this.props.multiSortMeta.length; i++) {
if (this.props.multiSortMeta[i].field === column.props.field) {
return i;
}
}
}
return -1;
}
}, {
key: "onResizerMouseDown",
value: function onResizerMouseDown(event, column) {
if (this.props.resizableColumns && this.props.onResizeStart) {
this.props.onResizeStart({
originalEvent: event,
columnEl: event.target.parentElement,
column: column
});
}
}
}, {
key: "onDragStart",
value: function onDragStart(event, column) {
if (this.props.onDragStart) {
this.props.onDragStart({
originalEvent: event,
column: column
});
}
}
}, {
key: "onDragOver",
value: function onDragOver(event, column) {
if (this.props.onDragOver) {
this.props.onDragOver({
originalEvent: event,
column: column
});
}
}
}, {
key: "onDragLeave",
value: function onDragLeave(event, column) {
if (this.props.onDragLeave) {
this.props.onDragLeave({
originalEvent: event,
column: column
});
}
}
}, {
key: "onDrop",
value: function onDrop(event, column) {
if (this.props.onDrop) {
this.props.onDrop({
originalEvent: event,
column: column
});
}
}
}, {
key: "onFilterInput",
value: function onFilterInput(e, column) {
var _this2 = this;
if (column.props.filter && this.props.onFilter) {
if (this.filterTimeout) {
clearTimeout(this.filterTimeout);
}
var filterValue = e.target.value;
this.filterTimeout = setTimeout(function () {
_this2.props.onFilter({
value: filterValue,
field: column.props.field,
matchMode: column.props.filterMatchMode || 'startsWith'
});
_this2.filterTimeout = null;
}, this.props.filterDelay);
}
}
}, {
key: "hasColumnFilter",
value: function hasColumnFilter(columns) {
if (columns) {
var _iterator = _createForOfIteratorHelper$3(columns),
_step;
try {
for (_iterator.s(); !(_step = _iterator.n()).done;) {
var col = _step.value;
if (col.props.filter) {
return true;
}
}
} catch (err) {
_iterator.e(err);
} finally {
_iterator.f();
}
}
return false;
}
}, {
key: "renderSortIcon",
value: function renderSortIcon(column, sorted, sortOrder) {
if (column.props.sortable) {
var sortIcon = sorted ? sortOrder < 0 ? 'pi-sort-amount-down' : 'pi-sort-amount-up-alt' : 'pi-sort-alt';
var sortIconClassName = classNames('p-sortable-column-icon', 'pi pi-fw', sortIcon);
return /*#__PURE__*/React__default["default"].createElement("span", {
className: sortIconClassName
});
} else {
return null;
}
}
}, {
key: "renderResizer",
value: function renderResizer(column) {
var _this3 = this;
if (this.props.resizableColumns) {
return /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-column-resizer p-clickable",
onMouseDown: function onMouseDown(e) {
return _this3.onResizerMouseDown(e, column);
}
});
} else {
return null;
}
}
}, {
key: "getAriaSort",
value: function getAriaSort(column, sorted, sortOrder) {
if (column.props.sortable) {
var sortIcon = sorted ? sortOrder < 0 ? 'pi-sort-down' : 'pi-sort-up' : 'pi-sort';
if (sortIcon === 'pi-sort-down') return 'descending';else if (sortIcon === 'pi-sort-up') return 'ascending';else return 'none';
} else {
return null;
}
}
}, {
key: "renderSortBadge",
value: function renderSortBadge(sortMetaDataIndex) {
if (sortMetaDataIndex !== -1 && this.state.badgeVisible) {
return /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-sortable-column-badge"
}, sortMetaDataIndex + 1);
}
return null;
}
}, {
key: "renderHeaderCell",
value: function renderHeaderCell(column, options) {
var _this4 = this;
var filterElement;
if (column.props.filter && options.renderFilter) {
filterElement = column.props.filterElement || /*#__PURE__*/React__default["default"].createElement(InputText, {
onInput: function onInput(e) {
return _this4.onFilterInput(e, column);
},
type: this.props.filterType,
defaultValue: this.props.filters && this.props.filters[column.props.field] ? this.props.filters[column.props.field].value : null,
className: "p-column-filter",
placeholder: column.props.filterPlaceholder,
maxLength: column.props.filterMaxLength
});
}
if (options.filterOnly) {
return /*#__PURE__*/React__default["default"].createElement("th", {
key: column.props.columnKey || column.props.field || options.index,
className: classNames('p-filter-column', column.props.filterHeaderClassName),
style: column.props.filterHeaderStyle || column.props.style,
rowSpan: column.props.rowSpan,
colSpan: column.props.colSpan
}, filterElement);
} else {
var sortMetaDataIndex = this.getMultiSortMetaDataIndex(column);
var multiSortMetaData = sortMetaDataIndex !== -1 ? this.props.multiSortMeta[sortMetaDataIndex] : null;
var singleSorted = column.props.field === this.props.sortField;
var multipleSorted = multiSortMetaData !== null;
var sorted = column.props.sortable && (singleSorted || multipleSorted);
var sortOrder = 0;
if (singleSorted) sortOrder = this.props.sortOrder;else if (multipleSorted) sortOrder = multiSortMetaData.order;
var sortIconElement = this.renderSortIcon(column, sorted, sortOrder);
var ariaSortData = this.getAriaSort(column, sorted, sortOrder);
var sortBadge = this.renderSortBadge(sortMetaDataIndex);
var className = classNames(column.props.headerClassName || column.props.className, {
'p-sortable-column': column.props.sortable,
'p-highlight': sorted,
'p-resizable-column': this.props.resizableColumns
});
var resizer = this.renderResizer(column);
return /*#__PURE__*/React__default["default"].createElement("th", {
key: column.columnKey || column.field || options.index,
className: className,
style: column.props.headerStyle || column.props.style,
tabIndex: column.props.sortable ? this.props.tabIndex : null,
onClick: function onClick(e) {
return _this4.onHeaderClick(e, column);
},
onMouseDown: function onMouseDown(e) {
return _this4.onHeaderMouseDown(e, column);
},
onKeyDown: function onKeyDown(e) {
return _this4.onHeaderKeyDown(e, column);
},
rowSpan: column.props.rowSpan,
colSpan: column.props.colSpan,
"aria-sort": ariaSortData,
onDragStart: function onDragStart(e) {
return _this4.onDragStart(e, column);
},
onDragOver: function onDragOver(e) {
return _this4.onDragOver(e, column);
},
onDragLeave: function onDragLeave(e) {
return _this4.onDragLeave(e, column);
},
onDrop: function onDrop(e) {
return _this4.onDrop(e, column);
}
}, resizer, /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-column-title"
}, column.props.header), sortIconElement, sortBadge, filterElement);
}
}
}, {
key: "renderHeaderRow",
value: function renderHeaderRow(row, index) {
var _this5 = this;
var rowColumns = React__default["default"].Children.toArray(row.props.children);
var rowHeaderCells = rowColumns.map(function (col, i) {
return _this5.renderHeaderCell(col, {
index: i,
filterOnly: false,
renderFilter: true
});
});
return /*#__PURE__*/React__default["default"].createElement("tr", {
key: index
}, rowHeaderCells);
}
}, {
key: "renderColumnGroup",
value: function renderColumnGroup() {
var _this6 = this;
var rows = React__default["default"].Children.toArray(this.props.columnGroup.props.children);
return rows.map(function (row, i) {
return _this6.renderHeaderRow(row, i);
});
}
}, {
key: "renderColumns",
value: function renderColumns(columns) {
var _this7 = this;
if (columns) {
if (this.hasColumnFilter(columns)) {
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("tr", null, columns.map(function (col, i) {
return _this7.renderHeaderCell(col, {
index: i,
filterOnly: false,
renderFilter: false
});
})), /*#__PURE__*/React__default["default"].createElement("tr", null, columns.map(function (col, i) {
return _this7.renderHeaderCell(col, {
index: i,
filterOnly: true,
renderFilter: true
});
})));
} else {
return /*#__PURE__*/React__default["default"].createElement("tr", null, columns.map(function (col, i) {
return _this7.renderHeaderCell(col, {
index: i,
filterOnly: false,
renderFilter: false
});
}));
}
} else {
return null;
}
}
}, {
key: "render",
value: function render() {
var content = this.props.columnGroup ? this.renderColumnGroup() : this.renderColumns(this.props.columns);
return /*#__PURE__*/React__default["default"].createElement("thead", {
className: "p-treetable-thead"
}, content);
}
}], [{
key: "getDerivedStateFromProps",
value: function getDerivedStateFromProps(nextProps, prevState) {
return {
badgeVisible: nextProps.multiSortMeta && nextProps.multiSortMeta.length > 1
};
}
}]);
return TreeTableHeader;
}(React.Component);
function _createSuper$c(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$c(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$c() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var TreeTableBodyCell = /*#__PURE__*/function (_Component) {
_inherits(TreeTableBodyCell, _Component);
var _super = _createSuper$c(TreeTableBodyCell);
function TreeTableBodyCell(props) {
var _this;
_classCallCheck(this, TreeTableBodyCell);
_this = _super.call(this, props);
if (_this.props.editor) {
_this.state = {};
}
_this.onClick = _this.onClick.bind(_assertThisInitialized(_this));
_this.onKeyDown = _this.onKeyDown.bind(_assertThisInitialized(_this));
_this.onEditorFocus = _this.onEditorFocus.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(TreeTableBodyCell, [{
key: "onClick",
value: function onClick() {
var _this2 = this;
if (this.props.editor && !this.state.editing && (this.props.selectOnEdit || !this.props.selectOnEdit && this.props.selected)) {
this.selfClick = true;
this.setState({
editing: true
}, function () {
_this2.bindDocumentEditListener();
_this2.overlayEventListener = function (e) {
if (!_this2.isOutsideClicked(e.target)) {
_this2.selfClick = true;
}
};
OverlayService.on('overlay-click', _this2.overlayEventListener);
});
}
}
}, {
key: "onKeyDown",
value: function onKeyDown(event) {
if (event.which === 13 || event.which === 9) {
this.switchCellToViewMode(event);
}
}
}, {
key: "bindDocumentEditListener",
value: function bindDocumentEditListener() {
var _this3 = this;
if (!this.documentEditListener) {
this.documentEditListener = function (e) {
if (!_this3.selfClick && _this3.isOutsideClicked(e.target)) {
_this3.switchCellToViewMode(e);
}
_this3.selfClick = false;
};
document.addEventListener('click', this.documentEditListener);
}
}
}, {
key: "isOutsideClicked",
value: function isOutsideClicked(target) {
return this.container && !(this.container.isSameNode(target) || this.container.contains(target));
}
}, {
key: "unbindDocumentEditListener",
value: function unbindDocumentEditListener() {
if (this.documentEditListener) {
document.removeEventListener('click', this.documentEditListener);
this.documentEditListener = null;
this.selfClick = false;
}
}
}, {
key: "closeCell",
value: function closeCell() {
var _this4 = this;
/* When using the 'tab' key, the focus event of the next cell is not called in IE. */
setTimeout(function () {
_this4.setState({
editing: false
}, function () {
_this4.unbindDocumentEditListener();
OverlayService.off('overlay-click', _this4.overlayEventListener);
_this4.overlayEventListener = null;
});
}, 1);
}
}, {
key: "onEditorFocus",
value: function onEditorFocus(event) {
this.onClick(event);
}
}, {
key: "switchCellToViewMode",
value: function switchCellToViewMode(event) {
if (this.props.cellEditValidator) {
var valid = this.props.cellEditValidator({
originalEvent: event,
columnProps: this.props
});
if (valid) {
this.closeCell();
}
} else {
this.closeCell();
}
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate() {
var _this5 = this;
if (this.container && this.props.editor) {
clearTimeout(this.tabindexTimeout);
if (this.state && this.state.editing) {
var focusable = DomHandler.findSingle(this.container, 'input');
if (focusable && document.activeElement !== focusable && !focusable.hasAttribute('data-isCellEditing')) {
focusable.setAttribute('data-isCellEditing', true);
focusable.focus();
}
this.keyHelper.tabIndex = -1;
} else {
this.tabindexTimeout = setTimeout(function () {
if (_this5.keyHelper) {
_this5.keyHelper.setAttribute('tabindex', 0);
}
}, 50);
}
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
this.unbindDocumentEditListener();
if (this.overlayEventListener) {
OverlayService.off('overlay-click', this.overlayEventListener);
this.overlayEventListener = null;
}
}
}, {
key: "render",
value: function render() {
var _this6 = this;
var className = classNames(this.props.bodyClassName || this.props.className, {
'p-editable-column': this.props.editor,
'p-cell-editing': this.props.editor ? this.state.editing : false
});
var style = this.props.bodyStyle || this.props.style;
var content;
if (this.state && this.state.editing) {
if (this.props.editor) content = ObjectUtils.getJSXElement(this.props.editor, {
node: this.props.node,
rowData: this.props.node.data,
value: ObjectUtils.resolveFieldData(this.props.node.data, this.props.field),
field: this.props.field,
rowIndex: this.props.rowIndex,
props: this.props
});else throw new Error("Editor is not found on column.");
} else {
if (this.props.body) content = ObjectUtils.getJSXElement(this.props.body, this.props.node, {
field: this.props.field,
rowIndex: this.props.rowIndex,
props: this.props
});else content = ObjectUtils.resolveFieldData(this.props.node.data, this.props.field);
}
/* eslint-disable */
var editorKeyHelper = this.props.editor && /*#__PURE__*/React__default["default"].createElement("a", {
tabIndex: 0,
ref: function ref(el) {
_this6.keyHelper = el;
},
className: "p-cell-editor-key-helper p-hidden-accessible",
onFocus: this.onEditorFocus
}, /*#__PURE__*/React__default["default"].createElement("span", null));
/* eslint-enable */
return /*#__PURE__*/React__default["default"].createElement("td", {
ref: function ref(el) {
return _this6.container = el;
},
className: className,
style: style,
onClick: this.onClick,
onKeyDown: this.onKeyDown
}, this.props.children, editorKeyHelper, content);
}
}]);
return TreeTableBodyCell;
}(React.Component);
function _createForOfIteratorHelper$2(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray$2(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it["return"] != null) it["return"](); } finally { if (didErr) throw err; } } }; }
function _unsupportedIterableToArray$2(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray$2(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray$2(o, minLen); }
function _arrayLikeToArray$2(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
function ownKeys$5(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$5(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$5(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$5(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createSuper$b(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$b(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$b() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var TreeTableRow = /*#__PURE__*/function (_Component) {
_inherits(TreeTableRow, _Component);
var _super = _createSuper$b(TreeTableRow);
function TreeTableRow(props) {
var _this;
_classCallCheck(this, TreeTableRow);
_this = _super.call(this, props);
_this.onTogglerClick = _this.onTogglerClick.bind(_assertThisInitialized(_this));
_this.onClick = _this.onClick.bind(_assertThisInitialized(_this));
_this.onTouchEnd = _this.onTouchEnd.bind(_assertThisInitialized(_this));
_this.propagateUp = _this.propagateUp.bind(_assertThisInitialized(_this));
_this.onCheckboxChange = _this.onCheckboxChange.bind(_assertThisInitialized(_this));
_this.onCheckboxFocus = _this.onCheckboxFocus.bind(_assertThisInitialized(_this));
_this.onCheckboxBlur = _this.onCheckboxBlur.bind(_assertThisInitialized(_this));
_this.onRightClick = _this.onRightClick.bind(_assertThisInitialized(_this));
_this.onKeyDown = _this.onKeyDown.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(TreeTableRow, [{
key: "isLeaf",
value: function isLeaf() {
return this.props.node.leaf === false ? false : !(this.props.node.children && this.props.node.children.length);
}
}, {
key: "onTogglerClick",
value: function onTogglerClick(event) {
if (this.isExpanded()) this.collapse(event);else this.expand(event);
event.preventDefault();
event.stopPropagation();
}
}, {
key: "expand",
value: function expand(event) {
var expandedKeys = this.props.expandedKeys ? _objectSpread$5({}, this.props.expandedKeys) : {};
expandedKeys[this.props.node.key] = true;
this.props.onToggle({
originalEvent: event,
value: expandedKeys
});
this.invokeToggleEvents(event, true);
}
}, {
key: "collapse",
value: function collapse(event) {
var expandedKeys = _objectSpread$5({}, this.props.expandedKeys);
delete expandedKeys[this.props.node.key];
this.props.onToggle({
originalEvent: event,
value: expandedKeys
});
this.invokeToggleEvents(event, false);
}
}, {
key: "invokeToggleEvents",
value: function invokeToggleEvents(event, expanded) {
if (expanded) {
if (this.props.onExpand) {
this.props.onExpand({
originalEvent: event,
node: this.props.node
});
}
} else {
if (this.props.onCollapse) {
this.props.onCollapse({
originalEvent: event,
node: this.props.node
});
}
}
}
}, {
key: "onClick",
value: function onClick(event) {
if (this.props.onRowClick) {
this.props.onRowClick(event, this.props.node);
}
this.nodeTouched = false;
}
}, {
key: "onTouchEnd",
value: function onTouchEnd() {
this.nodeTouched = true;
}
}, {
key: "onCheckboxChange",
value: function onCheckboxChange(event) {
var checked = this.isChecked();
var selectionKeys = this.props.selectionKeys ? _objectSpread$5({}, this.props.selectionKeys) : {};
if (checked) {
if (this.props.propagateSelectionDown) this.propagateDown(this.props.node, false, selectionKeys);else delete selectionKeys[this.props.node.key];
if (this.props.propagateSelectionUp && this.props.onPropagateUp) {
this.props.onPropagateUp({
originalEvent: event,
check: false,
selectionKeys: selectionKeys
});
}
if (this.props.onUnselect) {
this.props.onUnselect({
originalEvent: event,
node: this.props.node
});
}
} else {
if (this.props.propagateSelectionDown) this.propagateDown(this.props.node, true, selectionKeys);else selectionKeys[this.props.node.key] = {
checked: true
};
if (this.props.propagateSelectionUp && this.props.onPropagateUp) {
this.props.onPropagateUp({
originalEvent: event,
check: true,
selectionKeys: selectionKeys
});
}
if (this.props.onSelect) {
this.props.onSelect({
originalEvent: event,
node: this.props.node
});
}
}
if (this.props.onSelectionChange) {
this.props.onSelectionChange({
originalEvent: event,
value: selectionKeys
});
}
DomHandler.clearSelection();
}
}, {
key: "onCheckboxFocus",
value: function onCheckboxFocus() {
DomHandler.addClass(this.checkboxBox, 'p-focus');
DomHandler.addClass(this.checkboxRef, 'p-checkbox-focused');
}
}, {
key: "onCheckboxBlur",
value: function onCheckboxBlur() {
DomHandler.removeClass(this.checkboxBox, 'p-focus');
DomHandler.removeClass(this.checkboxRef, 'p-checkbox-focused');
}
}, {
key: "propagateUp",
value: function propagateUp(event) {
var check = event.check;
var selectionKeys = event.selectionKeys;
var checkedChildCount = 0;
var childPartialSelected = false;
var _iterator = _createForOfIteratorHelper$2(this.props.node.children),
_step;
try {
for (_iterator.s(); !(_step = _iterator.n()).done;) {
var child = _step.value;
if (selectionKeys[child.key] && selectionKeys[child.key].checked) checkedChildCount++;else if (selectionKeys[child.key] && selectionKeys[child.key].partialChecked) childPartialSelected = true;
}
} catch (err) {
_iterator.e(err);
} finally {
_iterator.f();
}
if (check && checkedChildCount === this.props.node.children.length) {
selectionKeys[this.props.node.key] = {
checked: true,
partialChecked: false
};
} else {
if (!check) {
delete selectionKeys[this.props.node.key];
}
if (childPartialSelected || checkedChildCount > 0 && checkedChildCount !== this.props.node.children.length) selectionKeys[this.props.node.key] = {
checked: false,
partialChecked: true
};else selectionKeys[this.props.node.key] = {
checked: false,
partialChecked: false
};
}
if (this.props.propagateSelectionUp && this.props.onPropagateUp) {
this.props.onPropagateUp(event);
}
}
}, {
key: "propagateDown",
value: function propagateDown(node, check, selectionKeys) {
if (check) selectionKeys[node.key] = {
checked: true,
partialChecked: false
};else delete selectionKeys[node.key];
if (node.children && node.children.length) {
for (var i = 0; i < node.children.length; i++) {
this.propagateDown(node.children[i], check, selectionKeys);
}
}
}
}, {
key: "onRightClick",
value: function onRightClick(event) {
DomHandler.clearSelection();
if (this.props.onContextMenuSelectionChange) {
this.props.onContextMenuSelectionChange({
originalEvent: event,
value: this.props.node.key
});
}
if (this.props.onContextMenu) {
this.props.onContextMenu({
originalEvent: event,
node: this.props.node
});
}
}
}, {
key: "onKeyDown",
value: function onKeyDown(event) {
if (event.target === this.container) {
var rowElement = event.currentTarget;
switch (event.which) {
//down arrow
case 40:
var nextRow = rowElement.nextElementSibling;
if (nextRow) {
nextRow.focus();
}
event.preventDefault();
break;
//up arrow
case 38:
var previousRow = rowElement.previousElementSibling;
if (previousRow) {
previousRow.focus();
}
event.preventDefault();
break;
//right arrow
case 39:
if (!this.isExpanded()) {
this.expand(event);
}
event.preventDefault();
break;
//left arrow
case 37:
if (this.isExpanded()) {
this.collapse(event);
}
event.preventDefault();
break;
//enter
case 13:
this.onClick(event);
event.preventDefault();
break;
}
}
}
}, {
key: "isExpanded",
value: function isExpanded() {
return this.props.expandedKeys ? this.props.expandedKeys[this.props.node.key] !== undefined : false;
}
}, {
key: "isSelected",
value: function isSelected() {
if ((this.props.selectionMode === 'single' || this.props.selectionMode === 'multiple') && this.props.selectionKeys) return this.props.selectionMode === 'single' ? this.props.selectionKeys === this.props.node.key : this.props.selectionKeys[this.props.node.key] !== undefined;else return false;
}
}, {
key: "isChecked",
value: function isChecked() {
return this.props.selectionKeys ? this.props.selectionKeys[this.props.node.key] && this.props.selectionKeys[this.props.node.key].checked : false;
}
}, {
key: "isPartialChecked",
value: function isPartialChecked() {
return this.props.selectionKeys ? this.props.selectionKeys[this.props.node.key] && this.props.selectionKeys[this.props.node.key].partialChecked : false;
}
}, {
key: "renderToggler",
value: function renderToggler() {
var expanded = this.isExpanded();
var iconClassName = classNames('"p-treetable-toggler-icon pi pi-fw', {
'pi-chevron-right': !expanded,
'pi-chevron-down': expanded
});
var style = {
marginLeft: this.props.level * 16 + 'px',
visibility: this.props.node.leaf === false || this.props.node.children && this.props.node.children.length ? 'visible' : 'hidden'
};
return /*#__PURE__*/React__default["default"].createElement("button", {
type: "button",
className: "p-treetable-toggler p-link p-unselectable-text",
onClick: this.onTogglerClick,
tabIndex: -1,
style: style
}, /*#__PURE__*/React__default["default"].createElement("i", {
className: iconClassName
}), /*#__PURE__*/React__default["default"].createElement(Ripple, null));
}
}, {
key: "renderCheckbox",
value: function renderCheckbox() {
var _this2 = this;
if (this.props.selectionMode === 'checkbox' && this.props.node.selectable !== false) {
var checked = this.isChecked();
var partialChecked = this.isPartialChecked();
var className = classNames('p-checkbox-box', {
'p-highlight': checked,
'p-indeterminate': partialChecked
});
var icon = classNames('p-checkbox-icon p-c', {
'pi pi-check': checked,
'pi pi-minus': partialChecked
});
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-checkbox p-treetable-checkbox p-component",
ref: function ref(el) {
return _this2.checkboxRef = el;
},
onClick: this.onCheckboxChange,
role: "checkbox",
"aria-checked": checked
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-hidden-accessible"
}, /*#__PURE__*/React__default["default"].createElement("input", {
type: "checkbox",
onFocus: this.onCheckboxFocus,
onBlur: this.onCheckboxBlur
})), /*#__PURE__*/React__default["default"].createElement("div", {
className: className,
ref: function ref(el) {
return _this2.checkboxBox = el;
}
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: icon
})));
} else {
return null;
}
}
}, {
key: "renderCell",
value: function renderCell(column) {
var toggler, checkbox;
if (column.props.expander) {
toggler = this.renderToggler();
checkbox = this.renderCheckbox();
}
return /*#__PURE__*/React__default["default"].createElement(TreeTableBodyCell, _extends({
key: column.props.columnKey || column.props.field
}, column.props, {
selectOnEdit: this.props.selectOnEdit,
selected: this.isSelected(),
node: this.props.node,
rowIndex: this.props.rowIndex
}), toggler, checkbox);
}
}, {
key: "renderChildren",
value: function renderChildren() {
var _this3 = this;
if (this.isExpanded() && this.props.node.children) {
return this.props.node.children.map(function (childNode, index) {
return /*#__PURE__*/React__default["default"].createElement(TreeTableRow, {
key: childNode.key || JSON.stringify(childNode.data),
level: _this3.props.level + 1,
rowIndex: _this3.props.rowIndex + '_' + index,
node: childNode,
columns: _this3.props.columns,
expandedKeys: _this3.props.expandedKeys,
selectOnEdit: _this3.props.selectOnEdit,
onToggle: _this3.props.onToggle,
onExpand: _this3.props.onExpand,
onCollapse: _this3.props.onCollapse,
selectionMode: _this3.props.selectionMode,
selectionKeys: _this3.props.selectionKeys,
onSelectionChange: _this3.props.onSelectionChange,
metaKeySelection: _this3.props.metaKeySelection,
onRowClick: _this3.props.onRowClick,
onSelect: _this3.props.onSelect,
onUnselect: _this3.props.onUnselect,
propagateSelectionUp: _this3.props.propagateSelectionUp,
propagateSelectionDown: _this3.props.propagateSelectionDown,
onPropagateUp: _this3.propagateUp,
rowClassName: _this3.props.rowClassName,
contextMenuSelectionKey: _this3.props.contextMenuSelectionKey,
onContextMenuSelectionChange: _this3.props.onContextMenuSelectionChange,
onContextMenu: _this3.props.onContextMenu
});
});
} else {
return null;
}
}
}, {
key: "render",
value: function render() {
var _this4 = this;
var cells = this.props.columns.map(function (col) {
return _this4.renderCell(col);
});
var children = this.renderChildren();
var className = {
'p-highlight': this.isSelected(),
'p-highlight-contextmenu': this.props.contextMenuSelectionKey && this.props.contextMenuSelectionKey === this.props.node.key
};
if (this.props.rowClassName) {
var rowClassName = this.props.rowClassName(this.props.node);
className = _objectSpread$5(_objectSpread$5({}, className), rowClassName);
}
className = classNames(className, this.props.node.className);
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("tr", {
ref: function ref(el) {
return _this4.container = el;
},
tabIndex: 0,
className: className,
style: this.props.node.style,
onClick: this.onClick,
onTouchEnd: this.onTouchEnd,
onContextMenu: this.onRightClick,
onKeyDown: this.onKeyDown
}, cells), children);
}
}]);
return TreeTableRow;
}(React.Component);
_defineProperty(TreeTableRow, "defaultProps", {
node: null,
level: null,
columns: null,
expandedKeys: null,
contextMenuSelectionKey: null,
selectionMode: null,
selectionKeys: null,
metaKeySelection: true,
propagateSelectionUp: true,
propagateSelectionDown: true,
rowClassName: null,
onExpand: null,
onCollapse: null,
onToggle: null,
onRowClick: null,
onSelect: null,
onUnselect: null,
onSelectionChange: null,
onPropagateUp: null,
onContextMenuSelectionChange: null,
onContextMenu: null
});
function ownKeys$4(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$4(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$4(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$4(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createForOfIteratorHelper$1(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray$1(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it["return"] != null) it["return"](); } finally { if (didErr) throw err; } } }; }
function _unsupportedIterableToArray$1(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray$1(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray$1(o, minLen); }
function _arrayLikeToArray$1(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
function _createSuper$a(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$a(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$a() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var TreeTableBody = /*#__PURE__*/function (_Component) {
_inherits(TreeTableBody, _Component);
var _super = _createSuper$a(TreeTableBody);
function TreeTableBody(props) {
var _this;
_classCallCheck(this, TreeTableBody);
_this = _super.call(this, props);
_this.onRowClick = _this.onRowClick.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(TreeTableBody, [{
key: "createRow",
value: function createRow(node, index) {
return /*#__PURE__*/React__default["default"].createElement(TreeTableRow, {
key: node.key || JSON.stringify(node.data),
level: 0,
rowIndex: index,
selectOnEdit: this.props.selectOnEdit,
node: node,
columns: this.props.columns,
expandedKeys: this.props.expandedKeys,
onToggle: this.props.onToggle,
onExpand: this.props.onExpand,
onCollapse: this.props.onCollapse,
selectionMode: this.props.selectionMode,
selectionKeys: this.props.selectionKeys,
onSelectionChange: this.props.onSelectionChange,
metaKeySelection: this.props.metaKeySelection,
onRowClick: this.onRowClick,
onSelect: this.props.onSelect,
onUnselect: this.props.onUnselect,
propagateSelectionUp: this.props.propagateSelectionUp,
propagateSelectionDown: this.props.propagateSelectionDown,
rowClassName: this.props.rowClassName,
contextMenuSelectionKey: this.props.contextMenuSelectionKey,
onContextMenuSelectionChange: this.props.onContextMenuSelectionChange,
onContextMenu: this.props.onContextMenu
});
}
}, {
key: "flattenizeTree",
value: function flattenizeTree(nodes) {
var rows = [];
nodes = nodes || this.props.value;
var _iterator = _createForOfIteratorHelper$1(nodes),
_step;
try {
for (_iterator.s(); !(_step = _iterator.n()).done;) {
var node = _step.value;
rows.push(node.key);
if (this.isExpandedKey(node.key)) {
rows = rows.concat(this.flattenizeTree(node.children));
}
}
} catch (err) {
_iterator.e(err);
} finally {
_iterator.f();
}
return rows;
}
}, {
key: "isExpandedKey",
value: function isExpandedKey(key) {
return this.props.expandedKeys && !!this.props.expandedKeys[key];
}
}, {
key: "onRowClick",
value: function onRowClick(event, node) {
var _this2 = this;
if (this.props.onRowClick) {
this.props.onRowClick({
originalEvent: event,
node: node
});
}
var targetNode = event.target.nodeName;
if (targetNode === 'INPUT' || targetNode === 'BUTTON' || targetNode === 'A' || DomHandler.hasClass(event.target, 'p-clickable') || DomHandler.hasClass(event.target, 'p-treetable-toggler') || DomHandler.hasClass(event.target.parentElement, 'p-treetable-toggler')) {
return;
}
if ((this.isSingleSelectionMode() || this.isMultipleSelectionMode()) && node.selectable !== false) {
var selectionKeys;
var selected = this.isSelected(node);
var metaSelection = this.nodeTouched ? false : this.props.metaKeySelection;
var flatKeys = this.flattenizeTree();
var rowIndex = flatKeys.findIndex(function (key) {
return key === node.key;
});
if (this.isMultipleSelectionMode() && event.shiftKey) {
DomHandler.clearSelection(); // find first selected row
var anchorRowIndex = flatKeys.findIndex(function (key) {
return _this2.props.selectionKeys[key];
});
var rangeStart = Math.min(rowIndex, anchorRowIndex);
var rangeEnd = Math.max(rowIndex, anchorRowIndex);
selectionKeys = _objectSpread$4({}, this.props.selectionKeys);
for (var i = rangeStart; i <= rangeEnd; i++) {
var rowKey = flatKeys[i];
selectionKeys[rowKey] = true;
}
} else {
this.anchorRowIndex = rowIndex;
if (metaSelection) {
var metaKey = event.metaKey || event.ctrlKey;
if (selected && metaKey) {
if (this.isSingleSelectionMode()) {
selectionKeys = null;
} else {
selectionKeys = _objectSpread$4({}, this.props.selectionKeys);
delete selectionKeys[node.key];
}
if (this.props.onUnselect) {
this.props.onUnselect({
originalEvent: event,
node: node
});
}
} else {
if (this.isSingleSelectionMode()) {
selectionKeys = node.key;
} else if (this.isMultipleSelectionMode()) {
selectionKeys = !metaKey ? {} : this.props.selectionKeys ? _objectSpread$4({}, this.props.selectionKeys) : {};
selectionKeys[node.key] = true;
}
if (this.props.onSelect) {
this.props.onSelect({
originalEvent: event,
node: node
});
}
}
} else {
if (this.isSingleSelectionMode()) {
if (selected) {
selectionKeys = null;
if (this.props.onUnselect) {
this.props.onUnselect({
originalEvent: event,
node: node
});
}
} else {
selectionKeys = node.key;
if (this.props.onSelect) {
this.props.onSelect({
originalEvent: event,
node: node
});
}
}
} else {
if (selected) {
selectionKeys = _objectSpread$4({}, this.props.selectionKeys);
delete selectionKeys[node.key];
if (this.props.onUnselect) {
this.props.onUnselect({
originalEvent: event,
node: node
});
}
} else {
selectionKeys = this.props.selectionKeys ? _objectSpread$4({}, this.props.selectionKeys) : {};
selectionKeys[node.key] = true;
if (this.props.onSelect) {
this.props.onSelect({
originalEvent: event,
node: node
});
}
}
}
}
}
if (this.props.onSelectionChange) {
this.props.onSelectionChange({
originalEvent: event,
value: selectionKeys
});
}
}
}
}, {
key: "isSingleSelectionMode",
value: function isSingleSelectionMode() {
return this.props.selectionMode && this.props.selectionMode === 'single';
}
}, {
key: "isMultipleSelectionMode",
value: function isMultipleSelectionMode() {
return this.props.selectionMode && this.props.selectionMode === 'multiple';
}
}, {
key: "isSelected",
value: function isSelected(node) {
if ((this.props.selectionMode === 'single' || this.props.selectionMode === 'multiple') && this.props.selectionKeys) return this.props.selectionMode === 'single' ? this.props.selectionKeys === node.key : this.props.selectionKeys[node.key] !== undefined;else return false;
}
}, {
key: "renderRows",
value: function renderRows() {
var _this3 = this;
if (this.props.paginator && !this.props.lazy) {
var rpp = this.props.rows || 0;
var startIndex = this.props.first || 0;
var endIndex = startIndex + rpp;
var rows = [];
for (var i = startIndex; i < endIndex; i++) {
var rowData = this.props.value[i];
if (rowData) rows.push(this.createRow(this.props.value[i]));else break;
}
return rows;
} else {
return this.props.value.map(function (node, index) {
return _this3.createRow(node, index);
});
}
}
}, {
key: "renderEmptyMessage",
value: function renderEmptyMessage() {
if (this.props.loading) {
return null;
} else {
var colSpan = this.props.columns ? this.props.columns.length : null;
var content = this.props.emptyMessage || localeOption('emptyMessage');
return /*#__PURE__*/React__default["default"].createElement("tr", null, /*#__PURE__*/React__default["default"].createElement("td", {
className: "p-treetable-emptymessage",
colSpan: colSpan
}, content));
}
}
}, {
key: "render",
value: function render() {
var content = this.props.value && this.props.value.length ? this.renderRows() : this.renderEmptyMessage();
return /*#__PURE__*/React__default["default"].createElement("tbody", {
className: "p-treetable-tbody"
}, content);
}
}]);
return TreeTableBody;
}(React.Component);
_defineProperty(TreeTableBody, "defaultProps", {
value: null,
columns: null,
expandedKeys: null,
contextMenuSelectionKey: null,
paginator: false,
first: null,
rows: null,
selectionMode: null,
selectionKeys: null,
metaKeySelection: true,
propagateSelectionUp: true,
propagateSelectionDown: true,
lazy: false,
rowClassName: null,
emptyMessage: null,
loading: false,
onExpand: null,
onCollapse: null,
onToggle: null,
onRowClick: null,
onSelect: null,
onUnselect: null,
onSelectionChange: null,
onContextMenuSelectionChange: null,
onContextMenu: null
});
function _createSuper$9(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$9(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$9() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var TreeTableFooter = /*#__PURE__*/function (_Component) {
_inherits(TreeTableFooter, _Component);
var _super = _createSuper$9(TreeTableFooter);
function TreeTableFooter() {
_classCallCheck(this, TreeTableFooter);
return _super.apply(this, arguments);
}
_createClass(TreeTableFooter, [{
key: "renderFooterCell",
value: function renderFooterCell(column, index) {
return /*#__PURE__*/React__default["default"].createElement("td", {
key: column.field || index,
className: column.props.footerClassName || column.props.className,
style: column.props.footerStyle || column.props.style,
rowSpan: column.props.rowSpan,
colSpan: column.props.colSpan
}, column.props.footer);
}
}, {
key: "renderFooterRow",
value: function renderFooterRow(row, index) {
var _this = this;
var rowColumns = React__default["default"].Children.toArray(row.props.children);
var rowFooterCells = rowColumns.map(function (col, index) {
return _this.renderFooterCell(col, index);
});
return /*#__PURE__*/React__default["default"].createElement("tr", {
key: index
}, rowFooterCells);
}
}, {
key: "renderColumnGroup",
value: function renderColumnGroup() {
var _this2 = this;
var rows = React__default["default"].Children.toArray(this.props.columnGroup.props.children);
return rows.map(function (row, i) {
return _this2.renderFooterRow(row, i);
});
}
}, {
key: "renderColumns",
value: function renderColumns(columns) {
var _this3 = this;
if (columns) {
var headerCells = columns.map(function (col, index) {
return _this3.renderFooterCell(col, index);
});
return /*#__PURE__*/React__default["default"].createElement("tr", null, headerCells);
} else {
return null;
}
}
}, {
key: "hasFooter",
value: function hasFooter() {
if (this.props.columnGroup) {
return true;
} else {
for (var i = 0; i < this.props.columns.length; i++) {
if (this.props.columns[i].props.footer) {
return true;
}
}
}
return false;
}
}, {
key: "render",
value: function render() {
var content = this.props.columnGroup ? this.renderColumnGroup() : this.renderColumns(this.props.columns);
if (this.hasFooter()) {
return /*#__PURE__*/React__default["default"].createElement("tfoot", {
className: "p-treetable-tfoot"
}, content);
} else {
return null;
}
}
}]);
return TreeTableFooter;
}(React.Component);
_defineProperty(TreeTableFooter, "defaultProps", {
columns: null,
columnGroup: null
});
function _createSuper$8(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$8(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$8() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var TreeTableScrollableView = /*#__PURE__*/function (_Component) {
_inherits(TreeTableScrollableView, _Component);
var _super = _createSuper$8(TreeTableScrollableView);
function TreeTableScrollableView(props) {
var _this;
_classCallCheck(this, TreeTableScrollableView);
_this = _super.call(this, props);
_this.onHeaderScroll = _this.onHeaderScroll.bind(_assertThisInitialized(_this));
_this.onBodyScroll = _this.onBodyScroll.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(TreeTableScrollableView, [{
key: "componentDidMount",
value: function componentDidMount() {
this.setScrollHeight();
if (!this.props.frozen) {
var scrollBarWidth = DomHandler.calculateScrollbarWidth();
this.scrollHeaderBox.style.marginRight = scrollBarWidth + 'px';
if (this.scrollFooterBox) {
this.scrollFooterBox.style.marginRight = scrollBarWidth + 'px';
}
} else {
this.scrollBody.style.paddingBottom = DomHandler.calculateScrollbarWidth() + 'px';
}
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate() {
this.setScrollHeight();
}
}, {
key: "setScrollHeight",
value: function setScrollHeight() {
if (this.props.scrollHeight) {
if (this.props.scrollHeight.indexOf('%') !== -1) {
var datatableContainer = this.findDataTableContainer(this.container);
this.scrollBody.style.visibility = 'hidden';
this.scrollBody.style.height = '100px'; //temporary height to calculate static height
var containerHeight = DomHandler.getOuterHeight(datatableContainer);
var relativeHeight = DomHandler.getOuterHeight(datatableContainer.parentElement) * parseInt(this.props.scrollHeight, 10) / 100;
var staticHeight = containerHeight - 100; //total height of headers, footers, paginators
var scrollBodyHeight = relativeHeight - staticHeight;
this.scrollBody.style.height = 'auto';
this.scrollBody.style.maxHeight = scrollBodyHeight + 'px';
this.scrollBody.style.visibility = 'visible';
} else {
this.scrollBody.style.maxHeight = this.props.scrollHeight;
}
}
}
}, {
key: "findDataTableContainer",
value: function findDataTableContainer(element) {
if (element) {
var el = element;
while (el && !DomHandler.hasClass(el, 'p-treetable')) {
el = el.parentElement;
}
return el;
} else {
return null;
}
}
}, {
key: "onHeaderScroll",
value: function onHeaderScroll() {
this.scrollHeader.scrollLeft = 0;
}
}, {
key: "onBodyScroll",
value: function onBodyScroll() {
var frozenView = this.container.previousElementSibling;
var frozenScrollBody;
if (frozenView) {
frozenScrollBody = DomHandler.findSingle(frozenView, '.p-treetable-scrollable-body');
}
this.scrollHeaderBox.style.marginLeft = -1 * this.scrollBody.scrollLeft + 'px';
if (this.scrollFooterBox) {
this.scrollFooterBox.style.marginLeft = -1 * this.scrollBody.scrollLeft + 'px';
}
if (frozenScrollBody) {
frozenScrollBody.scrollTop = this.scrollBody.scrollTop;
}
}
}, {
key: "calculateRowHeight",
value: function calculateRowHeight() {
var row = DomHandler.findSingle(this.scrollTable, 'tr:not(.p-treetable-emptymessage-row)');
if (row) {
this.rowHeight = DomHandler.getOuterHeight(row);
}
}
}, {
key: "renderColGroup",
value: function renderColGroup() {
if (this.props.columns && this.props.columns.length) {
return /*#__PURE__*/React__default["default"].createElement("colgroup", {
className: "p-treetable-scrollable-colgroup"
}, this.props.columns.map(function (col, i) {
return /*#__PURE__*/React__default["default"].createElement("col", {
key: col.field + '_' + i
});
}));
} else {
return null;
}
}
}, {
key: "render",
value: function render() {
var _this2 = this;
var className = classNames('p-treetable-scrollable-view', {
'p-treetable-frozen-view': this.props.frozen,
'p-treetable-unfrozen-view': !this.props.frozen && this.props.frozenWidth
});
var width = this.props.frozen ? this.props.frozenWidth : 'calc(100% - ' + this.props.frozenWidth + ')';
var left = this.props.frozen ? null : this.props.frozenWidth;
var colGroup = this.renderColGroup();
var scrollableBodyStyle = !this.props.frozen && this.props.scrollHeight ? {
overflowY: 'scroll'
} : null;
return /*#__PURE__*/React__default["default"].createElement("div", {
className: className,
style: {
width: width,
left: left
},
ref: function ref(el) {
_this2.container = el;
}
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-treetable-scrollable-header",
ref: function ref(el) {
_this2.scrollHeader = el;
},
onScroll: this.onHeaderScroll
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-treetable-scrollable-header-box",
ref: function ref(el) {
_this2.scrollHeaderBox = el;
}
}, /*#__PURE__*/React__default["default"].createElement("table", {
className: "p-treetable-scrollable-header-table"
}, colGroup, this.props.header))), /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-treetable-scrollable-body",
ref: function ref(el) {
_this2.scrollBody = el;
},
style: scrollableBodyStyle,
onScroll: this.onBodyScroll
}, /*#__PURE__*/React__default["default"].createElement("table", {
ref: function ref(el) {
_this2.scrollTable = el;
},
style: {
top: '0'
},
className: "p-treetable-scrollable-body-table"
}, colGroup, this.props.body)), /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-treetable-scrollable-footer",
ref: function ref(el) {
_this2.scrollFooter = el;
}
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-treetable-scrollable-footer-box",
ref: function ref(el) {
_this2.scrollFooterBox = el;
}
}, /*#__PURE__*/React__default["default"].createElement("table", {
className: "p-treetable-scrollable-footer-table"
}, colGroup, this.props.footer))));
}
}]);
return TreeTableScrollableView;
}(React.Component);
_defineProperty(TreeTableScrollableView, "defaultProps", {
header: null,
body: null,
footer: null,
columns: null,
frozen: null,
frozenWidth: null,
frozenBody: null
});
function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it["return"] != null) it["return"](); } finally { if (didErr) throw err; } } }; }
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
function ownKeys$3(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$3(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$3(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$3(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createSuper$7(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$7(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$7() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var TreeTable = /*#__PURE__*/function (_Component) {
_inherits(TreeTable, _Component);
var _super = _createSuper$7(TreeTable);
function TreeTable(props) {
var _this;
_classCallCheck(this, TreeTable);
_this = _super.call(this, props);
var state = {};
if (!_this.props.onToggle) {
_this.state = {
expandedKeys: _this.props.expandedKeys
};
}
if (!_this.props.onPage) {
state.first = props.first;
state.rows = props.rows;
}
if (!_this.props.onSort) {
state.sortField = props.sortField;
state.sortOrder = props.sortOrder;
state.multiSortMeta = props.multiSortMeta;
}
if (!_this.props.onFilter) {
state.filters = props.filters;
}
if (Object.keys(state).length) {
_this.state = state;
}
_this.onToggle = _this.onToggle.bind(_assertThisInitialized(_this));
_this.onPageChange = _this.onPageChange.bind(_assertThisInitialized(_this));
_this.onSort = _this.onSort.bind(_assertThisInitialized(_this));
_this.onFilter = _this.onFilter.bind(_assertThisInitialized(_this));
_this.onColumnResizeStart = _this.onColumnResizeStart.bind(_assertThisInitialized(_this));
_this.onColumnDragStart = _this.onColumnDragStart.bind(_assertThisInitialized(_this));
_this.onColumnDragOver = _this.onColumnDragOver.bind(_assertThisInitialized(_this));
_this.onColumnDragLeave = _this.onColumnDragLeave.bind(_assertThisInitialized(_this));
_this.onColumnDrop = _this.onColumnDrop.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(TreeTable, [{
key: "onToggle",
value: function onToggle(event) {
if (this.props.onToggle) {
this.props.onToggle(event);
} else {
this.setState({
expandedKeys: event.value
});
}
}
}, {
key: "onPageChange",
value: function onPageChange(event) {
if (this.props.onPage) this.props.onPage(event);else this.setState({
first: event.first,
rows: event.rows
});
}
}, {
key: "onSort",
value: function onSort(event) {
var sortField = event.sortField;
var sortOrder = this.props.defaultSortOrder;
var multiSortMeta;
var eventMeta;
this.columnSortable = event.sortable;
this.columnSortFunction = event.sortFunction;
this.columnField = event.sortField;
if (this.props.sortMode === 'multiple') {
var metaKey = event.originalEvent.metaKey || event.originalEvent.ctrlKey;
multiSortMeta = this.getMultiSortMeta();
if (multiSortMeta && multiSortMeta instanceof Array) {
var sortMeta = multiSortMeta.find(function (sortMeta) {
return sortMeta.field === sortField;
});
sortOrder = sortMeta ? this.getCalculatedSortOrder(sortMeta.order) : sortOrder;
}
var newMetaData = {
field: sortField,
order: sortOrder
};
if (sortOrder) {
if (!multiSortMeta || !metaKey) {
multiSortMeta = [];
}
this.addSortMeta(newMetaData, multiSortMeta);
} else if (this.props.removableSort && multiSortMeta) {
this.removeSortMeta(newMetaData, multiSortMeta);
}
eventMeta = {
multiSortMeta: multiSortMeta
};
} else {
sortOrder = this.getSortField() === sortField ? this.getCalculatedSortOrder(this.getSortOrder()) : sortOrder;
if (this.props.removableSort) {
sortField = sortOrder ? sortField : null;
}
eventMeta = {
sortField: sortField,
sortOrder: sortOrder
};
}
if (this.props.onSort) {
this.props.onSort(eventMeta);
} else {
eventMeta.first = 0;
this.setState(eventMeta);
}
}
}, {
key: "getCalculatedSortOrder",
value: function getCalculatedSortOrder(currentOrder) {
return this.props.removableSort ? this.props.defaultSortOrder === currentOrder ? currentOrder * -1 : 0 : currentOrder * -1;
}
}, {
key: "addSortMeta",
value: function addSortMeta(meta, multiSortMeta) {
var index = -1;
for (var i = 0; i < multiSortMeta.length; i++) {
if (multiSortMeta[i].field === meta.field) {
index = i;
break;
}
}
if (index >= 0) multiSortMeta[index] = meta;else multiSortMeta.push(meta);
}
}, {
key: "removeSortMeta",
value: function removeSortMeta(meta, multiSortMeta) {
var index = -1;
for (var i = 0; i < multiSortMeta.length; i++) {
if (multiSortMeta[i].field === meta.field) {
index = i;
break;
}
}
if (index >= 0) {
multiSortMeta.splice(index, 1);
}
multiSortMeta = multiSortMeta.length > 0 ? multiSortMeta : null;
}
}, {
key: "sortSingle",
value: function sortSingle(data) {
return this.sortNodes(data);
}
}, {
key: "sortNodes",
value: function sortNodes(data) {
var _this2 = this;
var value = _toConsumableArray(data);
if (this.columnSortable && this.columnSortable === 'custom' && this.columnSortFunction) {
value = this.columnSortFunction({
field: this.getSortField(),
order: this.getSortOrder()
});
} else {
value.sort(function (node1, node2) {
var sortField = _this2.getSortField();
var value1 = ObjectUtils.resolveFieldData(node1.data, sortField);
var value2 = ObjectUtils.resolveFieldData(node2.data, sortField);
var result = null;
if (value1 == null && value2 != null) result = -1;else if (value1 != null && value2 == null) result = 1;else if (value1 == null && value2 == null) result = 0;else if (typeof value1 === 'string' && typeof value2 === 'string') result = value1.localeCompare(value2, undefined, {
numeric: true
});else result = value1 < value2 ? -1 : value1 > value2 ? 1 : 0;
return _this2.getSortOrder() * result;
});
for (var i = 0; i < value.length; i++) {
if (value[i].children && value[i].children.length) {
value[i].children = this.sortNodes(value[i].children);
}
}
}
return value;
}
}, {
key: "sortMultiple",
value: function sortMultiple(data) {
var multiSortMeta = this.getMultiSortMeta();
if (multiSortMeta) return this.sortMultipleNodes(data, multiSortMeta);else return data;
}
}, {
key: "sortMultipleNodes",
value: function sortMultipleNodes(data, multiSortMeta) {
var _this3 = this;
var value = _toConsumableArray(data);
value.sort(function (node1, node2) {
return _this3.multisortField(node1, node2, multiSortMeta, 0);
});
for (var i = 0; i < value.length; i++) {
if (value[i].children && value[i].children.length) {
value[i].children = this.sortMultipleNodes(value[i].children, multiSortMeta);
}
}
return value;
}
}, {
key: "multisortField",
value: function multisortField(node1, node2, multiSortMeta, index) {
var value1 = ObjectUtils.resolveFieldData(node1.data, multiSortMeta[index].field);
var value2 = ObjectUtils.resolveFieldData(node2.data, multiSortMeta[index].field);
var result = null;
if (value1 == null && value2 != null) result = -1;else if (value1 != null && value2 == null) result = 1;else if (value1 == null && value2 == null) result = 0;else {
if (value1 === value2) {
return multiSortMeta.length - 1 > index ? this.multisortField(node1, node2, multiSortMeta, index + 1) : 0;
} else {
if ((typeof value1 === 'string' || value1 instanceof String) && (typeof value2 === 'string' || value2 instanceof String)) return multiSortMeta[index].order * value1.localeCompare(value2, undefined, {
numeric: true
});else result = value1 < value2 ? -1 : 1;
}
}
return multiSortMeta[index].order * result;
}
}, {
key: "filter",
value: function filter(value, field, mode) {
this.onFilter({
value: value,
field: field,
matchMode: mode
});
}
}, {
key: "onFilter",
value: function onFilter(event) {
var currentFilters = this.getFilters();
var newFilters = currentFilters ? _objectSpread$3({}, currentFilters) : {};
if (!this.isFilterBlank(event.value)) newFilters[event.field] = {
value: event.value,
matchMode: event.matchMode
};else if (newFilters[event.field]) delete newFilters[event.field];
if (this.props.onFilter) {
this.props.onFilter({
filters: newFilters
});
} else {
this.setState({
first: 0,
filters: newFilters
});
}
}
}, {
key: "hasFilter",
value: function hasFilter() {
var filters = this.getFilters();
return filters && Object.keys(filters).length > 0;
}
}, {
key: "isFilterBlank",
value: function isFilterBlank(filter) {
if (filter !== null && filter !== undefined) {
if (typeof filter === 'string' && filter.trim().length === 0 || filter instanceof Array && filter.length === 0) return true;else return false;
}
return true;
}
}, {
key: "onColumnResizeStart",
value: function onColumnResizeStart(event) {
var containerLeft = DomHandler.getOffset(this.container).left;
this.resizeColumn = event.columnEl;
this.resizeColumnProps = event.column;
this.columnResizing = true;
this.lastResizerHelperX = event.originalEvent.pageX - containerLeft + this.container.scrollLeft;
this.bindColumnResizeEvents();
}
}, {
key: "onColumnResize",
value: function onColumnResize(event) {
var containerLeft = DomHandler.getOffset(this.container).left;
DomHandler.addClass(this.container, 'p-unselectable-text');
this.resizerHelper.style.height = this.container.offsetHeight + 'px';
this.resizerHelper.style.top = 0 + 'px';
this.resizerHelper.style.left = event.pageX - containerLeft + this.container.scrollLeft + 'px';
this.resizerHelper.style.display = 'block';
}
}, {
key: "onColumnResizeEnd",
value: function onColumnResizeEnd(event) {
var delta = this.resizerHelper.offsetLeft - this.lastResizerHelperX;
var columnWidth = this.resizeColumn.offsetWidth;
var newColumnWidth = columnWidth + delta;
var minWidth = this.resizeColumn.style.minWidth || 15;
if (columnWidth + delta > parseInt(minWidth, 10)) {
if (this.props.columnResizeMode === 'fit') {
var nextColumn = this.resizeColumn.nextElementSibling;
var nextColumnWidth = nextColumn.offsetWidth - delta;
if (newColumnWidth > 15 && nextColumnWidth > 15) {
if (this.props.scrollable) {
var scrollableView = this.findParentScrollableView(this.resizeColumn);
var scrollableBodyTable = DomHandler.findSingle(scrollableView, 'table.p-treetable-scrollable-body-table');
var scrollableHeaderTable = DomHandler.findSingle(scrollableView, 'table.p-treetable-scrollable-header-table');
var scrollableFooterTable = DomHandler.findSingle(scrollableView, 'table.p-treetable-scrollable-footer-table');
var resizeColumnIndex = DomHandler.index(this.resizeColumn);
this.resizeColGroup(scrollableHeaderTable, resizeColumnIndex, newColumnWidth, nextColumnWidth);
this.resizeColGroup(scrollableBodyTable, resizeColumnIndex, newColumnWidth, nextColumnWidth);
this.resizeColGroup(scrollableFooterTable, resizeColumnIndex, newColumnWidth, nextColumnWidth);
} else {
this.resizeColumn.style.width = newColumnWidth + 'px';
if (nextColumn) {
nextColumn.style.width = nextColumnWidth + 'px';
}
}
}
} else if (this.props.columnResizeMode === 'expand') {
if (this.props.scrollable) {
var _scrollableView = this.findParentScrollableView(this.resizeColumn);
var _scrollableBodyTable = DomHandler.findSingle(_scrollableView, 'table.p-treetable-scrollable-body-table');
var _scrollableHeaderTable = DomHandler.findSingle(_scrollableView, 'table.p-treetable-scrollable-header-table');
var _scrollableFooterTable = DomHandler.findSingle(_scrollableView, 'table.p-treetable-scrollable-footer-table');
_scrollableBodyTable.style.width = _scrollableBodyTable.offsetWidth + delta + 'px';
_scrollableHeaderTable.style.width = _scrollableHeaderTable.offsetWidth + delta + 'px';
if (_scrollableFooterTable) {
_scrollableFooterTable.style.width = _scrollableHeaderTable.offsetWidth + delta + 'px';
}
var _resizeColumnIndex = DomHandler.index(this.resizeColumn);
this.resizeColGroup(_scrollableHeaderTable, _resizeColumnIndex, newColumnWidth, null);
this.resizeColGroup(_scrollableBodyTable, _resizeColumnIndex, newColumnWidth, null);
this.resizeColGroup(_scrollableFooterTable, _resizeColumnIndex, newColumnWidth, null);
} else {
this.table.style.width = this.table.offsetWidth + delta + 'px';
this.resizeColumn.style.width = newColumnWidth + 'px';
}
}
if (this.props.onColumnResizeEnd) {
this.props.onColumnResizeEnd({
element: this.resizeColumn,
column: this.resizeColumnProps,
delta: delta
});
}
}
this.resizerHelper.style.display = 'none';
this.resizeColumn = null;
this.resizeColumnProps = null;
DomHandler.removeClass(this.container, 'p-unselectable-text');
this.unbindColumnResizeEvents();
}
}, {
key: "findParentScrollableView",
value: function findParentScrollableView(column) {
if (column) {
var parent = column.parentElement;
while (parent && !DomHandler.hasClass(parent, 'p-treetable-scrollable-view')) {
parent = parent.parentElement;
}
return parent;
} else {
return null;
}
}
}, {
key: "resizeColGroup",
value: function resizeColGroup(table, resizeColumnIndex, newColumnWidth, nextColumnWidth) {
if (table) {
var colGroup = table.children[0].nodeName === 'COLGROUP' ? table.children[0] : null;
if (colGroup) {
var col = colGroup.children[resizeColumnIndex];
var nextCol = col.nextElementSibling;
col.style.width = newColumnWidth + 'px';
if (nextCol && nextColumnWidth) {
nextCol.style.width = nextColumnWidth + 'px';
}
} else {
throw new Error("Scrollable tables require a colgroup to support resizable columns");
}
}
}
}, {
key: "bindColumnResizeEvents",
value: function bindColumnResizeEvents() {
var _this4 = this;
this.documentColumnResizeListener = document.addEventListener('mousemove', function (event) {
if (_this4.columnResizing) {
_this4.onColumnResize(event);
}
});
this.documentColumnResizeEndListener = document.addEventListener('mouseup', function (event) {
if (_this4.columnResizing) {
_this4.columnResizing = false;
_this4.onColumnResizeEnd(event);
}
});
}
}, {
key: "unbindColumnResizeEvents",
value: function unbindColumnResizeEvents() {
document.removeEventListener('document', this.documentColumnResizeListener);
document.removeEventListener('document', this.documentColumnResizeEndListener);
}
}, {
key: "onColumnDragStart",
value: function onColumnDragStart(e) {
var event = e.originalEvent,
column = e.column;
if (this.columnResizing) {
event.preventDefault();
return;
}
this.iconWidth = DomHandler.getHiddenElementOuterWidth(this.reorderIndicatorUp);
this.iconHeight = DomHandler.getHiddenElementOuterHeight(this.reorderIndicatorUp);
this.draggedColumnEl = this.findParentHeader(event.currentTarget);
this.draggedColumn = column;
event.dataTransfer.setData('text', 'b'); // Firefox requires this to make dragging possible
}
}, {
key: "onColumnDragOver",
value: function onColumnDragOver(e) {
var event = e.originalEvent;
var dropHeader = this.findParentHeader(event.currentTarget);
if (this.props.reorderableColumns && this.draggedColumnEl && dropHeader) {
event.preventDefault();
var containerOffset = DomHandler.getOffset(this.container);
var dropHeaderOffset = DomHandler.getOffset(dropHeader);
if (this.draggedColumnEl !== dropHeader) {
var targetLeft = dropHeaderOffset.left - containerOffset.left; //let targetTop = containerOffset.top - dropHeaderOffset.top;
var columnCenter = dropHeaderOffset.left + dropHeader.offsetWidth / 2;
this.reorderIndicatorUp.style.top = dropHeaderOffset.top - containerOffset.top - (this.iconHeight - 1) + 'px';
this.reorderIndicatorDown.style.top = dropHeaderOffset.top - containerOffset.top + dropHeader.offsetHeight + 'px';
if (event.pageX > columnCenter) {
this.reorderIndicatorUp.style.left = targetLeft + dropHeader.offsetWidth - Math.ceil(this.iconWidth / 2) + 'px';
this.reorderIndicatorDown.style.left = targetLeft + dropHeader.offsetWidth - Math.ceil(this.iconWidth / 2) + 'px';
this.dropPosition = 1;
} else {
this.reorderIndicatorUp.style.left = targetLeft - Math.ceil(this.iconWidth / 2) + 'px';
this.reorderIndicatorDown.style.left = targetLeft - Math.ceil(this.iconWidth / 2) + 'px';
this.dropPosition = -1;
}
this.reorderIndicatorUp.style.display = 'block';
this.reorderIndicatorDown.style.display = 'block';
}
}
}
}, {
key: "onColumnDragLeave",
value: function onColumnDragLeave(e) {
var event = e.originalEvent;
if (this.props.reorderableColumns && this.draggedColumnEl) {
event.preventDefault();
this.reorderIndicatorUp.style.display = 'none';
this.reorderIndicatorDown.style.display = 'none';
}
}
}, {
key: "onColumnDrop",
value: function onColumnDrop(e) {
var _this5 = this;
var event = e.originalEvent,
column = e.column;
event.preventDefault();
if (this.draggedColumnEl) {
var dragIndex = DomHandler.index(this.draggedColumnEl);
var dropIndex = DomHandler.index(this.findParentHeader(event.currentTarget));
var allowDrop = dragIndex !== dropIndex;
if (allowDrop && (dropIndex - dragIndex === 1 && this.dropPosition === -1 || dragIndex - dropIndex === 1 && this.dropPosition === 1)) {
allowDrop = false;
}
if (allowDrop) {
var columns = this.state.columnOrder ? this.getColumns() : React__default["default"].Children.toArray(this.props.children);
var isSameColumn = function isSameColumn(col1, col2) {
return col1.props.columnKey || col2.props.columnKey ? ObjectUtils.equals(col1, col2, 'props.columnKey') : ObjectUtils.equals(col1, col2, 'props.field');
};
var dragColIndex = columns.findIndex(function (child) {
return isSameColumn(child, _this5.draggedColumn);
});
var dropColIndex = columns.findIndex(function (child) {
return isSameColumn(child, column);
});
if (dropColIndex < dragColIndex && this.dropPosition === 1) {
dropColIndex++;
}
if (dropColIndex > dragColIndex && this.dropPosition === -1) {
dropColIndex--;
}
ObjectUtils.reorderArray(columns, dragColIndex, dropColIndex);
var columnOrder = [];
var _iterator = _createForOfIteratorHelper(columns),
_step;
try {
for (_iterator.s(); !(_step = _iterator.n()).done;) {
var _column = _step.value;
columnOrder.push(_column.props.columnKey || _column.props.field);
}
} catch (err) {
_iterator.e(err);
} finally {
_iterator.f();
}
this.setState({
columnOrder: columnOrder
});
if (this.props.onColReorder) {
this.props.onColReorder({
dragIndex: dragColIndex,
dropIndex: dropColIndex,
columns: columns
});
}
}
this.reorderIndicatorUp.style.display = 'none';
this.reorderIndicatorDown.style.display = 'none';
this.draggedColumnEl.draggable = false;
this.draggedColumnEl = null;
this.dropPosition = null;
}
}
}, {
key: "findParentHeader",
value: function findParentHeader(element) {
if (element.nodeName === 'TH') {
return element;
} else {
var parent = element.parentElement;
while (parent.nodeName !== 'TH') {
parent = parent.parentElement;
if (!parent) break;
}
return parent;
}
}
}, {
key: "getExpandedKeys",
value: function getExpandedKeys() {
return this.props.onToggle ? this.props.expandedKeys : this.state.expandedKeys;
}
}, {
key: "getFirst",
value: function getFirst() {
return this.props.onPage ? this.props.first : this.state.first;
}
}, {
key: "getRows",
value: function getRows() {
return this.props.onPage ? this.props.rows : this.state.rows;
}
}, {
key: "getSortField",
value: function getSortField() {
return this.props.onSort ? this.props.sortField : this.state.sortField;
}
}, {
key: "getSortOrder",
value: function getSortOrder() {
return this.props.onSort ? this.props.sortOrder : this.state.sortOrder;
}
}, {
key: "getMultiSortMeta",
value: function getMultiSortMeta() {
return this.props.onSort ? this.props.multiSortMeta : this.state.multiSortMeta;
}
}, {
key: "getFilters",
value: function getFilters() {
return this.props.onFilter ? this.props.filters : this.state.filters;
}
}, {
key: "findColumnByKey",
value: function findColumnByKey(columns, key) {
if (columns && columns.length) {
for (var i = 0; i < columns.length; i++) {
var child = columns[i];
if (child.props.columnKey === key || child.props.field === key) {
return child;
}
}
}
return null;
}
}, {
key: "getColumns",
value: function getColumns() {
var columns = React__default["default"].Children.toArray(this.props.children);
if (columns && columns.length) {
if (this.props.reorderableColumns && this.state.columnOrder) {
var orderedColumns = [];
var _iterator2 = _createForOfIteratorHelper(this.state.columnOrder),
_step2;
try {
for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
var columnKey = _step2.value;
var column = this.findColumnByKey(columns, columnKey);
if (column) {
orderedColumns.push(column);
}
}
} catch (err) {
_iterator2.e(err);
} finally {
_iterator2.f();
}
return [].concat(orderedColumns, _toConsumableArray(columns.filter(function (item) {
return orderedColumns.indexOf(item) < 0;
})));
} else {
return columns;
}
}
return null;
}
}, {
key: "getTotalRecords",
value: function getTotalRecords(data) {
return this.props.lazy ? this.props.totalRecords : data ? data.length : 0;
}
}, {
key: "isSingleSelectionMode",
value: function isSingleSelectionMode() {
return this.props.selectionMode && this.props.selectionMode === 'single';
}
}, {
key: "isMultipleSelectionMode",
value: function isMultipleSelectionMode() {
return this.props.selectionMode && this.props.selectionMode === 'multiple';
}
}, {
key: "isRowSelectionMode",
value: function isRowSelectionMode() {
return this.isSingleSelectionMode() || this.isMultipleSelectionMode();
}
}, {
key: "getFrozenColumns",
value: function getFrozenColumns(columns) {
var frozenColumns = null;
var _iterator3 = _createForOfIteratorHelper(columns),
_step3;
try {
for (_iterator3.s(); !(_step3 = _iterator3.n()).done;) {
var col = _step3.value;
if (col.props.frozen) {
frozenColumns = frozenColumns || [];
frozenColumns.push(col);
}
}
} catch (err) {
_iterator3.e(err);
} finally {
_iterator3.f();
}
return frozenColumns;
}
}, {
key: "getScrollableColumns",
value: function getScrollableColumns(columns) {
var scrollableColumns = null;
var _iterator4 = _createForOfIteratorHelper(columns),
_step4;
try {
for (_iterator4.s(); !(_step4 = _iterator4.n()).done;) {
var col = _step4.value;
if (!col.props.frozen) {
scrollableColumns = scrollableColumns || [];
scrollableColumns.push(col);
}
}
} catch (err) {
_iterator4.e(err);
} finally {
_iterator4.f();
}
return scrollableColumns;
}
}, {
key: "filterLocal",
value: function filterLocal(value) {
var filteredNodes = [];
var filters = this.getFilters();
var columns = React__default["default"].Children.toArray(this.props.children);
var isStrictMode = this.props.filterMode === 'strict';
var _iterator5 = _createForOfIteratorHelper(value),
_step5;
try {
for (_iterator5.s(); !(_step5 = _iterator5.n()).done;) {
var node = _step5.value;
var copyNode = _objectSpread$3({}, node);
var localMatch = true;
var globalMatch = false;
for (var j = 0; j < columns.length; j++) {
var col = columns[j];
var filterMeta = filters ? filters[col.props.field] : null;
var filterField = col.props.field;
var filterValue = void 0,
filterConstraint = void 0,
paramsWithoutNode = void 0,
options = void 0; //local
if (filterMeta) {
var filterMatchMode = filterMeta.matchMode || col.props.filterMatchMode || 'startsWith';
filterValue = filterMeta.value;
filterConstraint = filterMatchMode === 'custom' ? col.props.filterFunction : FilterService.filters[filterMatchMode];
options = {
rowData: node,
filters: filters,
props: this.props,
column: {
filterMeta: filterMeta,
filterField: filterField,
props: col.props
}
};
paramsWithoutNode = {
filterField: filterField,
filterValue: filterValue,
filterConstraint: filterConstraint,
isStrictMode: isStrictMode,
options: options
};
if (isStrictMode && !(this.findFilteredNodes(copyNode, paramsWithoutNode) || this.isFilterMatched(copyNode, paramsWithoutNode)) || !isStrictMode && !(this.isFilterMatched(copyNode, paramsWithoutNode) || this.findFilteredNodes(copyNode, paramsWithoutNode))) {
localMatch = false;
}
if (!localMatch) {
break;
}
} //global
if (this.props.globalFilter && !globalMatch) {
var copyNodeForGlobal = _objectSpread$3({}, copyNode);
filterValue = this.props.globalFilter;
filterConstraint = FilterService.filters['contains'];
paramsWithoutNode = {
filterField: filterField,
filterValue: filterValue,
filterConstraint: filterConstraint,
isStrictMode: isStrictMode
};
if (isStrictMode && (this.findFilteredNodes(copyNodeForGlobal, paramsWithoutNode) || this.isFilterMatched(copyNodeForGlobal, paramsWithoutNode)) || !isStrictMode && (this.isFilterMatched(copyNodeForGlobal, paramsWithoutNode) || this.findFilteredNodes(copyNodeForGlobal, paramsWithoutNode))) {
globalMatch = true;
copyNode = copyNodeForGlobal;
}
}
}
var matches = localMatch;
if (this.props.globalFilter) {
matches = localMatch && globalMatch;
}
if (matches) {
filteredNodes.push(copyNode);
}
}
} catch (err) {
_iterator5.e(err);
} finally {
_iterator5.f();
}
return filteredNodes;
}
}, {
key: "findFilteredNodes",
value: function findFilteredNodes(node, paramsWithoutNode) {
if (node) {
var matched = false;
if (node.children) {
var childNodes = _toConsumableArray(node.children);
node.children = [];
var _iterator6 = _createForOfIteratorHelper(childNodes),
_step6;
try {
for (_iterator6.s(); !(_step6 = _iterator6.n()).done;) {
var childNode = _step6.value;
var copyChildNode = _objectSpread$3({}, childNode);
if (this.isFilterMatched(copyChildNode, paramsWithoutNode)) {
matched = true;
node.children.push(copyChildNode);
}
}
} catch (err) {
_iterator6.e(err);
} finally {
_iterator6.f();
}
}
if (matched) {
return true;
}
}
}
}, {
key: "isFilterMatched",
value: function isFilterMatched(node, _ref) {
var filterField = _ref.filterField,
filterValue = _ref.filterValue,
filterConstraint = _ref.filterConstraint,
isStrictMode = _ref.isStrictMode,
options = _ref.options;
var matched = false;
var dataFieldValue = ObjectUtils.resolveFieldData(node.data, filterField);
if (filterConstraint(dataFieldValue, filterValue, this.props.filterLocale, options)) {
matched = true;
}
if (!matched || isStrictMode && !this.isNodeLeaf(node)) {
matched = this.findFilteredNodes(node, {
filterField: filterField,
filterValue: filterValue,
filterConstraint: filterConstraint,
isStrictMode: isStrictMode
}) || matched;
}
return matched;
}
}, {
key: "isNodeLeaf",
value: function isNodeLeaf(node) {
return node.leaf === false ? false : !(node.children && node.children.length);
}
}, {
key: "processValue",
value: function processValue() {
var data = this.props.value;
if (!this.props.lazy) {
if (data && data.length) {
if (this.getSortField() || this.getMultiSortMeta()) {
if (this.props.sortMode === 'single') data = this.sortSingle(data);else if (this.props.sortMode === 'multiple') data = this.sortMultiple(data);
}
var localFilters = this.getFilters();
if (localFilters || this.props.globalFilter) {
data = this.filterLocal(data, localFilters);
}
}
}
return data;
}
}, {
key: "createTableHeader",
value: function createTableHeader(columns, columnGroup) {
return /*#__PURE__*/React__default["default"].createElement(TreeTableHeader, {
columns: columns,
columnGroup: columnGroup,
tabIndex: this.props.tabIndex,
onSort: this.onSort,
sortField: this.getSortField(),
sortOrder: this.getSortOrder(),
multiSortMeta: this.getMultiSortMeta(),
resizableColumns: this.props.resizableColumns,
onResizeStart: this.onColumnResizeStart,
reorderableColumns: this.props.reorderableColumns,
onDragStart: this.onColumnDragStart,
onDragOver: this.onColumnDragOver,
onDragLeave: this.onColumnDragLeave,
onDrop: this.onColumnDrop,
onFilter: this.onFilter,
filters: this.getFilters(),
filterDelay: this.props.filterDelay
});
}
}, {
key: "createTableFooter",
value: function createTableFooter(columns, columnGroup) {
return /*#__PURE__*/React__default["default"].createElement(TreeTableFooter, {
columns: columns,
columnGroup: columnGroup
});
}
}, {
key: "createTableBody",
value: function createTableBody(value, columns) {
return /*#__PURE__*/React__default["default"].createElement(TreeTableBody, {
value: value,
columns: columns,
expandedKeys: this.getExpandedKeys(),
selectOnEdit: this.props.selectOnEdit,
onToggle: this.onToggle,
onExpand: this.props.onExpand,
onCollapse: this.props.onCollapse,
paginator: this.props.paginator,
first: this.getFirst(),
rows: this.getRows(),
selectionMode: this.props.selectionMode,
selectionKeys: this.props.selectionKeys,
onSelectionChange: this.props.onSelectionChange,
metaKeySelection: this.props.metaKeySelection,
onRowClick: this.props.onRowClick,
onSelect: this.props.onSelect,
onUnselect: this.props.onUnselect,
propagateSelectionUp: this.props.propagateSelectionUp,
propagateSelectionDown: this.props.propagateSelectionDown,
lazy: this.props.lazy,
rowClassName: this.props.rowClassName,
emptyMessage: this.props.emptyMessage,
loading: this.props.loading,
contextMenuSelectionKey: this.props.contextMenuSelectionKey,
onContextMenuSelectionChange: this.props.onContextMenuSelectionChange,
onContextMenu: this.props.onContextMenu
});
}
}, {
key: "createPaginator",
value: function createPaginator(position, totalRecords) {
var className = classNames('p-paginator-' + position, this.props.paginatorClassName);
return /*#__PURE__*/React__default["default"].createElement(Paginator, {
first: this.getFirst(),
rows: this.getRows(),
pageLinkSize: this.props.pageLinkSize,
className: className,
onPageChange: this.onPageChange,
template: this.props.paginatorTemplate,
totalRecords: totalRecords,
rowsPerPageOptions: this.props.rowsPerPageOptions,
currentPageReportTemplate: this.props.currentPageReportTemplate,
leftContent: this.props.paginatorLeft,
rightContent: this.props.paginatorRight,
alwaysShow: this.props.alwaysShowPaginator,
dropdownAppendTo: this.props.paginatorDropdownAppendTo
});
}
}, {
key: "createScrollableView",
value: function createScrollableView(value, columns, frozen, headerColumnGroup, footerColumnGroup) {
var header = this.createTableHeader(columns, headerColumnGroup);
var footer = this.createTableFooter(columns, footerColumnGroup);
var body = this.createTableBody(value, columns);
return /*#__PURE__*/React__default["default"].createElement(TreeTableScrollableView, {
columns: columns,
header: header,
body: body,
footer: footer,
scrollHeight: this.props.scrollHeight,
frozen: frozen,
frozenWidth: this.props.frozenWidth
});
}
}, {
key: "renderScrollableTable",
value: function renderScrollableTable(value) {
var columns = this.getColumns();
var frozenColumns = this.getFrozenColumns(columns);
var scrollableColumns = frozenColumns ? this.getScrollableColumns(columns) : columns;
var frozenView, scrollableView;
if (frozenColumns) {
frozenView = this.createScrollableView(value, frozenColumns, true, this.props.frozenHeaderColumnGroup, this.props.frozenFooterColumnGroup);
}
scrollableView = this.createScrollableView(value, scrollableColumns, false, this.props.headerColumnGroup, this.props.footerColumnGroup);
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-treetable-scrollable-wrapper"
}, frozenView, scrollableView);
}
}, {
key: "renderRegularTable",
value: function renderRegularTable(value) {
var _this6 = this;
var columns = this.getColumns();
var header = this.createTableHeader(columns, this.props.headerColumnGroup);
var footer = this.createTableFooter(columns, this.props.footerColumnGroup);
var body = this.createTableBody(value, columns);
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-treetable-wrapper"
}, /*#__PURE__*/React__default["default"].createElement("table", {
style: this.props.tableStyle,
className: this.props.tableClassName,
ref: function ref(el) {
return _this6.table = el;
}
}, header, footer, body));
}
}, {
key: "renderTable",
value: function renderTable(value) {
if (this.props.scrollable) return this.renderScrollableTable(value);else return this.renderRegularTable(value);
}
}, {
key: "renderLoader",
value: function renderLoader() {
if (this.props.loading) {
var iconClassName = classNames('p-treetable-loading-icon pi-spin', this.props.loadingIcon);
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-treetable-loading"
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-treetable-loading-overlay p-component-overlay"
}, /*#__PURE__*/React__default["default"].createElement("i", {
className: iconClassName
})));
}
return null;
}
}, {
key: "render",
value: function render() {
var _this7 = this;
var value = this.processValue();
var className = classNames('p-treetable p-component', {
'p-treetable-hoverable-rows': this.props.rowHover,
'p-treetable-selectable': this.isRowSelectionMode(),
'p-treetable-resizable': this.props.resizableColumns,
'p-treetable-resizable-fit': this.props.resizableColumns && this.props.columnResizeMode === 'fit',
'p-treetable-auto-layout': this.props.autoLayout,
'p-treetable-striped': this.props.stripedRows,
'p-treetable-gridlines': this.props.showGridlines
}, this.props.className);
var table = this.renderTable(value);
var totalRecords = this.getTotalRecords(value);
var headerFacet = this.props.header && /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-treetable-header"
}, this.props.header);
var footerFacet = this.props.footer && /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-treetable-footer"
}, this.props.footer);
var paginatorTop = this.props.paginator && this.props.paginatorPosition !== 'bottom' && this.createPaginator('top', totalRecords);
var paginatorBottom = this.props.paginator && this.props.paginatorPosition !== 'top' && this.createPaginator('bottom', totalRecords);
var loader = this.renderLoader();
var resizeHelper = this.props.resizableColumns && /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
_this7.resizerHelper = el;
},
className: "p-column-resizer-helper",
style: {
display: 'none'
}
});
var reorderIndicatorUp = this.props.reorderableColumns && /*#__PURE__*/React__default["default"].createElement("span", {
ref: function ref(el) {
return _this7.reorderIndicatorUp = el;
},
className: "pi pi-arrow-down p-datatable-reorder-indicator-up",
style: {
position: 'absolute',
display: 'none'
}
});
var reorderIndicatorDown = this.props.reorderableColumns && /*#__PURE__*/React__default["default"].createElement("span", {
ref: function ref(el) {
return _this7.reorderIndicatorDown = el;
},
className: "pi pi-arrow-up p-datatable-reorder-indicator-down",
style: {
position: 'absolute',
display: 'none'
}
});
return /*#__PURE__*/React__default["default"].createElement("div", {
id: this.props.id,
className: className,
style: this.props.style,
ref: function ref(el) {
return _this7.container = el;
},
"data-scrollselectors": ".p-treetable-scrollable-body"
}, loader, headerFacet, paginatorTop, table, paginatorBottom, footerFacet, resizeHelper, reorderIndicatorUp, reorderIndicatorDown);
}
}]);
return TreeTable;
}(React.Component);
_defineProperty(TreeTable, "defaultProps", {
id: null,
value: null,
header: null,
footer: null,
style: null,
className: null,
tableStyle: null,
tableClassName: null,
expandedKeys: null,
paginator: false,
paginatorPosition: 'bottom',
alwaysShowPaginator: true,
paginatorClassName: null,
paginatorTemplate: 'FirstPageLink PrevPageLink PageLinks NextPageLink LastPageLink RowsPerPageDropdown',
paginatorLeft: null,
paginatorRight: null,
paginatorDropdownAppendTo: null,
pageLinkSize: 5,
rowsPerPageOptions: null,
currentPageReportTemplate: '({currentPage} of {totalPages})',
first: null,
rows: null,
totalRecords: null,
lazy: false,
sortField: null,
sortOrder: null,
multiSortMeta: null,
sortMode: 'single',
defaultSortOrder: 1,
removableSort: false,
selectionMode: null,
selectionKeys: null,
contextMenuSelectionKey: null,
metaKeySelection: true,
selectOnEdit: true,
propagateSelectionUp: true,
propagateSelectionDown: true,
autoLayout: false,
rowClassName: null,
loading: false,
loadingIcon: 'pi pi-spinner',
tabIndex: 0,
scrollable: false,
scrollHeight: null,
reorderableColumns: false,
headerColumnGroup: null,
footerColumnGroup: null,
frozenHeaderColumnGroup: null,
frozenFooterColumnGroup: null,
frozenWidth: null,
resizableColumns: false,
columnResizeMode: 'fit',
emptyMessage: null,
filters: null,
globalFilter: null,
filterMode: 'lenient',
filterDelay: 300,
filterLocale: undefined,
rowHover: false,
showGridlines: false,
stripedRows: false,
onFilter: null,
onExpand: null,
onCollapse: null,
onToggle: null,
onPage: null,
onSort: null,
onSelect: null,
onUnselect: null,
onRowClick: null,
onSelectionChange: null,
onContextMenuSelectionChange: null,
onColumnResizeEnd: null,
onColReorder: null,
onContextMenu: null
});
function ownKeys$2(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$2(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$2(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$2(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createSuper$6(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$6(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$6() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var TriStateCheckbox = /*#__PURE__*/function (_Component) {
_inherits(TriStateCheckbox, _Component);
var _super = _createSuper$6(TriStateCheckbox);
function TriStateCheckbox(props) {
var _this;
_classCallCheck(this, TriStateCheckbox);
_this = _super.call(this, props);
_this.state = {
focused: false
};
_this.onClick = _this.onClick.bind(_assertThisInitialized(_this));
_this.onFocus = _this.onFocus.bind(_assertThisInitialized(_this));
_this.onBlur = _this.onBlur.bind(_assertThisInitialized(_this));
_this.inputRef = /*#__PURE__*/React.createRef(_this.props.inputRef);
return _this;
}
_createClass(TriStateCheckbox, [{
key: "onClick",
value: function onClick(event) {
if (!this.props.disabled) {
this.toggle(event);
this.inputRef.current.focus();
}
}
}, {
key: "toggle",
value: function toggle(event) {
var newValue;
if (this.props.value === null || this.props.value === undefined) newValue = true;else if (this.props.value === true) newValue = false;else if (this.props.value === false) newValue = null;
if (this.props.onChange) {
this.props.onChange({
originalEvent: event,
value: newValue,
stopPropagation: function stopPropagation() {},
preventDefault: function preventDefault() {},
target: {
name: this.props.name,
id: this.props.id,
value: newValue
}
});
}
}
}, {
key: "onFocus",
value: function onFocus() {
this.setState({
focused: true
});
}
}, {
key: "onBlur",
value: function onBlur() {
this.setState({
focused: false
});
}
}, {
key: "updateInputRef",
value: function updateInputRef() {
var ref = this.props.inputRef;
if (ref) {
if (typeof ref === 'function') {
ref(this.inputRef.current);
} else {
ref.current = this.inputRef.current;
}
}
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
this.updateInputRef();
if (this.props.tooltip && !this.props.disabled) {
this.renderTooltip();
}
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps) {
if (prevProps.tooltip !== this.props.tooltip || prevProps.tooltipOptions !== this.props.tooltipOptions) {
if (this.tooltip) this.tooltip.update(_objectSpread$2({
content: this.props.tooltip
}, this.props.tooltipOptions || {}));else this.renderTooltip();
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
if (this.tooltip) {
this.tooltip.destroy();
this.tooltip = null;
}
}
}, {
key: "renderTooltip",
value: function renderTooltip() {
this.tooltip = tip({
target: this.element,
content: this.props.tooltip,
options: this.props.tooltipOptions
});
}
}, {
key: "render",
value: function render() {
var _this2 = this;
var containerClass = classNames('p-tristatecheckbox p-checkbox p-component', this.props.className);
var boxClass = classNames('p-checkbox-box', {
'p-highlight': (this.props.value || !this.props.value) && this.props.value !== null,
'p-disabled': this.props.disabled,
'p-focus': this.state.focused
});
var iconClass = classNames('p-checkbox-icon p-c', {
'pi pi-check': this.props.value === true,
'pi pi-times': this.props.value === false
});
return /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this2.element = el;
},
id: this.props.id,
className: containerClass,
style: this.props.style,
onClick: this.onClick
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-hidden-accessible"
}, /*#__PURE__*/React__default["default"].createElement("input", {
ref: this.inputRef,
type: "checkbox",
"aria-labelledby": this.props.ariaLabelledBy,
id: this.props.inputId,
name: this.props.name,
onFocus: this.onFocus,
onBlur: this.onBlur,
disabled: this.props.disabled,
defaultChecked: this.props.value
})), /*#__PURE__*/React__default["default"].createElement("div", {
className: boxClass,
ref: function ref(el) {
return _this2.box = el;
},
role: "checkbox",
"aria-checked": this.props.value === true
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: iconClass
})));
}
}]);
return TriStateCheckbox;
}(React.Component);
_defineProperty(TriStateCheckbox, "defaultProps", {
id: null,
inputRef: null,
inputId: null,
value: null,
name: null,
style: null,
className: null,
disabled: false,
tooltip: null,
tooltipOptions: null,
ariaLabelledBy: null,
onChange: null
});
function ownKeys$1(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$1(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$1(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$1(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createSuper$5(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$5(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$5() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var SpeedDial = /*#__PURE__*/function (_Component) {
_inherits(SpeedDial, _Component);
var _super = _createSuper$5(SpeedDial);
function SpeedDial(props) {
var _this;
_classCallCheck(this, SpeedDial);
_this = _super.call(this, props);
_this.state = {
visible: false
};
_this.onClick = _this.onClick.bind(_assertThisInitialized(_this));
_this.onItemClick = _this.onItemClick.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(SpeedDial, [{
key: "isVisible",
value: function isVisible() {
return this.props.onVisibleChange ? this.props.visible : this.state.visible;
}
}, {
key: "show",
value: function show() {
if (this.props.onVisibleChange) {
this.props.onVisibleChange(true);
} else {
this.setState({
visible: true
});
}
this.props.onShow && this.props.onShow();
}
}, {
key: "hide",
value: function hide() {
if (this.props.onVisibleChange) {
this.props.onVisibleChange(false);
} else {
this.setState({
visible: false
});
}
this.props.onHide && this.props.onHide();
}
}, {
key: "onClick",
value: function onClick(e) {
this.isVisible() ? this.hide() : this.show();
this.props.onClick && this.props.onClick(e);
this.isItemClicked = true;
}
}, {
key: "onItemClick",
value: function onItemClick(e, item) {
if (item.command) {
item.command({
originalEvent: e,
item: item
});
}
this.hide();
this.isItemClicked = true;
e.preventDefault();
}
}, {
key: "bindDocumentClickListener",
value: function bindDocumentClickListener() {
var _this2 = this;
if (!this.documentClickListener) {
this.documentClickListener = function (event) {
if (_this2.isVisible() && _this2.isOutsideClicked(event)) {
_this2.hide();
}
_this2.isItemClicked = false;
};
document.addEventListener('click', this.documentClickListener);
}
}
}, {
key: "unbindDocumentClickListener",
value: function unbindDocumentClickListener() {
if (this.documentClickListener) {
document.removeEventListener('click', this.documentClickListener);
this.documentClickListener = null;
}
}
}, {
key: "isOutsideClicked",
value: function isOutsideClicked(event) {
return this.container && !(this.container.isSameNode(event.target) || this.container.contains(event.target) || this.isItemClicked);
}
}, {
key: "calculateTransitionDelay",
value: function calculateTransitionDelay(index) {
var length = this.props.model.length;
var visible = this.isVisible();
return (visible ? index : length - index - 1) * this.props.transitionDelay;
}
}, {
key: "calculatePointStyle",
value: function calculatePointStyle(index) {
var type = this.props.type;
if (type !== 'linear') {
var length = this.props.model.length;
var radius = this.props.radius || length * 20;
if (type === 'circle') {
var step = 2 * Math.PI / length;
return {
left: "calc(".concat(radius * Math.cos(step * index), "px + var(--item-diff-x, 0px))"),
top: "calc(".concat(radius * Math.sin(step * index), "px + var(--item-diff-y, 0px))")
};
} else if (type === 'semi-circle') {
var direction = this.props.direction;
var _step = Math.PI / (length - 1);
var x = "calc(".concat(radius * Math.cos(_step * index), "px + var(--item-diff-x, 0px))");
var y = "calc(".concat(radius * Math.sin(_step * index), "px + var(--item-diff-y, 0px))");
if (direction === 'up') {
return {
left: x,
bottom: y
};
} else if (direction === 'down') {
return {
left: x,
top: y
};
} else if (direction === 'left') {
return {
right: y,
top: x
};
} else if (direction === 'right') {
return {
left: y,
top: x
};
}
} else if (type === 'quarter-circle') {
var _direction = this.props.direction;
var _step2 = Math.PI / (2 * (length - 1));
var _x = "calc(".concat(radius * Math.cos(_step2 * index), "px + var(--item-diff-x, 0px))");
var _y = "calc(".concat(radius * Math.sin(_step2 * index), "px + var(--item-diff-y, 0px))");
if (_direction === 'up-left') {
return {
right: _x,
bottom: _y
};
} else if (_direction === 'up-right') {
return {
left: _x,
bottom: _y
};
} else if (_direction === 'down-left') {
return {
right: _y,
top: _x
};
} else if (_direction === 'down-right') {
return {
left: _y,
top: _x
};
}
}
}
return {};
}
}, {
key: "getItemStyle",
value: function getItemStyle(index) {
var transitionDelay = this.calculateTransitionDelay(index);
var pointStyle = this.calculatePointStyle(index);
return _objectSpread$1({
transitionDelay: "".concat(transitionDelay, "ms")
}, pointStyle);
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
if (this.props.type !== 'linear') {
var button = DomHandler.findSingle(this.container, '.p-speeddial-button');
var firstItem = DomHandler.findSingle(this.list, '.p-speeddial-item');
if (button && firstItem) {
var wDiff = Math.abs(button.offsetWidth - firstItem.offsetWidth);
var hDiff = Math.abs(button.offsetHeight - firstItem.offsetHeight);
this.list.style.setProperty('--item-diff-x', "".concat(wDiff / 2, "px"));
this.list.style.setProperty('--item-diff-y', "".concat(hDiff / 2, "px"));
}
}
if (this.props.hideOnClickOutside) {
this.bindDocumentClickListener();
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
if (this.props.hideOnClickOutside) {
this.unbindDocumentClickListener();
}
}
}, {
key: "renderItem",
value: function renderItem(item, index) {
var _this3 = this;
var style = this.getItemStyle(index);
var disabled = item.disabled,
_icon = item.icon,
label = item.label,
template = item.template,
url = item.url,
target = item.target;
var contentClassName = classNames('p-speeddial-action', {
'p-disabled': disabled
});
var iconClassName = classNames('p-speeddial-action-icon', _icon);
var icon = _icon && /*#__PURE__*/React__default["default"].createElement("span", {
className: iconClassName
});
var content = /*#__PURE__*/React__default["default"].createElement("a", {
href: url || '#',
role: "menuitem",
className: contentClassName,
target: target,
"data-pr-tooltip": label,
onClick: function onClick(e) {
return _this3.onItemClick(e, item);
}
}, icon, /*#__PURE__*/React__default["default"].createElement(Ripple, null));
if (template) {
var defaultContentOptions = {
onClick: function onClick(e) {
return _this3.onItemClick(e, item);
},
className: contentClassName,
iconClassName: iconClassName,
element: content,
props: this.props,
visible: this.isVisible()
};
content = ObjectUtils.getJSXElement(template, item, defaultContentOptions);
}
return /*#__PURE__*/React__default["default"].createElement("li", {
key: index,
className: "p-speeddial-item",
style: style,
role: "none"
}, content);
}
}, {
key: "renderItems",
value: function renderItems() {
var _this4 = this;
if (this.props.model) {
return this.props.model.map(function (item, index) {
return _this4.renderItem(item, index);
});
}
return null;
}
}, {
key: "renderList",
value: function renderList() {
var _this5 = this;
var items = this.renderItems();
return /*#__PURE__*/React__default["default"].createElement("ul", {
ref: function ref(el) {
return _this5.list = el;
},
className: "p-speeddial-list",
role: "menu"
}, items);
}
}, {
key: "renderButton",
value: function renderButton() {
var _classNames,
_this6 = this;
var visible = this.isVisible();
var className = classNames('p-speeddial-button p-button-rounded', {
'p-speeddial-rotate': this.props.rotateAnimation && !this.props.hideIcon
}, this.props.buttonClassName);
var iconClassName = classNames((_classNames = {}, _defineProperty(_classNames, "".concat(this.props.showIcon), !visible && !!this.props.showIcon || !this.props.hideIcon), _defineProperty(_classNames, "".concat(this.props.hideIcon), visible && !!this.props.hideIcon), _classNames));
var content = /*#__PURE__*/React__default["default"].createElement(Button, {
type: "button",
style: this.props.buttonStyle,
className: className,
icon: iconClassName,
onClick: this.onClick,
disabled: this.props.disabled
});
if (this.props.buttonTemplate) {
var defaultContentOptions = {
onClick: function onClick(event) {
return _this6.onClick(event);
},
className: className,
iconClassName: iconClassName,
element: content,
props: this.props,
visible: visible
};
return ObjectUtils.getJSXElement(this.props.buttonTemplate, defaultContentOptions);
}
return content;
}
}, {
key: "renderMask",
value: function renderMask() {
if (this.props.mask) {
var visible = this.isVisible();
var className = classNames('p-speeddial-mask', {
'p-speeddial-mask-visible': visible
}, this.props.maskClassName);
return /*#__PURE__*/React__default["default"].createElement("div", {
className: className,
style: this.props.maskStyle
});
}
return null;
}
}, {
key: "render",
value: function render() {
var _classNames2,
_this7 = this;
var className = classNames("p-speeddial p-component p-speeddial-".concat(this.props.type), (_classNames2 = {}, _defineProperty(_classNames2, "p-speeddial-direction-".concat(this.props.direction), this.props.type !== 'circle'), _defineProperty(_classNames2, 'p-speeddial-opened', this.isVisible()), _defineProperty(_classNames2, 'p-disabled', this.props.disabled), _classNames2), this.props.className);
var button = this.renderButton();
var list = this.renderList();
var mask = this.renderMask();
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this7.container = el;
},
id: this.props.id,
className: className,
style: this.props.style
}, button, list), mask);
}
}]);
return SpeedDial;
}(React.Component);
_defineProperty(SpeedDial, "defaultProps", {
id: null,
model: null,
visible: false,
style: null,
className: null,
direction: 'up',
transitionDelay: 30,
type: 'linear',
radius: 0,
mask: false,
disabled: false,
hideOnClickOutside: true,
buttonStyle: null,
buttonClassName: null,
buttonTemplate: null,
maskStyle: null,
maskClassName: null,
showIcon: 'pi pi-plus',
hideIcon: null,
rotateAnimation: true,
onVisibleChange: null,
onClick: null,
onShow: null,
onHide: null
});
function _createSuper$4(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$4(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$4() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var BlockUI = /*#__PURE__*/function (_Component) {
_inherits(BlockUI, _Component);
var _super = _createSuper$4(BlockUI);
function BlockUI(props) {
var _this;
_classCallCheck(this, BlockUI);
_this = _super.call(this, props);
_this.state = {
visible: props.blocked
};
_this.block = _this.block.bind(_assertThisInitialized(_this));
_this.unblock = _this.unblock.bind(_assertThisInitialized(_this));
_this.onPortalMounted = _this.onPortalMounted.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(BlockUI, [{
key: "block",
value: function block() {
this.setState({
visible: true
});
}
}, {
key: "unblock",
value: function unblock() {
var _this2 = this;
var callback = function callback() {
_this2.setState({
visible: false
}, function () {
_this2.props.fullScreen && DomHandler.removeClass(document.body, 'p-overflow-hidden');
_this2.props.onUnblocked && _this2.props.onUnblocked();
});
};
if (this.mask) {
DomHandler.addClass(this.mask, 'p-component-overlay-leave');
this.mask.addEventListener('animationend', function () {
ZIndexUtils.clear(_this2.mask);
callback();
});
} else {
callback();
}
}
}, {
key: "onPortalMounted",
value: function onPortalMounted() {
if (this.props.fullScreen) {
DomHandler.addClass(document.body, 'p-overflow-hidden');
document.activeElement.blur();
}
if (this.props.autoZIndex) {
var key = this.props.fullScreen ? 'modal' : 'overlay';
ZIndexUtils.set(key, this.mask, PrimeReact.autoZIndex, this.props.baseZIndex || PrimeReact.zIndex[key]);
}
this.props.onBlocked && this.props.onBlocked();
}
}, {
key: "renderMask",
value: function renderMask() {
var _this3 = this;
if (this.state.visible) {
var className = classNames('p-blockui p-component-overlay p-component-overlay-enter', {
'p-blockui-document': this.props.fullScreen
}, this.props.className);
var content = this.props.template ? ObjectUtils.getJSXElement(this.props.template, this.props) : null;
var mask = /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this3.mask = el;
},
className: className,
style: this.props.style
}, content);
return /*#__PURE__*/React__default["default"].createElement(Portal, {
element: mask,
appendTo: this.props.fullScreen ? document.body : 'self',
onMounted: this.onPortalMounted
});
}
return null;
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
if (this.state.visible) {
this.block();
}
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps, prevState) {
if (prevProps.blocked !== this.props.blocked) {
this.props.blocked ? this.block() : this.unblock();
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
if (this.props.fullScreen) {
DomHandler.removeClass(document.body, 'p-overflow-hidden');
}
ZIndexUtils.clear(this.mask);
}
}, {
key: "render",
value: function render() {
var _this4 = this;
var mask = this.renderMask();
return /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this4.container = el;
},
id: this.props.id,
className: "p-blockui-container"
}, this.props.children, mask);
}
}]);
return BlockUI;
}(React.Component);
_defineProperty(BlockUI, "defaultProps", {
id: null,
blocked: false,
fullScreen: false,
baseZIndex: 0,
autoZIndex: true,
style: null,
className: null,
template: null,
onBlocked: null,
onUnblocked: null
});
var TerminalService = EventBus();
function _createSuper$3(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$3(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$3() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var Terminal = /*#__PURE__*/function (_Component) {
_inherits(Terminal, _Component);
var _super = _createSuper$3(Terminal);
function Terminal(props) {
var _this;
_classCallCheck(this, Terminal);
_this = _super.call(this, props);
_this.state = {
commandText: '',
commands: [],
index: 0
};
_this.onClick = _this.onClick.bind(_assertThisInitialized(_this));
_this.onInputChange = _this.onInputChange.bind(_assertThisInitialized(_this));
_this.onInputKeyDown = _this.onInputKeyDown.bind(_assertThisInitialized(_this));
_this.response = _this.response.bind(_assertThisInitialized(_this));
_this.clear = _this.clear.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(Terminal, [{
key: "onClick",
value: function onClick() {
this.input.focus();
}
}, {
key: "onInputChange",
value: function onInputChange(e) {
this.setState({
commandText: e.target.value
});
}
}, {
key: "onInputKeyDown",
value: function onInputKeyDown(e) {
var code = e.which || e.keyCode;
var commands = this.state.commands;
switch (code) {
//up
case 38:
if (commands && commands.length) {
var prevIndex = this.state.index - 1 < 0 ? commands.length - 1 : this.state.index - 1;
var command = commands[prevIndex];
this.setState({
index: prevIndex,
commandText: command.text
});
}
break;
//enter
case 13:
if (!!this.state.commandText) {
var newCommands = _toConsumableArray(commands);
var text = this.state.commandText;
newCommands.push({
text: text
});
this.setState(function (prevState) {
return {
index: prevState.index + 1,
commandText: '',
commands: newCommands
};
}, function () {
TerminalService.emit('command', text);
});
}
break;
}
}
}, {
key: "response",
value: function response(res) {
var commands = this.state.commands;
if (commands && commands.length > 0) {
var _commands = _toConsumableArray(commands);
_commands[_commands.length - 1].response = res;
this.setState({
commands: _commands
});
}
}
}, {
key: "clear",
value: function clear() {
this.setState({
commands: [],
index: 0
});
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
TerminalService.on('response', this.response);
TerminalService.on('clear', this.clear);
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate() {
this.container.scrollTop = this.container.scrollHeight;
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
TerminalService.off('response', this.response);
TerminalService.off('clear', this.clear);
}
}, {
key: "renderWelcomeMessage",
value: function renderWelcomeMessage() {
if (this.props.welcomeMessage) {
return /*#__PURE__*/React__default["default"].createElement("div", null, this.props.welcomeMessage);
}
return null;
}
}, {
key: "renderCommand",
value: function renderCommand(command, index) {
var text = command.text,
response = command.response;
return /*#__PURE__*/React__default["default"].createElement("div", {
key: "".concat(text).concat(index)
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-terminal-prompt"
}, this.props.prompt, "\xA0"), /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-terminal-command"
}, text), /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-terminal-response"
}, response));
}
}, {
key: "renderContent",
value: function renderContent() {
var _this2 = this;
var commands = this.state.commands.map(function (c, i) {
return _this2.renderCommand(c, i);
});
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-terminal-content"
}, commands);
}
}, {
key: "renderPromptContainer",
value: function renderPromptContainer() {
var _this3 = this;
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-terminal-prompt-container"
}, /*#__PURE__*/React__default["default"].createElement("span", {
className: "p-terminal-prompt"
}, this.props.prompt, "\xA0"), /*#__PURE__*/React__default["default"].createElement("input", {
ref: function ref(el) {
return _this3.input = el;
},
type: "text",
value: this.state.commandText,
className: "p-terminal-input",
autoComplete: "off",
onChange: this.onInputChange,
onKeyDown: this.onInputKeyDown
}));
}
}, {
key: "render",
value: function render() {
var _this4 = this;
var className = classNames('p-terminal p-component', this.props.className);
var welcomeMessage = this.renderWelcomeMessage();
var content = this.renderContent();
var prompt = this.renderPromptContainer();
return /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this4.container = el;
},
id: this.props.id,
className: className,
style: this.props.style,
onClick: this.onClick
}, welcomeMessage, content, prompt);
}
}]);
return Terminal;
}(React.Component);
_defineProperty(Terminal, "defaultProps", {
id: null,
style: null,
className: null,
welcomeMessage: null,
prompt: null
});
function _createSuper$2(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$2(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$2() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var Dock = /*#__PURE__*/function (_Component) {
_inherits(Dock, _Component);
var _super = _createSuper$2(Dock);
function Dock(props) {
var _this;
_classCallCheck(this, Dock);
_this = _super.call(this, props);
_this.state = {
currentIndex: -3
};
_this.onListMouseLeave = _this.onListMouseLeave.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(Dock, [{
key: "onListMouseLeave",
value: function onListMouseLeave() {
this.setState({
currentIndex: -3
});
}
}, {
key: "onItemMouseEnter",
value: function onItemMouseEnter(index) {
this.setState({
currentIndex: index
});
}
}, {
key: "onItemClick",
value: function onItemClick(e, item) {
if (item.command) {
item.command({
originalEvent: e,
item: item
});
}
e.preventDefault();
}
}, {
key: "renderItem",
value: function renderItem(item, index) {
var _this2 = this;
var disabled = item.disabled,
_icon = item.icon,
label = item.label,
template = item.template,
url = item.url,
target = item.target;
var className = classNames('p-dock-item', {
'p-dock-item-second-prev': this.state.currentIndex - 2 === index,
'p-dock-item-prev': this.state.currentIndex - 1 === index,
'p-dock-item-current': this.state.currentIndex === index,
'p-dock-item-next': this.state.currentIndex + 1 === index,
'p-dock-item-second-next': this.state.currentIndex + 2 === index
});
var contentClassName = classNames('p-dock-action', {
'p-disabled': disabled
});
var iconClassName = classNames('p-dock-action-icon', _icon);
var icon = typeof _icon === 'string' ? /*#__PURE__*/React__default["default"].createElement("span", {
className: iconClassName
}) : ObjectUtils.getJSXElement(_icon, this.props);
var content = /*#__PURE__*/React__default["default"].createElement("a", {
href: url || '#',
role: "menuitem",
className: contentClassName,
target: target,
"data-pr-tooltip": label,
onClick: function onClick(e) {
return _this2.onItemClick(e, item);
}
}, icon, /*#__PURE__*/React__default["default"].createElement(Ripple, null));
if (template) {
var defaultContentOptions = {
onClick: function onClick(e) {
return _this2.onItemClick(e, item);
},
className: contentClassName,
iconClassName: iconClassName,
element: content,
props: this.props,
index: index
};
content = ObjectUtils.getJSXElement(template, item, defaultContentOptions);
}
return /*#__PURE__*/React__default["default"].createElement("li", {
key: index,
className: className,
role: "none",
onMouseEnter: function onMouseEnter() {
return _this2.onItemMouseEnter(index);
}
}, content);
}
}, {
key: "renderItems",
value: function renderItems() {
var _this3 = this;
if (this.props.model) {
return this.props.model.map(function (item, index) {
return _this3.renderItem(item, index);
});
}
return null;
}
}, {
key: "renderHeader",
value: function renderHeader() {
if (this.props.header) {
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-dock-header"
}, ObjectUtils.getJSXElement(this.props.header, {
props: this.props
}));
}
return null;
}
}, {
key: "renderList",
value: function renderList() {
var _this4 = this;
var items = this.renderItems();
return /*#__PURE__*/React__default["default"].createElement("ul", {
ref: function ref(el) {
return _this4.list = el;
},
className: "p-dock-list",
role: "menu",
onMouseLeave: this.onListMouseLeave
}, items);
}
}, {
key: "renderFooter",
value: function renderFooter() {
if (this.props.footer) {
return /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-dock-footer"
}, ObjectUtils.getJSXElement(this.props.footer, {
props: this.props
}));
}
return null;
}
}, {
key: "render",
value: function render() {
var className = classNames("p-dock p-component p-dock-".concat(this.props.position), {
'p-dock-magnification': this.props.magnification
}, this.props.className);
var header = this.renderHeader();
var list = this.renderList();
var footer = this.renderFooter();
return /*#__PURE__*/React__default["default"].createElement("div", {
id: this.props.id,
className: className,
style: this.props.style
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-dock-container"
}, header, list, footer));
}
}]);
return Dock;
}(React.Component);
_defineProperty(Dock, "defaultProps", {
id: null,
style: null,
className: null,
model: null,
position: 'bottom',
magnification: true,
header: null,
footer: null
});
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _createSuper$1(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var Mention = /*#__PURE__*/function (_Component) {
_inherits(Mention, _Component);
var _super = _createSuper$1(Mention);
function Mention(props) {
var _this;
_classCallCheck(this, Mention);
_this = _super.call(this, props);
_this.state = {
overlayVisible: false,
focused: false,
searching: false,
trigger: null
};
_this.onOverlayEnter = _this.onOverlayEnter.bind(_assertThisInitialized(_this));
_this.onOverlayEntering = _this.onOverlayEntering.bind(_assertThisInitialized(_this));
_this.onOverlayEntered = _this.onOverlayEntered.bind(_assertThisInitialized(_this));
_this.onOverlayExit = _this.onOverlayExit.bind(_assertThisInitialized(_this));
_this.onOverlayExited = _this.onOverlayExited.bind(_assertThisInitialized(_this));
_this.onFocus = _this.onFocus.bind(_assertThisInitialized(_this));
_this.onBlur = _this.onBlur.bind(_assertThisInitialized(_this));
_this.onKeyDown = _this.onKeyDown.bind(_assertThisInitialized(_this));
_this.onChange = _this.onChange.bind(_assertThisInitialized(_this));
_this.onInput = _this.onInput.bind(_assertThisInitialized(_this));
_this.onKeyUp = _this.onKeyUp.bind(_assertThisInitialized(_this));
_this.onPanelClick = _this.onPanelClick.bind(_assertThisInitialized(_this));
_this.overlayRef = /*#__PURE__*/React.createRef();
_this.inputRef = /*#__PURE__*/React.createRef(_this.props.inputRef);
return _this;
}
_createClass(Mention, [{
key: "showOverlay",
value: function showOverlay() {
this.setState({
overlayVisible: true
});
}
}, {
key: "hideOverlay",
value: function hideOverlay() {
this.setState({
overlayVisible: false,
searching: false,
trigger: null
});
}
}, {
key: "onOverlayEnter",
value: function onOverlayEnter() {
ZIndexUtils.set('overlay', this.overlayRef.current, PrimeReact.autoZIndex, PrimeReact.zIndex['overlay']);
this.alignOverlay();
}
}, {
key: "onOverlayEntering",
value: function onOverlayEntering() {
if (this.props.autoHighlight && this.props.suggestions && this.props.suggestions.length) {
DomHandler.addClass(this.list.firstChild, 'p-highlight');
}
}
}, {
key: "onOverlayEntered",
value: function onOverlayEntered() {
this.bindDocumentClickListener();
this.bindScrollListener();
this.bindResizeListener();
this.props.onShow && this.props.onShow();
}
}, {
key: "onOverlayExit",
value: function onOverlayExit() {
this.unbindDocumentClickListener();
this.unbindScrollListener();
this.unbindResizeListener();
}
}, {
key: "onOverlayExited",
value: function onOverlayExited() {
ZIndexUtils.clear(this.overlayRef.current);
this.props.onHide && this.props.onHide();
}
}, {
key: "alignOverlay",
value: function alignOverlay() {
var _this$state$trigger = this.state.trigger,
key = _this$state$trigger.key,
index = _this$state$trigger.index;
var value = this.inputRef.current.value;
var position = DomHandler.getCursorOffset(this.inputRef.current, value.substring(0, index - 1), value.substring(index), key);
this.overlayRef.current.style.transformOrigin = 'top';
this.overlayRef.current.style.left = "calc(".concat(position.left, "px + 1rem)");
this.overlayRef.current.style.top = "calc(".concat(position.top, "px + 1.2rem)");
}
}, {
key: "onPanelClick",
value: function onPanelClick(event) {
OverlayService.emit('overlay-click', {
originalEvent: event,
target: this.container
});
}
}, {
key: "getTrigger",
value: function getTrigger(value, key, start) {
if (!this.state.trigger) {
var triggerKey = Array.isArray(this.props.trigger) ? this.props.trigger.find(function (t) {
return t === key;
}) : this.props.trigger === key ? this.props.trigger : null;
if (triggerKey) {
return {
key: triggerKey,
index: start
};
}
var latestSpaceIndex = value.substring(0, start).lastIndexOf(' ');
var latestTrigger = this.getLatestTrigger(value, start);
if (latestTrigger.index > latestSpaceIndex) {
return latestTrigger;
}
}
return this.state.trigger;
}
}, {
key: "getLatestTrigger",
value: function getLatestTrigger(value, start) {
if (Array.isArray(this.props.trigger)) {
var latestTrigger = {};
this.props.trigger.forEach(function (t) {
var index = value.substring(0, start).lastIndexOf(t);
if (index !== -1 && (index > latestTrigger.index || !latestTrigger.index)) {
latestTrigger = {
key: t,
index: index !== -1 ? index + 1 : -1
};
}
});
return latestTrigger;
}
var index = value.substring(0, start).lastIndexOf(this.props.trigger);
return {
key: this.props.trigger,
index: index !== -1 ? index + 1 : -1
};
}
}, {
key: "onSearch",
value: function onSearch(event) {
var _this2 = this;
if (this.timeout) {
clearTimeout(this.timeout);
}
var _event$target = event.target,
value = _event$target.value,
selectionStart = _event$target.selectionStart;
var key = value.substring(selectionStart - 1, selectionStart);
if (key === ' ') {
this.hideOverlay();
return;
}
var currentTrigger = this.getTrigger(value, key, selectionStart);
if (currentTrigger && currentTrigger.index > -1) {
var query = value.substring(currentTrigger.index, selectionStart);
this.timeout = setTimeout(function () {
_this2.search(event, query, currentTrigger);
}, this.props.delay);
}
}
}, {
key: "search",
value: function search(event, query, trigger) {
if (this.props.onSearch) {
this.setState({
searching: true,
trigger: trigger
});
this.props.onSearch({
originalEvent: event,
trigger: trigger.key,
query: query
});
}
}
}, {
key: "selectItem",
value: function selectItem(event, suggestion) {
var value = this.inputRef.current.value;
var selectionStart = event.target.selectionStart;
var trigger = this.state.trigger;
var spaceIndex = value.indexOf(' ', trigger.index);
var currentText = value.substring(trigger.index, spaceIndex > -1 ? spaceIndex : selectionStart);
var selectedText = this.formatValue(suggestion).replace(/\s+/g, '');
if (currentText.trim() !== selectedText) {
var diff = 0;
while (diff < selectedText.length) {
var s_c = selectedText.charAt(diff);
var c_c = currentText.charAt(diff);
if (s_c === c_c || c_c === ' ') diff++;else break;
}
var prevText = value.substring(0, trigger.index);
var nextText = value.substring(trigger.index + diff);
this.inputRef.current.value = "".concat(prevText).concat(selectedText, " ").concat(nextText);
this.props.onChange && this.props.onChange(event);
}
var cursorStart = trigger.index + selectedText.length + 1;
this.inputRef.current.setSelectionRange(cursorStart, cursorStart);
this.hideOverlay();
this.props.onSelect && this.props.onSelect({
originalEvent: event,
suggestion: suggestion
});
}
}, {
key: "formatValue",
value: function formatValue(value) {
var _this3 = this;
if (value) {
var field = Array.isArray(this.props.field) ? this.props.field[this.props.trigger.findIndex(function (f) {
return f === _this3.state.trigger.key;
})] : this.props.field;
return field ? ObjectUtils.resolveFieldData(value, field) : value;
}
return '';
}
}, {
key: "onItemClick",
value: function onItemClick(event, suggestion) {
this.inputRef.current.focus();
this.selectItem(event, suggestion);
}
}, {
key: "onFocus",
value: function onFocus(event) {
var _this4 = this;
event.persist();
this.setState({
focused: true
}, function () {
_this4.props.onFocus && _this4.props.onFocus(event);
});
}
}, {
key: "onBlur",
value: function onBlur(event) {
var _this5 = this;
event.persist();
this.setState({
focused: false
}, function () {
_this5.props.onBlur && _this5.props.onBlur(event);
});
}
}, {
key: "onInput",
value: function onInput(event) {
this.props.onInput && this.props.onInput(event);
if (event.target.value.length > 0) DomHandler.addClass(this.container, 'p-inputwrapper-filled');else DomHandler.removeClass(this.container, 'p-inputwrapper-filled');
}
}, {
key: "onKeyUp",
value: function onKeyUp(event) {
if (event.which === 37 || event.which === 39) {
this.onSearch(event);
}
}
}, {
key: "onChange",
value: function onChange(event) {
this.props.onChange && this.props.onChange(event);
this.onSearch(event);
}
}, {
key: "onKeyDown",
value: function onKeyDown(event) {
if (this.state.overlayVisible) {
var highlightItem = DomHandler.findSingle(this.overlayRef.current, 'li.p-highlight');
switch (event.which) {
//down
case 40:
if (highlightItem) {
var nextElement = highlightItem.nextElementSibling;
if (nextElement) {
DomHandler.addClass(nextElement, 'p-highlight');
DomHandler.removeClass(highlightItem, 'p-highlight');
DomHandler.scrollInView(this.overlayRef.current, nextElement);
}
} else {
highlightItem = DomHandler.findSingle(this.overlayRef.current, 'li');
if (highlightItem) {
DomHandler.addClass(highlightItem, 'p-highlight');
}
}
event.preventDefault();
break;
//up
case 38:
if (highlightItem) {
var previousElement = highlightItem.previousElementSibling;
if (previousElement) {
DomHandler.addClass(previousElement, 'p-highlight');
DomHandler.removeClass(highlightItem, 'p-highlight');
DomHandler.scrollInView(this.overlayRef.current, previousElement);
}
}
event.preventDefault();
break;
//backspace
case 8:
var _event$target2 = event.target,
value = _event$target2.value,
selectionStart = _event$target2.selectionStart;
var key = value.substring(selectionStart - 1, selectionStart);
if (key === this.state.trigger.key) {
this.hideOverlay();
}
break;
//enter
case 13:
if (highlightItem) {
this.selectItem(event, this.props.suggestions[DomHandler.index(highlightItem)]);
}
event.preventDefault();
break;
//escape
case 27:
this.hideOverlay();
event.preventDefault();
break;
}
}
}
}, {
key: "bindDocumentClickListener",
value: function bindDocumentClickListener() {
var _this6 = this;
if (!this.documentClickListener) {
this.documentClickListener = function (event) {
if (event.which === 3) {
// right click
return;
}
if (_this6.state.overlayVisible && _this6.isOutsideClicked(event)) {
_this6.hideOverlay();
}
};
document.addEventListener('click', this.documentClickListener);
}
}
}, {
key: "unbindDocumentClickListener",
value: function unbindDocumentClickListener() {
if (this.documentClickListener) {
document.removeEventListener('click', this.documentClickListener);
this.documentClickListener = null;
}
}
}, {
key: "bindScrollListener",
value: function bindScrollListener() {
var _this7 = this;
if (!this.scrollHandler) {
this.scrollHandler = new ConnectedOverlayScrollHandler(this.container, function () {
if (_this7.state.overlayVisible) {
_this7.hideOverlay();
}
});
}
this.scrollHandler.bindScrollListener();
}
}, {
key: "unbindScrollListener",
value: function unbindScrollListener() {
if (this.scrollHandler) {
this.scrollHandler.unbindScrollListener();
}
}
}, {
key: "bindResizeListener",
value: function bindResizeListener() {
var _this8 = this;
if (!this.resizeListener) {
this.resizeListener = function () {
if (_this8.state.overlayVisible && !DomHandler.isTouchDevice()) {
_this8.hideOverlay();
}
};
window.addEventListener('resize', this.resizeListener);
}
}
}, {
key: "unbindResizeListener",
value: function unbindResizeListener() {
if (this.resizeListener) {
window.removeEventListener('resize', this.resizeListener);
this.resizeListener = null;
}
}
}, {
key: "isOutsideClicked",
value: function isOutsideClicked(event) {
return this.container && this.overlayRef && this.overlayRef.current && !this.overlayRef.current.contains(event.target);
}
}, {
key: "isFilled",
value: function isFilled() {
return this.props.value != null && this.props.value.toString().length > 0 || this.props.defaultValue != null && this.props.defaultValue.toString().length > 0 || this.inputRef && this.inputRef.current && this.inputRef.current.value.toString().length > 0;
}
}, {
key: "updateInputRef",
value: function updateInputRef() {
var ref = this.props.inputRef;
if (ref) {
if (typeof ref === 'function') {
ref(this.inputRef.current);
} else {
ref.current = this.inputRef.current;
}
}
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
this.updateInputRef();
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps) {
if (prevProps.suggestions !== this.props.suggestions && this.state.searching) {
this.props.suggestions && this.props.suggestions.length ? this.showOverlay() : this.hideOverlay();
if (this.state.overlayVisible) {
this.alignOverlay();
}
this.setState({
searching: false
});
}
if (!this.isFilled() && DomHandler.hasClass(this.container, 'p-inputwrapper-filled')) {
DomHandler.removeClass(this.container, 'p-inputwrapper-filled');
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
this.unbindDocumentClickListener();
this.unbindResizeListener();
if (this.scrollHandler) {
this.scrollHandler.destroy();
this.scrollHandler = null;
}
ZIndexUtils.clear(this.overlayRef.current);
}
}, {
key: "renderItem",
value: function renderItem(suggestion, index) {
var _this9 = this;
var content = this.props.itemTemplate ? ObjectUtils.getJSXElement(this.props.itemTemplate, suggestion, {
trigger: this.state.trigger ? this.state.trigger.key : '',
index: index
}) : this.formatValue(suggestion);
return /*#__PURE__*/React__default["default"].createElement("li", {
key: index + '_item',
className: "p-mention-item",
onClick: function onClick(e) {
return _this9.onItemClick(e, suggestion);
}
}, content, /*#__PURE__*/React__default["default"].createElement(Ripple, null));
}
}, {
key: "renderList",
value: function renderList() {
var _this10 = this;
if (this.props.suggestions) {
var items = this.props.suggestions.map(function (suggestion, index) {
return _this10.renderItem(suggestion, index);
});
return /*#__PURE__*/React__default["default"].createElement("ul", {
ref: function ref(el) {
return _this10.list = el;
},
className: "p-mention-items"
}, items);
}
return null;
}
}, {
key: "renderPanel",
value: function renderPanel() {
var panelClassName = classNames('p-mention-panel p-component', this.props.panelClassName);
var panelStyle = _objectSpread({
maxHeight: this.props.scrollHeight
}, this.props.panelStyle);
var header = ObjectUtils.getJSXElement(this.props.headerTemplate, this.props);
var footer = ObjectUtils.getJSXElement(this.props.footerTemplate, this.props);
var list = this.renderList();
var panel = /*#__PURE__*/React__default["default"].createElement(CSSTransition, {
nodeRef: this.overlayRef,
classNames: "p-connected-overlay",
"in": this.state.overlayVisible,
timeout: {
enter: 120,
exit: 100
},
options: this.props.transitionOptions,
unmountOnExit: true,
onEnter: this.onOverlayEnter,
onEntering: this.onOverlayEntering,
onEntered: this.onOverlayEntered,
onExit: this.onOverlayExit,
onExited: this.onOverlayExited
}, /*#__PURE__*/React__default["default"].createElement("div", {
ref: this.overlayRef,
className: panelClassName,
style: panelStyle,
onClick: this.onPanelClick
}, header, list, footer));
return /*#__PURE__*/React__default["default"].createElement(Portal, {
element: panel,
appendTo: "self"
});
}
}, {
key: "render",
value: function render() {
var _this11 = this;
var containerClassName = classNames('p-mention p-component p-inputwrapper', {
'p-inputwrapper-filled': this.isFilled(),
'p-inputwrapper-focus': this.state.focused
}, this.props.className);
var inputClassName = classNames('p-mention-input', this.props.inputClassName);
var inputProps = ObjectUtils.findDiffKeys(this.props, Mention.defaultProps);
var panel = this.renderPanel();
return /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this11.container = el;
},
id: this.props.id,
className: containerClassName,
style: this.props.style
}, /*#__PURE__*/React__default["default"].createElement(InputTextarea, _extends({
ref: this.inputRef,
id: this.props.inputId
}, inputProps, {
className: inputClassName,
style: this.props.inputStyle,
onFocus: this.onFocus,
onBlur: this.onBlur,
onKeyDown: this.onKeyDown,
onInput: this.onInput,
onKeyUp: this.onKeyUp,
onChange: this.onChange
})), panel);
}
}]);
return Mention;
}(React.Component);
_defineProperty(Mention, "defaultProps", {
id: null,
inputId: null,
inputRef: null,
style: null,
className: null,
trigger: '@',
suggestions: null,
field: null,
inputStyle: null,
inputClassName: null,
panelClassName: null,
panelStyle: null,
scrollHeight: '200px',
autoHighlight: true,
delay: 0,
headerTemplate: null,
footerTemplate: null,
itemTemplate: null,
transitionOptions: null,
onChange: null,
onInput: null,
onSearch: null,
onSelect: null,
onFocus: null,
onBlur: null,
onShow: null,
onHide: null
});
function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var Image = /*#__PURE__*/function (_Component) {
_inherits(Image, _Component);
var _super = _createSuper(Image);
function Image(props) {
var _this;
_classCallCheck(this, Image);
_this = _super.call(this, props);
_this.state = {
maskVisible: false,
previewVisible: false,
rotate: 0,
scale: 1
};
_this.onImageClick = _this.onImageClick.bind(_assertThisInitialized(_this));
_this.onMaskClick = _this.onMaskClick.bind(_assertThisInitialized(_this));
_this.onDownload = _this.onDownload.bind(_assertThisInitialized(_this));
_this.rotateRight = _this.rotateRight.bind(_assertThisInitialized(_this));
_this.rotateLeft = _this.rotateLeft.bind(_assertThisInitialized(_this));
_this.zoomIn = _this.zoomIn.bind(_assertThisInitialized(_this));
_this.zoomOut = _this.zoomOut.bind(_assertThisInitialized(_this));
_this.onEntering = _this.onEntering.bind(_assertThisInitialized(_this));
_this.onEntered = _this.onEntered.bind(_assertThisInitialized(_this));
_this.onPreviewImageClick = _this.onPreviewImageClick.bind(_assertThisInitialized(_this));
_this.onExit = _this.onExit.bind(_assertThisInitialized(_this));
_this.onExiting = _this.onExiting.bind(_assertThisInitialized(_this));
_this.onExited = _this.onExited.bind(_assertThisInitialized(_this));
_this.previewRef = /*#__PURE__*/React__default["default"].createRef();
return _this;
}
_createClass(Image, [{
key: "onImageClick",
value: function onImageClick() {
var _this2 = this;
if (this.props.preview) {
this.setState({
maskVisible: true
});
setTimeout(function () {
_this2.setState({
previewVisible: true
});
}, 25);
}
}
}, {
key: "onPreviewImageClick",
value: function onPreviewImageClick() {
this.previewClick = true;
}
}, {
key: "onMaskClick",
value: function onMaskClick() {
if (!this.previewClick) {
this.setState({
previewVisible: false
});
this.setState({
rotate: 0
});
this.setState({
scale: 1
});
}
this.previewClick = false;
}
}, {
key: "onDownload",
value: function onDownload() {
var _this$props = this.props,
name = _this$props.alt,
src = _this$props.src;
DomHandler.saveAs({
name: name,
src: src
});
this.previewClick = true;
}
}, {
key: "rotateRight",
value: function rotateRight() {
this.setState(function (prevState) {
return {
rotate: prevState.rotate + 90
};
});
this.previewClick = true;
}
}, {
key: "rotateLeft",
value: function rotateLeft() {
this.setState(function (prevState) {
return {
rotate: prevState.rotate - 90
};
});
this.previewClick = true;
}
}, {
key: "zoomIn",
value: function zoomIn() {
this.setState(function (prevState) {
return {
scale: prevState.scale + 0.1
};
});
this.previewClick = true;
}
}, {
key: "zoomOut",
value: function zoomOut() {
this.setState(function (prevState) {
return {
scale: prevState.scale - 0.1
};
});
this.previewClick = true;
}
}, {
key: "onEntering",
value: function onEntering() {
ZIndexUtils.set('modal', this.mask, PrimeReact.autoZIndex, PrimeReact.zIndex['modal']);
}
}, {
key: "onEntered",
value: function onEntered() {
if (this.props.onShow) {
this.props.onShow();
}
}
}, {
key: "onExit",
value: function onExit() {
DomHandler.addClass(this.mask, 'p-component-overlay-leave');
}
}, {
key: "onExiting",
value: function onExiting() {
if (this.props.onHide) {
this.props.onHide();
}
}
}, {
key: "onExited",
value: function onExited(el) {
ZIndexUtils.clear(el);
this.setState({
maskVisible: false
});
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
if (this.mask) {
ZIndexUtils.clear(this.container);
}
}
}, {
key: "renderElement",
value: function renderElement() {
var _this3 = this;
var downloadable = this.props.downloadable;
var imagePreviewStyle = {
transform: 'rotate(' + this.state.rotate + 'deg) scale(' + this.state.scale + ')'
};
var zoomDisabled = this.state.scale <= 0.5 || this.state.scale >= 1.5; // const rotateClassName = 'p-image-preview-rotate-' + this.state.rotate;
return /*#__PURE__*/React__default["default"].createElement("div", {
ref: function ref(el) {
return _this3.mask = el;
},
className: "p-image-mask p-component-overlay p-component-overlay-enter",
onClick: this.onMaskClick
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-image-toolbar"
}, downloadable && /*#__PURE__*/React__default["default"].createElement("button", {
className: "p-image-action p-link",
onClick: this.onDownload,
type: "button"
}, /*#__PURE__*/React__default["default"].createElement("i", {
className: "pi pi-download"
})), /*#__PURE__*/React__default["default"].createElement("button", {
className: "p-image-action p-link",
onClick: this.rotateRight,
type: "button"
}, /*#__PURE__*/React__default["default"].createElement("i", {
className: "pi pi-refresh"
})), /*#__PURE__*/React__default["default"].createElement("button", {
className: "p-image-action p-link",
onClick: this.rotateLeft,
type: "button"
}, /*#__PURE__*/React__default["default"].createElement("i", {
className: "pi pi-undo"
})), /*#__PURE__*/React__default["default"].createElement("button", {
className: "p-image-action p-link",
onClick: this.zoomOut,
type: "button",
disabled: zoomDisabled
}, /*#__PURE__*/React__default["default"].createElement("i", {
className: "pi pi-search-minus"
})), /*#__PURE__*/React__default["default"].createElement("button", {
className: "p-image-action p-link",
onClick: this.zoomIn,
type: "button",
disabled: zoomDisabled
}, /*#__PURE__*/React__default["default"].createElement("i", {
className: "pi pi-search-plus"
})), /*#__PURE__*/React__default["default"].createElement("button", {
className: "p-image-action p-link",
type: "button",
onClick: this.hidePreview
}, /*#__PURE__*/React__default["default"].createElement("i", {
className: "pi pi-times"
}))), /*#__PURE__*/React__default["default"].createElement(CSSTransition, {
nodeRef: this.previewRef,
classNames: "p-image-preview",
"in": this.state.previewVisible,
timeout: {
enter: 150,
exit: 150
},
unmountOnExit: true,
onEntering: this.onEntering,
onEntered: this.onEntered,
onExit: this.onExit,
onExiting: this.onExiting,
onExited: this.onExited
}, /*#__PURE__*/React__default["default"].createElement("div", {
ref: this.previewRef
}, /*#__PURE__*/React__default["default"].createElement("img", {
src: this.props.src,
className: "p-image-preview",
style: imagePreviewStyle,
onClick: this.onPreviewImageClick,
alt: this.props.alt
}))));
}
}, {
key: "render",
value: function render() {
var _this4 = this;
var containerClassName = classNames('p-image p-component', this.props.className, {
'p-image-preview-container': this.props.preview
});
var element = this.renderElement();
var content = this.props.template ? ObjectUtils.getJSXElement(this.props.template, this.props) : /*#__PURE__*/React__default["default"].createElement("i", {
className: "p-image-preview-icon pi pi-eye"
});
var _this$props2 = this.props,
src = _this$props2.src,
alt = _this$props2.alt,
width = _this$props2.width,
height = _this$props2.height;
return /*#__PURE__*/React__default["default"].createElement("span", {
ref: function ref(el) {
return _this4.container = el;
},
className: containerClassName,
style: this.props.style
}, /*#__PURE__*/React__default["default"].createElement("img", {
src: src,
className: this.props.imageClassName,
width: width,
height: height,
style: this.props.imageStyle,
alt: alt
}), this.props.preview && /*#__PURE__*/React__default["default"].createElement("div", {
className: "p-image-preview-indicator",
onClick: this.onImageClick
}, content), this.state.maskVisible && /*#__PURE__*/React__default["default"].createElement(Portal, {
element: element,
appendTo: document.body
}));
}
}]);
return Image;
}(React.Component);
_defineProperty(Image, "defaultProps", {
preview: false,
className: null,
downloadable: false,
style: null,
imageStyle: null,
imageClassName: null,
template: null,
src: null,
alt: null,
width: null,
height: null
});
exports.Accordion = Accordion;
exports.AccordionTab = AccordionTab;
exports.AutoComplete = AutoComplete;
exports.Avatar = Avatar;
exports.AvatarGroup = AvatarGroup;
exports.Badge = Badge;
exports.BlockUI = BlockUI;
exports.BreadCrumb = BreadCrumb;
exports.Button = Button;
exports.ButtonComponent = ButtonComponent;
exports.CSSTransition = CSSTransition;
exports.Calendar = Calendar;
exports.Captcha = Captcha;
exports.Card = Card;
exports.Carousel = Carousel;
exports.CascadeSelect = CascadeSelect;
exports.Chart = Chart;
exports.Checkbox = Checkbox;
exports.Chip = Chip;
exports.Chips = Chips;
exports.ColorPicker = ColorPicker;
exports.Column = Column;
exports.ColumnGroup = ColumnGroup;
exports.ConfirmDialog = ConfirmDialog;
exports.ConfirmPopup = ConfirmPopup;
exports.ConnectedOverlayScrollHandler = ConnectedOverlayScrollHandler;
exports.ContextMenu = ContextMenu;
exports.DataScroller = DataScroller;
exports.DataTable = DataTable;
exports.DataView = DataView;
exports.DataViewLayoutOptions = DataViewLayoutOptions;
exports.DeferredContent = DeferredContent;
exports.Dialog = Dialog;
exports.Divider = Divider;
exports.Dock = Dock;
exports.DomHandler = DomHandler;
exports.Dropdown = Dropdown;
exports.Editor = Editor;
exports.EventBus = EventBus;
exports.Fieldset = Fieldset;
exports.FileUpload = FileUpload;
exports.FilterMatchMode = FilterMatchMode;
exports.FilterOperator = FilterOperator;
exports.FilterService = FilterService;
exports.FullCalendar = FullCalendar;
exports.GMap = GMap;
exports.Galleria = Galleria;
exports.IconUtils = IconUtils;
exports.Image = Image;
exports.Inplace = Inplace;
exports.InplaceContent = InplaceContent;
exports.InplaceDisplay = InplaceDisplay;
exports.InputMask = InputMask;
exports.InputNumber = InputNumber;
exports.InputSwitch = InputSwitch;
exports.InputText = InputText;
exports.InputTextarea = InputTextarea;
exports.KeyFilter = KeyFilter;
exports.Knob = Knob;
exports.ListBox = ListBox;
exports.MegaMenu = MegaMenu;
exports.Mention = Mention;
exports.Menu = Menu;
exports.Menubar = Menubar;
exports.Message = Message;
exports.MessageSeverity = MessageSeverity;
exports.Messages = Messages;
exports.MultiSelect = MultiSelect;
exports.MultiStateCheckbox = MultiStateCheckbox;
exports.ObjectUtils = ObjectUtils;
exports.OrderList = OrderList;
exports.OrganizationChart = OrganizationChart;
exports.OrganizationChartNode = OrganizationChartNode;
exports.OverlayPanel = OverlayPanel;
exports.OverlayService = OverlayService;
exports.Paginator = Paginator;
exports.Panel = Panel;
exports.PanelMenu = PanelMenu;
exports.Password = Password;
exports.PickList = PickList;
exports.Portal = Portal;
exports.PrimeIcons = PrimeIcons;
exports.ProgressBar = ProgressBar;
exports.ProgressSpinner = ProgressSpinner;
exports.RadioButton = RadioButton;
exports.Rating = Rating;
exports.Ripple = Ripple;
exports.Row = Row;
exports.ScrollPanel = ScrollPanel;
exports.ScrollTop = ScrollTop;
exports.SelectButton = SelectButton;
exports.Sidebar = Sidebar;
exports.Skeleton = Skeleton;
exports.SlideMenu = SlideMenu;
exports.SlideMenuSub = SlideMenuSub;
exports.Slider = Slider;
exports.SpeedDial = SpeedDial;
exports.SplitButton = SplitButton;
exports.Splitter = Splitter;
exports.SplitterPanel = SplitterPanel;
exports.Steps = Steps;
exports.TabMenu = TabMenu;
exports.TabPanel = TabPanel;
exports.TabView = TabView;
exports.Tag = Tag;
exports.Terminal = Terminal;
exports.TerminalService = TerminalService;
exports.TieredMenu = TieredMenu;
exports.Timeline = Timeline;
exports.Toast = Toast;
exports.ToggleButton = ToggleButton;
exports.Toolbar = Toolbar;
exports.Tooltip = Tooltip;
exports.Tree = Tree;
exports.TreeSelect = TreeSelect;
exports.TreeTable = TreeTable;
exports.TriStateCheckbox = TriStateCheckbox;
exports.UniqueComponentId = UniqueComponentId;
exports.VirtualScroller = VirtualScroller;
exports.ZIndexUtils = ZIndexUtils;
exports.addLocale = addLocale;
exports.classNames = classNames;
exports.confirmDialog = confirmDialog;
exports.confirmPopup = confirmPopup;
exports["default"] = PrimeReact;
exports.locale = locale;
exports.localeOption = localeOption;
exports.localeOptions = localeOptions;
exports.mask = mask;
exports.tip = tip;
exports.updateLocaleOption = updateLocaleOption;
exports.updateLocaleOptions = updateLocaleOptions;