primereact
Version:
PrimeReact is an open source UI library for React featuring a rich set of 90+ components, a theme designer, various theme alternatives such as Material, Bootstrap, Tailwind, premium templates and professional support. In addition, it integrates with Prime
41,262 lines • 1.62 MB
JavaScript
var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
'use strict';
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__namespace = /*#__PURE__*/_interopNamespace(React);
var ReactDOM__default = /*#__PURE__*/_interopDefaultLegacy(ReactDOM);
function _extends() {
_extends = Object.assign ? Object.assign.bind() : 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 _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 _toPrimitive(input, hint) {
if (_typeof(input) !== "object" || input === null) return input;
var prim = input[Symbol.toPrimitive];
if (prim !== undefined) {
var res = prim.call(input, hint || "default");
if (_typeof(res) !== "object") return res;
throw new TypeError("@@toPrimitive must return a primitive value.");
}
return (hint === "string" ? String : Number)(input);
}
function _toPropertyKey(arg) {
var key = _toPrimitive(arg, "string");
return _typeof(key) === "symbol" ? key : String(key);
}
function _defineProperty(obj, key, value) {
key = _toPropertyKey(key);
if (key in obj) {
Object.defineProperty(obj, key, {
value: value,
enumerable: true,
configurable: true,
writable: true
});
} else {
obj[key] = value;
}
return obj;
}
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 _arrayWithoutHoles(arr) {
if (Array.isArray(arr)) return _arrayLikeToArray$f(arr);
}
function _iterableToArray(iter) {
if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter);
}
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 _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$f(arr) || _nonIterableSpread();
}
function _arrayWithHoles(arr) {
if (Array.isArray(arr)) return arr;
}
function _iterableToArrayLimit(arr, i) {
var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"];
if (null != _i) {
var _s,
_e,
_x,
_r,
_arr = [],
_n = !0,
_d = !1;
try {
if (_x = (_i = _i.call(arr)).next, 0 === i) {
if (Object(_i) !== _i) return;
_n = !1;
} else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0);
} catch (err) {
_d = !0, _e = err;
} finally {
try {
if (!_n && null != _i["return"] && (_r = _i["return"](), Object(_r) !== _r)) 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$f(arr, i) || _nonIterableRest();
}
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 FilterOperator = Object.freeze({
AND: 'and',
OR: 'or'
});
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 _classCallCheck(instance, Constructor) {
if (!(instance instanceof Constructor)) {
throw new TypeError("Cannot call a class as a function");
}
}
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, _toPropertyKey(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 _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; }
var DomHandler = /*#__PURE__*/function () {
function DomHandler() {
_classCallCheck(this, DomHandler);
}
_createClass(DomHandler, null, [{
key: "innerWidth",
value:
/**
* All data- properties like data-test-id
*/
/**
* All ARIA properties like aria-label and focus-target for https://www.npmjs.com/package/@q42/floating-focus-a11y
*/
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: "getBrowserLanguage",
value: function getBrowserLanguage() {
return navigator.userLanguage || navigator.languages && navigator.languages.length && navigator.languages[0] || navigator.language || navigator.browserLanguage || navigator.systemLanguage || 'en';
}
}, {
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.getBoundingClientRect().width || el.offsetWidth;
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.getBoundingClientRect().height || el.offsetHeight;
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);
}
return false;
}
}, {
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 && target) {
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 && target) {
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;
if (element && target) {
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$e(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$e(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 === 1 && 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: "isChrome",
value: function isChrome() {
return /(chrome)/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) {
// https://stackoverflow.com/a/59096915/502366 (in future use IntersectionObserver)
return element && (element.clientHeight !== 0 || element.getClientRects().length !== 0 || getComputedStyle(element).display !== 'none');
}
}, {
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$e(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;
}
/**
* Focus an input element if it does not already have focus.
*
* @param {HTMLElement} el a HTML element
* @param {boolean} scrollTo flag to control whether to scroll to the element, false by default
*/
}, {
key: "focus",
value: function focus(el, scrollTo) {
var preventScroll = scrollTo === undefined ? true : !scrollTo;
el && document.activeElement !== el && el.focus({
preventScroll: preventScroll
});
}
/**
* Focus the first focusable element if it does not already have focus.
*
* @param {HTMLElement} el a HTML element
* @param {boolean} scrollTo flag to control whether to scroll to the element, false by default
* @return {HTMLElement | undefined} the first focusable HTML element found
*/
}, {
key: "focusFirstElement",
value: function focusFirstElement(el, scrollTo) {
if (!el) return;
var firstFocusableElement = DomHandler.getFirstFocusableElement(el);
firstFocusableElement && DomHandler.focus(firstFocusableElement, scrollTo);
return firstFocusableElement;
}
}, {
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, '<br />');
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;
}
}, {
key: "getTargetElement",
value: function getTargetElement(target) {
if (!target) return null;
if (target === 'document') {
return document;
} else if (target === 'window') {
return window;
} else if (_typeof(target) === 'object' && target.hasOwnProperty('current')) {
return this.isExist(target.current) ? target.current : null;
} else {
var isFunction = function isFunction(obj) {
return !!(obj && obj.constructor && obj.call && obj.apply);
};
var element = isFunction(target) ? target() : target;
return element && element.nodeType === 9 || this.isExist(element) ? element : null;
}
}
/**
* Get the attribute names for an element and sorts them alpha for comparison
*/
}, {
key: "getAttributeNames",
value: function getAttributeNames(node) {
var index, rv, attrs;
rv = [];
attrs = node.attributes;
for (index = 0; index < attrs.length; ++index) {
rv.push(attrs[index].nodeName);
}
rv.sort();
return rv;
}
/**
* Compare two elements for equality. Even will compare if the style element
* is out of order for example:
*
* elem1 = style="color: red; font-size: 28px"
* elem2 = style="font-size: 28px; color: red"
*/
}, {
key: "isEqualElement",
value: function isEqualElement(elm1, elm2) {
var attrs1, attrs2, name, node1, node2;
// Compare attributes without order sensitivity
attrs1 = DomHandler.getAttributeNames(elm1);
attrs2 = DomHandler.getAttributeNames(elm2);
if (attrs1.join(',') !== attrs2.join(',')) {
// console.log("Found nodes with different sets of attributes; not equiv");
return false;
}
// ...and values
// unless you want to compare DOM0 event handlers
// (onclick="...")
for (var index = 0; index < attrs1.length; ++index) {
name = attrs1[index];
if (name === 'style') {
var astyle = elm1.style;
var bstyle = elm2.style;
var rexDigitsOnly = /^\d+$/;
for (var _i3 = 0, _Object$keys = Object.keys(astyle); _i3 < _Object$keys.length; _i3++) {
var key = _Object$keys[_i3];
if (!rexDigitsOnly.test(key) && astyle[key] !== bstyle[key]) {
// Not equivalent, stop
//console.log("Found nodes with mis-matched values for attribute '" + name + "'; not equiv");
return false;
}
}
} else {
if (elm1.getAttribute(name) !== elm2.getAttribute(name)) {
// console.log("Found nodes with mis-matched values for attribute '" + name + "'; not equiv");
return false;
}
}
}
// Walk the children
for (node1 = elm1.firstChild, node2 = elm2.firstChild; node1 && node2; node1 = node1.nextSibling, node2 = node2.nextSibling) {
if (node1.nodeType !== node2.nodeType) {
// display("Found nodes of different types; not equiv");
return false;
}
if (node1.nodeType === 1) {
// Element
if (!DomHandler.isEqualElement(node1, node2)) {
return false;
}
} else if (node1.nodeValue !== node2.nodeValue) {
// console.log("Found nodes with mis-matched nodeValues; not equiv");
return false;
}
}
if (node1 || node2) {
// One of the elements had more nodes than the other
// console.log("Found more children of one element than the other; not equivalent");
return false;
}
// Seem the same
return true;
}
}]);
return DomHandler;
}();
_defineProperty(DomHandler, "DATA_PROPS", ['data-']);
_defineProperty(DomHandler, "ARIA_PROPS", ['aria', 'focus-target']);
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$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 mask(el, options) {
var defaultOptions = {
mask: null,
slotChar: '_',
autoClear: true,
unmask: false,
readOnly: false,
onComplete: null,
onChange: null,
onFocus: null,
onBlur: null
};
options = _objectSpread$C(_objectSpread$C({}, 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();
options.onBlur && options.onBlur(e);
updateModel(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;
oldVal = el.value;
//backspace, delete, and escape get special treatment
if (k === 8 || k === 46 || DomHandler.isIOS() && 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 (DomHandler.isAndroid()) {
//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]'
};
androidChrome = DomHandler.isChrome() && DomHandler.isAndroid();
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 (ObjectUtils.isNotEmpty(data[field])) {
return data[field];
} 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: "isLetter",
value: function isLetter(_char) {
return _char && (_char.toUpperCase() != _char.toLowerCase() || _char.codePointAt(0) > 127);
}
}, {
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;
}, {});
}
/**
* Removes keys from a JSON object that start with a string such as "data" to get all "data-id" type properties.
*
* @param {any} obj the JSON object to reduce
* @param {string[]} startsWiths the string(s) to check if the property starts with this key
* @returns the JSON object containing only the key/values that match the startsWith string
*/
}, {
key: "reduceKeys",
value: function reduceKeys(obj, startsWiths) {
var result = {};
if (!obj || !startsWiths || startsWiths.length === 0) {
return result;
}
Object.keys(obj).filter(function (key) {
return startsWiths.some(function (value) {
return key.startsWith(value);
});
}).forEach(function (key) {
result[key] = obj[key];
delete obj[key];
});
return result;
}
}, {
key: "reorderArray",
value: function reorderArray(value, from, to) {
if (value && from !== to) {
if (to >= value.length) {
to %= value.length;
from %= value.length;
}
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: "getProp",
value: function getProp(props) {
var prop = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
var defaultProps = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
var value = props ? props[prop] : undefined;
return value === undefined ? defaultProps[prop] : value;
}
}, {
key: "getMergedProps",
value: function getMergedProps(props, defaultProps) {
return Object.assign({}, defaultProps, props);
}
}, {
key: "getDiffProps",
value: function getDiffProps(props, defaultProps) {
return this.findDiffKeys(props, defaultProps);
}
}, {
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];
}
var methodParams = params;
if (params && params.length === 1) {
methodParams = params[0];
}
return this.isFunction(obj) ? obj.apply(void 0, _toConsumableArray(methodParams)) : obj;
}
}, {
key: "getComponentProp",
value: function getComponentProp(component) {
var prop = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
var defaultProps = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
return this.isNotEmpty(component) ? this.getProp(component.props, prop, defaultProps) : undefined;
}
}, {
key: "getComponentProps",
value: function getComponentProps(component, defaultProps) {
return this.isNotEmpty(component) ? this.getMergedProps(component.props, defaultProps) : undefined;
}
}, {
key: "getComponentDiffProps",
value: function getComponentDiffProps(component, defaultProps) {
return this.isNotEmpty(component) ? this.getDiffProps(component.props, defaultProps) : undefined;
}
}, {
key: "isValidChild",
value: function isValidChild(child, type, validTypes) {
/* eslint-disable */
if (child) {
var childType = this.getComponentProp(child, '__TYPE') || (child.type ? child.type.displayName : undefined);
var isValid = childType === type;
try {
var messageTypes; if ("production" !== 'production' && !isValid) ;
} catch (error) {
// NOOP
}
return isValid;
}
return false;
/* eslint-enable */
}
}, {
key: "getRefElement",
value: function getRefElement(ref) {
if (ref) {
return _typeof(ref) === 'object' && ref.hasOwnProperty('current') ? ref.current : ref;
}
return null;
}
}, {
key: "combinedRefs",
value: function combinedRefs(innerRef, forwardRef) {
if (innerRef && forwardRef) {
if (typeof forwardRef === 'function') {
forwardRef(innerRef.current);
} else {
forwardRef.current = innerRef.current;
}
}
}
}, {
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);
}
}, {
key: "sort",
value: function sort(value1, value2) {
var order = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 1;
var locale = arguments.length > 3 ? arguments[3] : undefined;
var nullSortOrder = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : 1;
var result = ObjectUtils.compare(value1, value2, locale, order);
var finalSortOrder = order;
// nullSortOrder == 1 means Excel like sort nulls at bottom
if (ObjectUtils.isEmpty(value1) || ObjectUtils.isEmpty(value2)) {
finalSortOrder = nullSortOrder === 1 ? order : nullSortOrder;
}
return finalSortOrder * result;
}
}, {
key: "compare",
value: function compare(value1, value2, locale) {
var order = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 1;
var result = -1;
var emptyValue1 = ObjectUtils.isEmpty(value1);
var emptyValue2 = ObjectUtils.isEmpty(value2);
if (emptyValue1 && emptyValue2) result = 0;else if (emptyValue1) result = order;else if (emptyValue2) result = -order;else if (typeof value1 === 'string' && typeof value2 === 'string') result = value1.localeCompare(value2, locale, {
numeric: true
});else result = value1 < value2 ? -1 : value1 > value2 ? 1 : 0;
return result;
}
}]);
return ObjectUtils;
}();
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; }
var IconUtils = /*#__PURE__*/function () {
function IconUtils() {
_classCallCheck(this, IconUtils);
}
_createClass(IconUtils, null, [{
key: "getJSXIcon",
value: function getJSXIcon(icon) {
var iconProps = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
var options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
var content = null;
if (icon !== null) {
var iconType = _typeof(icon);
var className = classNames(iconProps.className, iconType === 'string' && icon);
content = /*#__PURE__*/React__namespace.createElement("span", _extends({}, iconProps, {
className: className
}));
if (iconType !== 'string') {
var defaultContentOptions = _objectSpread$B({
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();
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; }
var FilterService = {
filter: function filter(value, fields, filterValue, filterMatchMode, filterLocale) {
var filteredItems = [];
if (!value) {
return filteredItems;
}
var _iterator = _createForOfIteratorHelper$d(value),
_step;
try {
for (_iterator.s(); !(_step = _iterator.n()).done;) {
var item = _step.value;
if (typeof item === 'string') {
if (this.filters[filterMatchMode](item, filterValue, filterLocale)) {
filteredItems.push(item);
continue;
}
} else {
var _iterator2 = _createForOfIteratorHelper$d(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 true;
}
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;
}
};
var PrimeReact$1 = /*#__PURE__*/_createClass(function PrimeReact() {
_classCallCheck(this, PrimeReact);
});
_defineProperty(PrimeReact$1, "ripple", false);
_defineProperty(PrimeReact$1, "inputStyle", 'outlined');
_defineProperty(PrimeReact$1, "locale", 'en');
_defineProperty(PrimeReact$1, "appendTo", null);
_defineProperty(PrimeReact$1, "cssTransition", true);
_defineProperty(PrimeReact$1, "autoZIndex", true);
_defineProperty(PrimeReact$1, "nonce", null);
_defineProperty(PrimeReact$1, "nullSortOrder", 1);
_defineProperty(PrimeReact$1, "zIndex", {
modal: 1100,
overlay: 1000,
menu: 1000,
tooltip: 1100,
toast: 1200
});
_defineProperty(PrimeReact$1, "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]
});
_defineProperty(PrimeReact$1, "changeTheme", function (currentTheme, newTheme, linkElementId, callback) {
var _linkElement$parentNo;
var linkElement = document.getElementById(linkElementId);
var cloneLinkElement = linkElement.cloneNode(true);
var newThemeUrl = linkElement.getAttribute('href').replace(currentTheme, newTheme);
cloneLinkElement.setAttribute('id', linkElementId + '-clone');
cloneLinkElement.setAttribute('href', newThemeUrl);
cloneLinkElement.addEventListener('load', function () {
linkElement.remove();
cloneLinkElement.setAttribute('id', linkElementId);
if (callback) {
callback();
}
});
(_linkElement$parentNo = linkElement.parentNode) === null || _linkElement$parentNo === void 0 ? void 0 : _linkElement$parentNo.insertBefore(cloneLinkElement, linkElement.nextSibling);
});
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; }
var locales = {
en: {
startsWith: 'Starts with',
contains: 'Contains',
notContains: 'Not contains',
endsWith: 'Ends with',
equals: 'Equals',
notEquals: 'Not equals',
noFilter: 'No Filter',
filter: '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',
close: 'Close',
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 available options',
emptyMessage: 'No results found',
aria: {
trueLabel: 'True',
falseLabel: 'False',
nullLabel: 'Not Selected',
pageLabel: 'Page',
firstPageLabel: 'First Page',
lastPageLabel: 'Last Page',
nextPageLabel: 'Next Page',
previousPageLabel: 'Previous Page',
selectLabel: 'Select',
unselectLabel: 'Unselect',
expandLabel: 'Expand',
collapseLabel: 'Collapse'
}
}
};
function locale(locale) {
locale && (PrimeReact$1.locale = locale);
return {
locale: PrimeReact$1.locale,
options: locales[PrimeReact$1.locale]
};
}
function addLocale(locale, options) {
locales[locale] = _objectSpread$A(_objectSpread$A({}, locales['en']), options);
}
function updateLocaleOption(key, value, locale) {
localeOptions(locale)[key] = value;
}
function updateLocaleOptions(options, locale) {
var _locale = locale || PrimeReact$1.locale;
locales[_locale] = _objectSpread$A(_objectSpread$A({}, locales[_locale]), options);
}
function localeOption(key, locale) {
var _locale = locale || PrimeReact$1.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 ariaLabel(key) {
var _locale = PrimeReact$1.locale;
try {
return localeOptions(_locale)['aria'][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$1.locale;
return locales[_locale];
}
var MessageSeverity = Object.freeze({
SUCCESS: 'success',
INFO: 'info',
WARN: 'warn',
ERROR: 'error'
});
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',
ARROWS_H: 'pi pi-arrows-h',
ARROWS_V: 'pi pi-arrows-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 SortOrder = Object.freeze({
DESC: -1,
UNSORTED: 0,
ASC: 1
});
var PrimeReact = PrimeReact$1;
var usePrevious = function usePrevious(newValue) {
var ref = React__namespace.useRef(undefined);
React__namespace.useEffect(function () {
ref.current = newValue;
});
return ref.current;
};
/* eslint-disable */
var useUnmountEffect = function useUnmountEffect(fn) {
return React__namespace.useEffect(function () {
return fn;
}, []);
};
/* eslint-enable */
/* eslint-disable */
var useEventListener = function useEventListener(_ref) {
var _ref$target = _ref.target,
target = _ref$target === void 0 ? 'document' : _ref$target,
type = _ref.type,
listener = _ref.listener,
options = _ref.options,
_ref$when = _ref.when,
when = _ref$when === void 0 ? true : _ref$when;
var targetRef = React__namespace.useRef(null);
var listenerRef = React__namespace.useRef(null);
var prevOptions = usePrevious(options);
var bind = function bind() {
var bindOptions = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
if (ObjectUtils.isNotEmpty(bindOptions.target)) {
unbind();
(bindOptions.when || when) && (targetRef.current = DomHandler.getTargetElement(bindOptions.target));
}
if (!listenerRef.current && targetRef.current) {
listenerRef.current = function (event) {
return listener && listener(event);
};
targetRef.current.addEventListener(type, listenerRef.current, options);
}
};
var unbind = function unbind() {
if (listenerRef.current) {
targetRef.current.removeEventListener(type, listenerRef.current, options);
listenerRef.current = null;
}
};
React__namespace.useEffect(function () {
if (when) {
targetRef.current = DomHandler.getTargetElement(target);
} else {
unbind();
targetRef.current = null;
}
}, [target, when]);
React__namespace.useEffect(function () {
if (listenerRef.current && (listenerRef.current !== listener || prevOptions !== options)) {
unbind();
when && bind();
}
}, [listener, options]);
useUnmountEffect(function () {
unbind();
});
return [bind, unbind];
};
/* eslint-enable */
var useClickOutside = function useClickOutside(ref, callback) {
var isOutsideClicked = function isOutsideClicked(event) {
if (!ref.current || ref.current.contains(event.target)) {
return;
}
callback(event);
};
var _useEventListener = useEventListener({
type: 'mousedown',
listener: isOutsideClicked
}),
_useEventListener2 = _slicedToArray(_useEventListener, 2),
bindMouseDownListener = _useEventListener2[0],
unbindMouseDownListener = _useEventListener2[1];
var _useEventListener3 = useEventListener({
type: 'touchstart',
listener: isOutsideClicked
}),
_useEventListener4 = _slicedToArray(_useEventListener3, 2),
bindTouchStartListener = _useEventListener4[0],
unbindTouchStartListener = _useEventListener4[1];
React__namespace.useEffect(function () {
if (!ref.current) {
return;
}
bindMouseDownListener();
bindTouchStartListener();
return function () {
unbindMouseDownListener();
unbindTouchStartListener();
};
});
return [ref, callback];
};
var useCounter = function useCounter() {
var initialValue = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {
step: 1
};
var _React$useState = React__namespace.useState(initialValue),
_React$useState2 = _slicedToArray(_React$useState, 2),
count = _React$useState2[0],
setCount = _React$useState2[1];
var increment = function increment() {
if (options.max && count >= options.max) {
return;
}
setCount(count + options.step);
};
var decrement = function decrement() {
if (options.min || options.min === 0 && count <= options.min) {
return null;
}
setCount(count - options.step);
};
var reset = function reset() {
setCount(0);
};
return {
count: count,
increment: increment,
decrement: decrement,
reset: reset
};
};
/* eslint-disable */
var useTimeout = function useTimeout(fn) {
var delay = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
var when = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
var timeout = React__namespace.useRef(null);
var savedCallback = React__namespace.useRef(null);
var clear = React__namespace.useCallback(function () {
return clearTimeout(timeout.current);
}, [timeout.current]);
React__namespace.useEffect(function () {
savedCallback.current = fn;
});
React__namespace.useEffect(function () {
function callback() {
savedCallback.current();
}
if (when) {
timeout.current = setTimeout(callback, delay);
return clear;
} else {
clear();
}
}, [delay, when]);
useUnmountEffect(function () {
clear();
});
return [clear];
};
/* eslint-enable */
var useDebounce = function useDebounce(initialValue, delay) {
var _React$useState = React__namespace.useState(initialValue),
_React$useState2 = _slicedToArray(_React$useState, 2),
inputValue = _React$useState2[0],
setInputValue = _React$useState2[1];
var _React$useState3 = React__namespace.useState(initialValue),
_React$useState4 = _slicedToArray(_React$useState3, 2),
debouncedValue = _React$useState4[0],
setDebouncedValue = _React$useState4[1];
useTimeout(function () {
setDebouncedValue(inputValue);
}, delay, inputValue !== debouncedValue);
return [inputValue, debouncedValue, setInputValue];
};
var TYPE_MAP = {
ico: 'image/x-icon',
png: 'image/png',
svg: 'image/svg+xml',
gif: 'image/gif'
};
var useFavicon = function useFavicon() {
var newIcon = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
var rel = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'shortcut icon';
React__namespace.useLayoutEffect(function () {
if (newIcon) {
var linkElements = document.querySelectorAll("link[rel*='icon']");
linkElements.forEach(function (linkEl) {
document.head.removeChild(linkEl);
});
var link = document.createElement('link');
link.setAttribute('type', TYPE_MAP[newIcon.split('.').pop()]);
link.setAttribute('rel', rel);
link.setAttribute('href', newIcon);
document.head.appendChild(link);
}
}, [newIcon, rel]);
};
var useIntersectionObserver = function useIntersectionObserver(ref) {
var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
var _React$useState = React__namespace.useState(false),
_React$useState2 = _slicedToArray(_React$useState, 2),
isElementVisible = _React$useState2[0],
setIsElementVisible = _React$useState2[1];
React__namespace.useEffect(function () {
if (!ref.current) return;
var observer = new IntersectionObserver(function (_ref) {
var _ref2 = _slicedToArray(_ref, 1),
entry = _ref2[0];
setIsElementVisible(entry.isIntersecting);
}, options);
observer.observe(ref.current);
return function () {
observer.disconnect();
};
}, [options, ref]);
return isElementVisible;
};
/* eslint-disable */
var useInterval = function useInterval(fn) {
var delay = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
var when = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
var timeout = React__namespace.useRef(null);
var savedCallback = React__namespace.useRef(null);
var clear = React__namespace.useCallback(function () {
return clearInterval(timeout.current);
}, [timeout.current]);
React__namespace.useEffect(function () {
savedCallback.current = fn;
});
React__namespace.useEffect(function () {
function callback() {
savedCallback.current();
}
if (when) {
timeout.current = setInterval(callback, delay);
return clear;
} else {
clear();
}
}, [delay, when]);
useUnmountEffect(function () {
clear();
});
return [clear];
};
/* eslint-enable */
var useMatchMedia = function useMatchMedia(query) {
var when = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
var _React$useState = React__namespace.useState(false),
_React$useState2 = _slicedToArray(_React$useState, 2),
matches = _React$useState2[0],
setMatches = _React$useState2[1];
var matchMedia = React__namespace.useRef(null);
var handleChange = function handleChange(e) {
return setMatches(e.matches);
};
var bind = function bind() {
return matchMedia.current && matchMedia.current.addEventListener('change', handleChange);
};
var unbind = function unbind() {
return matchMedia.current && matchMedia.current.removeEventListener('change', handleChange) && (matchMedia.current = null);
};
React__namespace.useEffect(function () {
if (when) {
matchMedia.current = window.matchMedia(query);
setMatches(matchMedia.current.matches);
bind();
}
return unbind;
}, [query, when]);
return matches;
};
/* eslint-enable */
/* eslint-disable */
var useMountEffect = function useMountEffect(fn) {
return React__namespace.useEffect(fn, []);
};
/* eslint-enable */
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; }
var useMouse = function useMouse() {
var _React$useState = React__namespace.useState({
x: 0,
y: 0
}),
_React$useState2 = _slicedToArray(_React$useState, 2),
position = _React$useState2[0],
setPosition = _React$useState2[1];
var ref = React__namespace.useRef(null);
var handleMouseMove = React__namespace.useCallback(function (event) {
var x, y;
if (ref.current) {
var rect = event.currentTarget.getBoundingClientRect();
x = event.pageX - rect.left - (window.pageXOffset || window.scrollX);
y = event.pageY - rect.top - (window.pageYOffset || window.scrollY);
} else {
x = event.clientX;
y = event.clientY;
}
setPosition({
x: Math.max(0, Math.round(x)),
y: Math.max(0, Math.round(y))
});
}, []);
var _useEventListener = useEventListener({
target: ref,
type: 'mousemove',
listener: handleMouseMove
}),
_useEventListener2 = _slicedToArray(_useEventListener, 2),
bindMouseMoveEventListener = _useEventListener2[0],
unbindMouseMoveEventListener = _useEventListener2[1];
var _useEventListener3 = useEventListener({
type: 'mousemove',
listener: handleMouseMove
}),
_useEventListener4 = _slicedToArray(_useEventListener3, 2),
bindDocumentMoveEventListener = _useEventListener4[0],
unbindDocumentMoveEventListener = _useEventListener4[1];
var reset = function reset() {
return setPosition({
x: 0,
y: 0
});
};
React__namespace.useEffect(function () {
bindMouseMoveEventListener();
if (!ref.current) {
bindDocumentMoveEventListener();
}
return function () {
unbindMouseMoveEventListener();
// eslint-disable-next-line react-hooks/exhaustive-deps
if (!ref.current) {
unbindDocumentMoveEventListener();
}
};
}, [bindDocumentMoveEventListener, bindMouseMoveEventListener, unbindDocumentMoveEventListener, unbindMouseMoveEventListener]);
return _objectSpread$z(_objectSpread$z({
ref: ref
}, position), {}, {
reset: reset
});
};
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 useMove(_ref) {
var _ref$mode = _ref.mode,
mode = _ref$mode === void 0 ? 'both' : _ref$mode,
_ref$initialValue = _ref.initialValue,
initialValue = _ref$initialValue === void 0 ? {
x: 0,
y: 0
} : _ref$initialValue;
var _React$useState = React__namespace.useState(initialValue),
_React$useState2 = _slicedToArray(_React$useState, 2),
positions = _React$useState2[0],
setPositions = _React$useState2[1];
var _React$useState3 = React__namespace.useState(false),
_React$useState4 = _slicedToArray(_React$useState3, 2),
active = _React$useState4[0],
setActive = _React$useState4[1];
var isMounted = React__namespace.useRef(false);
var isSliding = React__namespace.useRef(false);
var ref = React__namespace.useRef(null);
var onMouseMove = function onMouseMove(event) {
return updateMousePosition({
x: event.clientX,
y: event.clientY
});
};
var handlePositionChange = function handlePositionChange(_ref2) {
var clampedX = _ref2.clampedX,
clampedY = _ref2.clampedY;
if (mode === 'vertical') {
setPositions({
y: 1 - clampedY
});
} else if (mode === 'horizontal') {
setPositions({
x: clampedX
});
} else if (mode === 'both') {
setPositions({
x: clampedX,
y: clampedY
});
}
};
var onMouseDown = function onMouseDown(event) {
startScrubbing();
event.preventDefault();
onMouseMove(event);
};
var stopScrubbing = function stopScrubbing() {
if (isSliding.current && isMounted.current) {
isSliding.current = false;
setActive(false);
unbindListeners();
}
};
var onTouchMove = function onTouchMove(event) {
if (event.cancelable) {
event.preventDefault();
}
updateMousePosition({
x: event.changedTouches[0].clientX,
y: event.changedTouches[0].clientY
});
};
var onTouchStart = function onTouchStart(event) {
if (event.cancelable) {
event.preventDefault();
}
startScrubbing();
onTouchMove(event);
};
var _useEventListener = useEventListener({
type: 'mousemove',
listener: onMouseMove
}),
_useEventListener2 = _slicedToArray(_useEventListener, 2),
bindDocumentMouseMoveListener = _useEventListener2[0],
unbindDocumentMouseMoveListener = _useEventListener2[1];
var _useEventListener3 = useEventListener({
type: 'mouseup',
listener: stopScrubbing
}),
_useEventListener4 = _slicedToArray(_useEventListener3, 2),
bindDocumentMouseUpListener = _useEventListener4[0],
unbindDocumentMouseUpListener = _useEventListener4[1];
var _useEventListener5 = useEventListener({
type: 'touchmove',
listener: onTouchMove
}),
_useEventListener6 = _slicedToArray(_useEventListener5, 2),
bindDocumentTouchMoveListener = _useEventListener6[0],
unbindDocumentTouchMoveListener = _useEventListener6[1];
var _useEventListener7 = useEventListener({
type: 'touchend',
listener: stopScrubbing
}),
_useEventListener8 = _slicedToArray(_useEventListener7, 2),
bindDocumentTouchEndListener = _useEventListener8[0],
unbindDocumentTouchEndListener = _useEventListener8[1];
var _useEventListener9 = useEventListener({
target: ref,
type: 'mousedown',
listener: onMouseDown
}),
_useEventListener10 = _slicedToArray(_useEventListener9, 2),
bindMouseDownListener = _useEventListener10[0],
unbindMouseDownListener = _useEventListener10[1];
var _useEventListener11 = useEventListener({
target: ref,
type: 'touchstart',
listener: onTouchStart,
options: {
passive: false
}
}),
_useEventListener12 = _slicedToArray(_useEventListener11, 2),
bindTouchStartListener = _useEventListener12[0],
unbindTouchStartListener = _useEventListener12[1];
var clamp = function clamp(value, min, max) {
return Math.min(Math.max(value, min), max);
};
var clampPositions = function clampPositions(_ref3) {
var x = _ref3.x,
y = _ref3.y;
return {
clampedX: clamp(x, 0, 1),
clampedY: clamp(y, 0, 1)
};
};
var bindListeners = function bindListeners() {
bindDocumentMouseMoveListener();
bindDocumentMouseUpListener();
bindDocumentTouchMoveListener();
bindDocumentTouchEndListener();
};
var unbindListeners = function unbindListeners() {
unbindDocumentMouseMoveListener();
unbindDocumentMouseUpListener();
unbindDocumentTouchMoveListener();
unbindDocumentTouchEndListener();
};
var reset = function reset() {
setPositions(initialValue);
};
React__namespace.useEffect(function () {
isMounted.current = true;
}, []);
var startScrubbing = function startScrubbing() {
if (!isSliding.current && isMounted.current) {
isSliding.current = true;
setActive(true);
bindListeners();
}
};
var updateMousePosition = function updateMousePosition(_ref4) {
var x = _ref4.x,
y = _ref4.y;
if (isSliding.current) {
var rect = ref.current.getBoundingClientRect();
var _clampPositions = clampPositions({
x: (x - rect.left) / rect.width,
y: (y - rect.top) / rect.height
}),
clampedX = _clampPositions.clampedX,
clampedY = _clampPositions.clampedY;
handlePositionChange({
clampedX: clampedX,
clampedY: clampedY
});
}
};
React__namespace.useEffect(function () {
if (ref.current) {
bindMouseDownListener();
bindTouchStartListener();
}
return function () {
if (ref.current) {
unbindMouseDownListener();
unbindTouchStartListener();
}
};
}, [bindMouseDownListener, bindTouchStartListener, positions, unbindMouseDownListener, unbindTouchStartListener]);
return _objectSpread$y(_objectSpread$y({
ref: ref
}, positions), {}, {
active: active,
reset: reset
});
}
/* eslint-disable */
var useOverlayScrollListener = function useOverlayScrollListener(_ref) {
var target = _ref.target,
listener = _ref.listener,
options = _ref.options,
_ref$when = _ref.when,
when = _ref$when === void 0 ? true : _ref$when;
var targetRef = React__namespace.useRef(null);
var listenerRef = React__namespace.useRef(null);
var scrollableParents = React__namespace.useRef([]);
var prevOptions = usePrevious(options);
var bind = function bind() {
var bindOptions = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
if (ObjectUtils.isNotEmpty(bindOptions.target)) {
unbind();
(bindOptions.when || when) && (targetRef.current = DomHandler.getTargetElement(bindOptions.target));
}
if (!listenerRef.current && targetRef.current) {
var nodes = scrollableParents.current = DomHandler.getScrollableParents(targetRef.current);
listenerRef.current = function (event) {
return listener && listener(event);
};
nodes.forEach(function (node) {
return node.addEventListener('scroll', listenerRef.current, options);
});
}
};
var unbind = function unbind() {
if (listenerRef.current) {
var nodes = scrollableParents.current;
nodes.forEach(function (node) {
return node.removeEventListener('scroll', listenerRef.current, options);
});
listenerRef.current = null;
}
};
React__namespace.useEffect(function () {
if (when) {
targetRef.current = DomHandler.getTargetElement(target);
} else {
unbind();
targetRef.current = null;
}
}, [target, when]);
React__namespace.useEffect(function () {
if (listenerRef.current && (listenerRef.current !== listener || prevOptions !== options)) {
unbind();
when && bind();
}
}, [listener, options]);
useUnmountEffect(function () {
unbind();
});
return [bind, unbind];
};
/* eslint-enable */
var useResizeListener = function useResizeListener(_ref) {
var listener = _ref.listener,
_ref$when = _ref.when,
when = _ref$when === void 0 ? true : _ref$when;
return useEventListener({
target: 'window',
type: 'resize',
listener: listener,
when: when
});
};
var useOverlayListener = function useOverlayListener(_ref) {
var target = _ref.target,
overlay = _ref.overlay,
_listener = _ref.listener,
_ref$when = _ref.when,
when = _ref$when === void 0 ? true : _ref$when;
var targetRef = React__namespace.useRef(null);
var overlayRef = React__namespace.useRef(null);
/**
* The parameters of the 'listener' method in the following event handlers;
* @param {Event} event A click event of the document.
* @param {string} options.type The custom type to detect event.
* @param {boolean} options.valid It is controlled by PrimeReact. It is determined whether it is valid or not according to some custom validation.
*/
var _useEventListener = useEventListener({
type: 'click',
listener: function listener(event) {
_listener && _listener(event, {
type: 'outside',
valid: event.which !== 3 && isOutsideClicked(event)
});
}
}),
_useEventListener2 = _slicedToArray(_useEventListener, 2),
bindDocumentClickListener = _useEventListener2[0],
unbindDocumentClickListener = _useEventListener2[1];
var _useResizeListener = useResizeListener({
listener: function listener(event) {
_listener && _listener(event, {
type: 'resize',
valid: !DomHandler.isTouchDevice()
});
}
}),
_useResizeListener2 = _slicedToArray(_useResizeListener, 2),
bindWindowResizeListener = _useResizeListener2[0],
unbindWindowResizeListener = _useResizeListener2[1];
var _useEventListener3 = useEventListener({
target: 'window',
type: 'orientationchange',
listener: function listener(event) {
_listener && _listener(event, {
type: 'orientationchange',
valid: true
});
}
}),
_useEventListener4 = _slicedToArray(_useEventListener3, 2),
bindWindowOrientationChangeListener = _useEventListener4[0],
unbindWindowOrientationChangeListener = _useEventListener4[1];
var _useOverlayScrollList = useOverlayScrollListener({
target: target,
listener: function listener(event) {
_listener && _listener(event, {
type: 'scroll',
valid: true
});
}
}),
_useOverlayScrollList2 = _slicedToArray(_useOverlayScrollList, 2),
bindOverlayScrollListener = _useOverlayScrollList2[0],
unbindOverlayScrollListener = _useOverlayScrollList2[1];
var isOutsideClicked = function isOutsideClicked(event) {
return targetRef.current && !(targetRef.current.isSameNode(event.target) || targetRef.current.contains(event.target) || overlayRef.current && overlayRef.current.contains(event.target));
};
var bind = function bind() {
bindDocumentClickListener();
bindWindowResizeListener();
bindWindowOrientationChangeListener();
bindOverlayScrollListener();
};
var unbind = function unbind() {
unbindDocumentClickListener();
unbindWindowResizeListener();
unbindWindowOrientationChangeListener();
unbindOverlayScrollListener();
};
React__namespace.useEffect(function () {
if (when) {
targetRef.current = DomHandler.getTargetElement(target);
overlayRef.current = DomHandler.getTargetElement(overlay);
} else {
unbind();
targetRef.current = overlayRef.current = null;
}
}, [target, overlay, when]);
React__namespace.useEffect(function () {
unbind();
}, [when]);
useUnmountEffect(function () {
unbind();
});
return [bind, unbind];
};
/* eslint-enable */
/**
* Hook to wrap around useState that stores the value in the browser local/session storage.
*
* @param {any} initialValue the initial value to store
* @param {string} key the key to store the value in local/session storage
* @param {string} storage either 'local' or 'session' for what type of storage
* @returns a stateful value, and a function to update it.
*/
var useStorage = function useStorage(initialValue, key) {
var storage = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'local';
// Since the local storage API isn't available in server-rendering environments,
// we check that typeof window !== 'undefined' to make SSR and SSG work properly.
var storageAvailable = typeof window !== 'undefined';
// subscribe to window storage event so changes in one tab to a stored value
// are properly reflected in all tabs
var _useEventListener = useEventListener({
target: 'window',
type: 'storage',
listener: function listener(event) {
var area = storage === 'local' ? window.localStorage : window.sessionStorage;
if (event.storageArea === area && event.key === key) {
setStoredValue(event.newValue || undefined);
}
}
}),
_useEventListener2 = _slicedToArray(_useEventListener, 2),
bindWindowStorageListener = _useEventListener2[0],
unbindWindowStorageListener = _useEventListener2[1];
var _React$useState = React__namespace.useState(undefined),
_React$useState2 = _slicedToArray(_React$useState, 2),
storedValue = _React$useState2[0],
setStoredValue = _React$useState2[1];
var setValue = function setValue(value) {
try {
// Allow value to be a function so we have same API as useState
var valueToStore = value instanceof Function ? value(storedValue) : value;
setStoredValue(valueToStore);
if (storageAvailable) {
var serializedValue = JSON.stringify(valueToStore);
storage === 'local' ? window.localStorage.setItem(key, serializedValue) : window.sessionStorage.setItem(key, serializedValue);
}
} catch (error) {
throw new Error("PrimeReact useStorage: Failed to serialize the value at key: ".concat(key));
}
};
React__namespace.useEffect(function () {
if (!storageAvailable) {
setStoredValue(initialValue);
}
try {
var item = storage === 'local' ? window.localStorage.getItem(key) : window.sessionStorage.getItem(key);
setStoredValue(item ? JSON.parse(item) : initialValue);
} catch (error) {
// If error also return initialValue
setStoredValue(initialValue);
}
bindWindowStorageListener();
return function () {
return unbindWindowStorageListener();
};
}, []);
return [storedValue, setValue];
};
/**
* Hook to wrap around useState that stores the value in the browser local storage.
*
* @param {any} initialValue the initial value to store
* @param {string} key the key to store the value in local storage
* @returns a stateful value, and a function to update it.
*/
var useLocalStorage = function useLocalStorage(initialValue, key) {
return useStorage(initialValue, key, 'local');
};
/**
* Hook to wrap around useState that stores the value in the browser session storage.
*
* @param {any} initialValue the initial value to store
* @param {string} key the key to store the value in session storage
* @returns a stateful value, and a function to update it.
*/
var useSessionStorage = function useSessionStorage(initialValue, key) {
return useStorage(initialValue, key, 'session');
};
/* eslint-enable */
/* eslint-disable */
var useUpdateEffect = function useUpdateEffect(fn, deps) {
var mounted = React__namespace.useRef(false);
return React__namespace.useEffect(function () {
if (!mounted.current) {
mounted.current = true;
return;
}
return fn && fn();
}, deps);
};
/* eslint-enable */
var CSSTransitionBase = {
defaultProps: {
__TYPE: 'CSSTransition',
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, CSSTransitionBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, CSSTransitionBase.defaultProps);
}
};
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; }
var CSSTransition = /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = CSSTransitionBase.getProps(inProps);
var disabled = props.disabled || props.options && props.options.disabled || !PrimeReact.cssTransition;
var onEnter = function onEnter(node, isAppearing) {
props.onEnter && props.onEnter(node, isAppearing); // component
props.options && props.options.onEnter && props.options.onEnter(node, isAppearing); // user option
};
var onEntering = function onEntering(node, isAppearing) {
props.onEntering && props.onEntering(node, isAppearing); // component
props.options && props.options.onEntering && props.options.onEntering(node, isAppearing); // user option
};
var onEntered = function onEntered(node, isAppearing) {
props.onEntered && props.onEntered(node, isAppearing); // component
props.options && props.options.onEntered && props.options.onEntered(node, isAppearing); // user option
};
var onExit = function onExit(node) {
props.onExit && props.onExit(node); // component
props.options && props.options.onExit && props.options.onExit(node); // user option
};
var onExiting = function onExiting(node) {
props.onExiting && props.onExiting(node); // component
props.options && props.options.onExiting && props.options.onExiting(node); // user option
};
var onExited = function onExited(node) {
props.onExited && props.onExited(node); // component
props.options && props.options.onExited && props.options.onExited(node); // user option
};
useUpdateEffect(function () {
if (disabled) {
// no animation
var node = ObjectUtils.getRefElement(props.nodeRef);
if (props["in"]) {
onEnter(node, true);
onEntering(node, true);
onEntered(node, true);
} else {
onExit(node);
onExiting(node);
onExited(node);
}
}
}, [props["in"]]);
if (disabled) {
return props["in"] ? props.children : null;
} else {
var immutableProps = {
nodeRef: props.nodeRef,
"in": props["in"],
onEnter: onEnter,
onEntering: onEntering,
onEntered: onEntered,
onExit: onExit,
onExiting: onExiting,
onExited: onExited
};
var mutableProps = {
classNames: props.classNames,
timeout: props.timeout,
unmountOnExit: props.unmountOnExit
};
var mergedProps = _objectSpread$x(_objectSpread$x(_objectSpread$x({}, mutableProps), props.options || {}), immutableProps);
return /*#__PURE__*/React__namespace.createElement(reactTransitionGroup.CSSTransition, mergedProps, props.children);
}
});
CSSTransition.displayName = 'CSSTransition';
var AccordionBase = {
defaultProps: {
__TYPE: 'Accordion',
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,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, AccordionBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, AccordionBase.defaultProps);
}
};
var AccordionTabBase = {
defaultProps: {
__TYPE: 'AccordionTab',
className: null,
contentClassName: null,
contentStyle: null,
disabled: false,
header: null,
headerClassName: null,
headerStyle: null,
headerTemplate: null,
style: null,
tabIndex: 0,
children: undefined
},
getCProp: function getCProp(tab, name) {
return ObjectUtils.getComponentProp(tab, name, AccordionTabBase.defaultProps);
},
getCProps: function getCProps(tab) {
return ObjectUtils.getComponentProps(tab, AccordionTabBase.defaultProps);
},
getCOtherProps: function getCOtherProps(tab) {
return ObjectUtils.getComponentDiffProps(tab, AccordionTabBase.defaultProps);
}
};
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; }
var AccordionTab = function AccordionTab() {};
var Accordion = /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = AccordionBase.getProps(inProps);
var _React$useState = React__namespace.useState(props.id),
_React$useState2 = _slicedToArray(_React$useState, 2),
idState = _React$useState2[0],
setIdState = _React$useState2[1];
var _React$useState3 = React__namespace.useState(props.activeIndex),
_React$useState4 = _slicedToArray(_React$useState3, 2),
activeIndexState = _React$useState4[0],
setActiveIndexState = _React$useState4[1];
var elementRef = React__namespace.useRef(null);
var activeIndex = props.onTabChange ? props.activeIndex : activeIndexState;
var getTabProp = function getTabProp(tab, name) {
return AccordionTabBase.getCProp(tab, name);
};
var onTabHeaderClick = function onTabHeaderClick(event, tab, index) {
if (!getTabProp(tab, 'disabled')) {
var selected = isSelected(index);
var newActiveIndex = null;
if (props.multiple) {
var indexes = activeIndex || [];
newActiveIndex = selected ? indexes.filter(function (i) {
return i !== index;
}) : [].concat(_toConsumableArray(indexes), [index]);
} else {
newActiveIndex = selected ? null : index;
}
var callback = selected ? props.onTabClose : props.onTabOpen;
callback && callback({
originalEvent: event,
index: index
});
if (props.onTabChange) {
props.onTabChange({
originalEvent: event,
index: newActiveIndex
});
} else {
setActiveIndexState(newActiveIndex);
}
}
event.preventDefault();
};
var isSelected = function isSelected(index) {
return props.multiple ? activeIndex && activeIndex.some(function (i) {
return i === index;
}) : activeIndex === index;
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
getElement: function getElement() {
return elementRef.current;
}
};
});
useMountEffect(function () {
if (!idState) {
setIdState(UniqueComponentId());
}
});
if (!idState) {
return null;
}
var createTabHeader = function createTabHeader(tab, selected, index) {
var style = _objectSpread$w(_objectSpread$w({}, getTabProp(tab, 'style') || {}), getTabProp(tab, 'headerStyle') || {});
var className = classNames('p-accordion-header', {
'p-highlight': selected,
'p-disabled': getTabProp(tab, 'disabled')
}, getTabProp(tab, 'headerClassName'), getTabProp(tab, 'className'));
var headerId = idState + '_header_' + index;
var ariaControls = idState + '_content_' + index;
var tabIndex = getTabProp(tab, 'disabled') ? -1 : getTabProp(tab, 'tabIndex');
var header = getTabProp(tab, 'headerTemplate') ? ObjectUtils.getJSXElement(getTabProp(tab, 'headerTemplate'), AccordionTabBase.getCProps(tab)) : /*#__PURE__*/React__namespace.createElement("span", {
className: "p-accordion-header-text"
}, getTabProp(tab, 'header'));
var icon = IconUtils.getJSXIcon(selected ? props.collapseIcon : props.expandIcon, {
className: 'p-accordion-toggle-icon'
}, {
props: props,
selected: selected
});
var label = selected ? ariaLabel('collapseLabel') : ariaLabel('expandLabel');
return /*#__PURE__*/React__namespace.createElement("div", {
className: className,
style: style
}, /*#__PURE__*/React__namespace.createElement("a", {
href: '#' + ariaControls,
id: headerId,
className: "p-accordion-header-link",
"aria-controls": ariaControls,
role: "tab",
"aria-expanded": selected,
onClick: function onClick(e) {
return onTabHeaderClick(e, tab, index);
},
tabIndex: tabIndex,
"aria-label": label
}, icon, header));
};
var createTabContent = function createTabContent(tab, selected, index) {
var style = _objectSpread$w(_objectSpread$w({}, getTabProp(tab, 'style') || {}), getTabProp(tab, 'contentStyle') || {});
var className = classNames('p-toggleable-content', getTabProp(tab, 'contentClassName'), getTabProp(tab, 'className'));
var contentId = idState + '_content_' + index;
var ariaLabelledby = idState + '_header_' + index;
var contentRef = /*#__PURE__*/React__namespace.createRef();
return /*#__PURE__*/React__namespace.createElement(CSSTransition, {
nodeRef: contentRef,
classNames: "p-toggleable-content",
timeout: {
enter: 1000,
exit: 450
},
"in": selected,
unmountOnExit: true,
options: props.transitionOptions
}, /*#__PURE__*/React__namespace.createElement("div", {
ref: contentRef,
id: contentId,
className: className,
style: style,
role: "region",
"aria-labelledby": ariaLabelledby
}, /*#__PURE__*/React__namespace.createElement("div", {
className: "p-accordion-content"
}, getTabProp(tab, 'children'))));
};
var createTab = function createTab(tab, index) {
if (ObjectUtils.isValidChild(tab, 'AccordionTab')) {
var key = idState + '_' + index;
var selected = isSelected(index);
var _otherProps = AccordionTabBase.getCOtherProps(tab);
var tabHeader = createTabHeader(tab, selected, index);
var tabContent = createTabContent(tab, selected, index);
var tabClassName = classNames('p-accordion-tab', {
'p-accordion-tab-active': selected
});
return /*#__PURE__*/React__namespace.createElement("div", _extends({
key: key,
className: tabClassName
}, _otherProps), tabHeader, tabContent);
}
return null;
};
var createTabs = function createTabs() {
return React__namespace.Children.map(props.children, createTab);
};
var otherProps = AccordionBase.getOtherProps(props);
var className = classNames('p-accordion p-component', props.className);
var tabs = createTabs();
return /*#__PURE__*/React__namespace.createElement("div", _extends({
id: idState,
ref: elementRef,
className: className,
style: props.style
}, otherProps), tabs);
});
AccordionTab.displayName = 'AccordionTab';
Accordion.displayName = 'Accordion';
var Ripple = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function () {
var inkRef = React__namespace.useRef(null);
var targetRef = React__namespace.useRef(null);
var getTarget = function getTarget() {
return inkRef.current && inkRef.current.parentElement;
};
var bindEvents = function bindEvents() {
if (targetRef.current) {
targetRef.current.addEventListener('mousedown', onMouseDown);
DomHandler.isTouchDevice() && targetRef.current.addEventListener('touchstart', onTouchStart);
}
};
var unbindEvents = function unbindEvents() {
if (targetRef.current) {
targetRef.current.removeEventListener('mousedown', onMouseDown);
DomHandler.isTouchDevice() && targetRef.current.removeEventListener('touchstart', onTouchStart);
}
};
var onTouchStart = function onTouchStart(event) {
var offset = DomHandler.getOffset(targetRef.current);
var offsetX = event.targetTouches[0].pageX - offset.left + document.body.scrollTop - DomHandler.getWidth(inkRef.current) / 2;
var offsetY = event.targetTouches[0].pageY - offset.top + document.body.scrollLeft - DomHandler.getHeight(inkRef.current) / 2;
activateRipple(offsetX, offsetY);
};
var onMouseDown = function onMouseDown(event) {
if (DomHandler.isTouchDevice()) {
// already started ripple with onTouchStart
return;
}
var offset = DomHandler.getOffset(targetRef.current);
var offsetX = event.pageX - offset.left + document.body.scrollTop - DomHandler.getWidth(inkRef.current) / 2;
var offsetY = event.pageY - offset.top + document.body.scrollLeft - DomHandler.getHeight(inkRef.current) / 2;
activateRipple(offsetX, offsetY);
};
var activateRipple = function activateRipple(offsetX, offsetY) {
if (!inkRef.current || getComputedStyle(inkRef.current, null).display === 'none') {
return;
}
DomHandler.removeClass(inkRef.current, 'p-ink-active');
if (!DomHandler.getHeight(inkRef.current) && !DomHandler.getWidth(inkRef.current)) {
var d = Math.max(DomHandler.getOuterWidth(targetRef.current), DomHandler.getOuterHeight(targetRef.current));
inkRef.current.style.height = d + 'px';
inkRef.current.style.width = d + 'px';
}
inkRef.current.style.top = offsetY + 'px';
inkRef.current.style.left = offsetX + 'px';
DomHandler.addClass(inkRef.current, 'p-ink-active');
};
var onAnimationEnd = function onAnimationEnd(event) {
DomHandler.removeClass(event.currentTarget, 'p-ink-active');
};
useMountEffect(function () {
if (inkRef.current) {
targetRef.current = getTarget();
bindEvents();
}
});
useUpdateEffect(function () {
if (inkRef.current && !targetRef.current) {
targetRef.current = getTarget();
bindEvents();
}
});
useUnmountEffect(function () {
if (inkRef.current) {
targetRef.current = null;
unbindEvents();
}
});
return PrimeReact.ripple ? /*#__PURE__*/React__namespace.createElement("span", {
role: "presentation",
ref: inkRef,
className: "p-ink",
onAnimationEnd: onAnimationEnd
}) : null;
}));
Ripple.displayName = 'Ripple';
var PortalBase = {
defaultProps: {
__TYPE: 'Portal',
element: null,
appendTo: null,
visible: false,
onMounted: null,
onUnmounted: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, PortalBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, PortalBase.defaultProps);
}
};
var Portal = /*#__PURE__*/React__namespace.memo(function (inProps) {
var props = PortalBase.getProps(inProps);
var _React$useState = React__namespace.useState(props.visible && DomHandler.hasDOM()),
_React$useState2 = _slicedToArray(_React$useState, 2),
mountedState = _React$useState2[0],
setMountedState = _React$useState2[1];
useMountEffect(function () {
if (DomHandler.hasDOM() && !mountedState) {
setMountedState(true);
props.onMounted && props.onMounted();
}
});
useUpdateEffect(function () {
props.onMounted && props.onMounted();
}, [mountedState]);
useUnmountEffect(function () {
props.onUnmounted && props.onUnmounted();
});
var element = props.element || props.children;
if (element && mountedState) {
var appendTo = props.appendTo || PrimeReact.appendTo || document.body;
return appendTo === 'self' ? element : /*#__PURE__*/ReactDOM__default["default"].createPortal(element, appendTo);
}
return null;
});
Portal.displayName = 'Portal';
var TooltipBase = {
defaultProps: {
__TYPE: 'Tooltip',
appendTo: null,
at: null,
autoHide: true,
autoZIndex: true,
baseZIndex: 0,
className: null,
content: null,
disabled: false,
event: null,
hideDelay: 0,
hideEvent: 'mouseleave',
id: null,
mouseTrack: false,
mouseTrackLeft: 5,
mouseTrackTop: 5,
my: null,
onBeforeHide: null,
onBeforeShow: null,
onHide: null,
onShow: null,
position: 'right',
showDelay: 0,
showEvent: 'mouseenter',
showOnDisabled: false,
style: null,
target: null,
updateDelay: 0,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, TooltipBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, TooltipBase.defaultProps);
}
};
var Tooltip = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = TooltipBase.getProps(inProps);
var _React$useState = React__namespace.useState(false),
_React$useState2 = _slicedToArray(_React$useState, 2),
visibleState = _React$useState2[0],
setVisibleState = _React$useState2[1];
var _React$useState3 = React__namespace.useState(props.position),
_React$useState4 = _slicedToArray(_React$useState3, 2),
positionState = _React$useState4[0],
setPositionState = _React$useState4[1];
var _React$useState5 = React__namespace.useState(''),
_React$useState6 = _slicedToArray(_React$useState5, 2),
classNameState = _React$useState6[0],
setClassNameState = _React$useState6[1];
var elementRef = React__namespace.useRef(null);
var textRef = React__namespace.useRef(null);
var currentTargetRef = React__namespace.useRef(null);
var containerSize = React__namespace.useRef(null);
var allowHide = React__namespace.useRef(true);
var timeouts = React__namespace.useRef({});
var currentMouseEvent = React__namespace.useRef(null);
var _useResizeListener = useResizeListener({
listener: function listener(event) {
!DomHandler.isTouchDevice() && hide(event);
}
}),
_useResizeListener2 = _slicedToArray(_useResizeListener, 2),
bindWindowResizeListener = _useResizeListener2[0],
unbindWindowResizeListener = _useResizeListener2[1];
var _useOverlayScrollList = useOverlayScrollListener({
target: currentTargetRef.current,
listener: function listener(event) {
hide(event);
},
when: visibleState
}),
_useOverlayScrollList2 = _slicedToArray(_useOverlayScrollList, 2),
bindOverlayScrollListener = _useOverlayScrollList2[0],
unbindOverlayScrollListener = _useOverlayScrollList2[1];
var isTargetContentEmpty = function isTargetContentEmpty(target) {
return !(props.content || getTargetOption(target, 'tooltip'));
};
var isContentEmpty = function isContentEmpty(target) {
return !(props.content || getTargetOption(target, 'tooltip') || props.children);
};
var isMouseTrack = function isMouseTrack(target) {
return getTargetOption(target, 'mousetrack') || props.mouseTrack;
};
var isDisabled = function isDisabled(target) {
return getTargetOption(target, 'disabled') === 'true' || hasTargetOption(target, 'disabled') || props.disabled;
};
var isShowOnDisabled = function isShowOnDisabled(target) {
return getTargetOption(target, 'showondisabled') || props.showOnDisabled;
};
var isAutoHide = function isAutoHide() {
return getTargetOption(currentTargetRef.current, 'autohide') || props.autoHide;
};
var getTargetOption = function getTargetOption(target, option) {
return hasTargetOption(target, "data-pr-".concat(option)) ? target.getAttribute("data-pr-".concat(option)) : null;
};
var hasTargetOption = function hasTargetOption(target, option) {
return target && target.hasAttribute(option);
};
var getEvents = function getEvents(target) {
var showEvents = [getTargetOption(target, 'showevent') || props.showEvent];
var hideEvents = [getTargetOption(target, 'hideevent') || props.hideEvent];
if (isMouseTrack(target)) {
showEvents = ['mousemove'];
hideEvents = ['mouseleave'];
} else {
var event = getTargetOption(target, 'event') || props.event;
if (event === 'focus') {
showEvents = ['focus'];
hideEvents = ['blur'];
}
if (event === 'both') {
showEvents = ['focus', 'mouseenter'];
hideEvents = ['blur', 'mouseleave'];
}
}
return {
showEvents: showEvents,
hideEvents: hideEvents
};
};
var getPosition = function getPosition(target) {
return getTargetOption(target, 'position') || positionState;
};
var getMouseTrackPosition = function getMouseTrackPosition(target) {
var top = getTargetOption(target, 'mousetracktop') || props.mouseTrackTop;
var left = getTargetOption(target, 'mousetrackleft') || props.mouseTrackLeft;
return {
top: top,
left: left
};
};
var updateText = function updateText(target, callback) {
if (textRef.current) {
var content = getTargetOption(target, 'tooltip') || props.content;
if (content) {
textRef.current.innerHTML = ''; // remove children
textRef.current.appendChild(document.createTextNode(content));
callback();
} else if (props.children) {
callback();
}
}
};
var updateTooltipState = function updateTooltipState(position) {
updateText(currentTargetRef.current, function () {
var _currentMouseEvent$cu = currentMouseEvent.current,
x = _currentMouseEvent$cu.pageX,
y = _currentMouseEvent$cu.pageY;
if (props.autoZIndex && !ZIndexUtils.get(elementRef.current)) {
ZIndexUtils.set('tooltip', elementRef.current, PrimeReact.autoZIndex, props.baseZIndex || PrimeReact.zIndex['tooltip']);
}
elementRef.current.style.left = '';
elementRef.current.style.top = '';
// GitHub #2695 disable pointer events when autohiding
if (isAutoHide()) {
elementRef.current.style.pointerEvents = 'none';
}
if ((isMouseTrack(currentTargetRef.current) || position == 'mouse') && !containerSize.current) {
containerSize.current = {
width: DomHandler.getOuterWidth(elementRef.current),
height: DomHandler.getOuterHeight(elementRef.current)
};
}
align(currentTargetRef.current, {
x: x,
y: y
}, position);
});
};
var show = function show(e) {
currentTargetRef.current = e.currentTarget;
var disabled = isDisabled(currentTargetRef.current);
var empty = isContentEmpty(isShowOnDisabled(currentTargetRef.current) && disabled ? currentTargetRef.current.firstChild : currentTargetRef.current);
if (empty || disabled) {
return;
}
currentMouseEvent.current = e;
if (visibleState) {
applyDelay('updateDelay', updateTooltipState);
} else {
// #2653 give the callback a chance to return false and not continue with display
var success = sendCallback(props.onBeforeShow, {
originalEvent: e,
target: currentTargetRef.current
});
if (success) {
applyDelay('showDelay', function () {
setVisibleState(true);
sendCallback(props.onShow, {
originalEvent: e,
target: currentTargetRef.current
});
});
}
}
};
var hide = function hide(e) {
clearTimeouts();
if (visibleState) {
var success = sendCallback(props.onBeforeHide, {
originalEvent: e,
target: currentTargetRef.current
});
if (success) {
applyDelay('hideDelay', function () {
if (!isAutoHide() && allowHide.current === false) {
return;
}
ZIndexUtils.clear(elementRef.current);
DomHandler.removeClass(elementRef.current, 'p-tooltip-active');
setVisibleState(false);
sendCallback(props.onHide, {
originalEvent: e,
target: currentTargetRef.current
});
});
}
}
};
var align = function align(target, coordinate, position) {
var left = 0,
top = 0,
currentPosition = position || positionState;
if ((isMouseTrack(target) || currentPosition == 'mouse') && coordinate) {
var _containerSize = {
width: DomHandler.getOuterWidth(elementRef.current),
height: DomHandler.getOuterHeight(elementRef.current)
};
left = coordinate.x;
top = coordinate.y;
var _getMouseTrackPositio = getMouseTrackPosition(target),
mouseTrackTop = _getMouseTrackPositio.top,
mouseTrackLeft = _getMouseTrackPositio.left;
switch (currentPosition) {
case 'left':
left -= _containerSize.width + mouseTrackLeft;
top -= _containerSize.height / 2 - mouseTrackTop;
break;
case 'right':
case 'mouse':
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 || containerSize.current.width > _containerSize.width) {
elementRef.current.style.left = '0px';
elementRef.current.style.right = window.innerWidth - _containerSize.width - left + 'px';
} else {
elementRef.current.style.right = '';
elementRef.current.style.left = left + 'px';
}
elementRef.current.style.top = top + 'px';
DomHandler.addClass(elementRef.current, 'p-tooltip-active');
} else {
var pos = DomHandler.findCollisionPosition(currentPosition);
var my = getTargetOption(target, 'my') || props.my || pos.my;
var at = getTargetOption(target, 'at') || props.at || pos.at;
elementRef.current.style.padding = '0px';
DomHandler.flipfitCollision(elementRef.current, target, my, at, function (calculatedPosition) {
var _calculatedPosition$a = calculatedPosition.at,
atX = _calculatedPosition$a.x,
atY = _calculatedPosition$a.y;
var myX = calculatedPosition.my.x;
var newPosition = props.at ? atX !== 'center' && atX !== myX ? atX : atY : calculatedPosition.at["".concat(pos.axis)];
elementRef.current.style.padding = '';
setPositionState(newPosition);
updateContainerPosition(newPosition);
DomHandler.addClass(elementRef.current, 'p-tooltip-active');
});
}
};
var updateContainerPosition = function updateContainerPosition(position) {
if (elementRef.current) {
var style = getComputedStyle(elementRef.current);
if (position === 'left') elementRef.current.style.left = parseFloat(style.left) - parseFloat(style.paddingLeft) * 2 + 'px';else if (position === 'top') elementRef.current.style.top = parseFloat(style.top) - parseFloat(style.paddingTop) * 2 + 'px';
}
};
var onMouseEnter = function onMouseEnter() {
if (!isAutoHide()) {
allowHide.current = false;
}
};
var onMouseLeave = function onMouseLeave(e) {
if (!isAutoHide()) {
allowHide.current = true;
hide(e);
}
};
var bindTargetEvent = function bindTargetEvent(target) {
if (target) {
var _getEvents = getEvents(target),
showEvents = _getEvents.showEvents,
hideEvents = _getEvents.hideEvents;
var currentTarget = getTarget(target);
showEvents.forEach(function (event) {
return currentTarget === null || currentTarget === void 0 ? void 0 : currentTarget.addEventListener(event, show);
});
hideEvents.forEach(function (event) {
return currentTarget === null || currentTarget === void 0 ? void 0 : currentTarget.addEventListener(event, hide);
});
}
};
var unbindTargetEvent = function unbindTargetEvent(target) {
if (target) {
var _getEvents2 = getEvents(target),
showEvents = _getEvents2.showEvents,
hideEvents = _getEvents2.hideEvents;
var currentTarget = getTarget(target);
showEvents.forEach(function (event) {
return currentTarget === null || currentTarget === void 0 ? void 0 : currentTarget.removeEventListener(event, show);
});
hideEvents.forEach(function (event) {
return currentTarget === null || currentTarget === void 0 ? void 0 : currentTarget.removeEventListener(event, hide);
});
}
};
var applyDelay = function applyDelay(delayProp, callback) {
clearTimeouts();
var delay = getTargetOption(currentTargetRef.current, delayProp.toLowerCase()) || props[delayProp];
!!delay ? timeouts.current["".concat(delayProp)] = setTimeout(function () {
return callback();
}, delay) : callback();
};
var sendCallback = 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];
}
var result = callback.apply(void 0, params);
if (result === undefined) {
result = true;
}
return result;
}
return true;
};
var clearTimeouts = function clearTimeouts() {
Object.values(timeouts.current).forEach(function (t) {
return clearTimeout(t);
});
};
var getTarget = function getTarget(target) {
if (target) {
if (isShowOnDisabled(target)) {
if (!target.hasWrapper) {
var wrapper = document.createElement('span');
DomHandler.addClass(wrapper, 'p-tooltip-target-wrapper');
target.parentNode.insertBefore(wrapper, target);
wrapper.appendChild(target);
target.hasWrapper = true;
return wrapper;
} else {
return target.parentElement;
}
} else if (target.hasWrapper) {
var _target$parentElement;
(_target$parentElement = target.parentElement).replaceWith.apply(_target$parentElement, _toConsumableArray(target.parentElement.childNodes));
delete target.hasWrapper;
}
return target;
}
return null;
};
var updateTargetEvents = function updateTargetEvents(target) {
unloadTargetEvents(target);
loadTargetEvents(target);
};
var loadTargetEvents = function loadTargetEvents(target) {
setTargetEventOperations(target || props.target, bindTargetEvent);
};
var unloadTargetEvents = function unloadTargetEvents(target) {
setTargetEventOperations(target || props.target, unbindTargetEvent);
};
var setTargetEventOperations = function setTargetEventOperations(target, operation) {
target = ObjectUtils.getRefElement(target);
if (target) {
if (DomHandler.isElement(target)) {
operation(target);
} else {
var setEvent = function setEvent(target) {
var element = DomHandler.find(document, target);
element.forEach(function (el) {
operation(el);
});
};
if (target instanceof Array) {
target.forEach(function (t) {
setEvent(t);
});
} else {
setEvent(target);
}
}
}
};
useMountEffect(function () {
loadTargetEvents();
if (visibleState && currentTargetRef.current && isDisabled(currentTargetRef.current)) {
hide();
}
});
useUpdateEffect(function () {
loadTargetEvents();
return function () {
unloadTargetEvents();
};
}, [show, hide, props.target]);
useUpdateEffect(function () {
if (visibleState) {
var position = getPosition(currentTargetRef.current);
var classname = getTargetOption(currentTargetRef.current, 'classname');
setPositionState(position);
setClassNameState(classname);
updateTooltipState(position);
bindWindowResizeListener();
bindOverlayScrollListener();
} else {
setPositionState(props.position);
setClassNameState('');
currentTargetRef.current = null;
containerSize.current = null;
allowHide.current = true;
}
return function () {
unbindWindowResizeListener();
unbindOverlayScrollListener();
};
}, [visibleState]);
useUpdateEffect(function () {
if (visibleState) {
applyDelay('updateDelay', function () {
updateText(currentTargetRef.current, function () {
align(currentTargetRef.current);
});
});
}
}, [props.content]);
useUnmountEffect(function () {
clearTimeouts();
unloadTargetEvents();
ZIndexUtils.clear(elementRef.current);
});
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
updateTargetEvents: updateTargetEvents,
loadTargetEvents: loadTargetEvents,
unloadTargetEvents: unloadTargetEvents,
show: show,
hide: hide,
getElement: function getElement() {
return elementRef.current;
},
getTarget: function getTarget() {
return currentTargetRef.current;
}
};
});
var createElement = function createElement() {
var otherProps = TooltipBase.getOtherProps(props);
var tooltipClassName = classNames('p-tooltip p-component', _defineProperty({}, "p-tooltip-".concat(positionState), true), props.className, classNameState);
var empty = isTargetContentEmpty(currentTargetRef.current);
return /*#__PURE__*/React__namespace.createElement("div", _extends({
id: props.id,
ref: elementRef,
className: tooltipClassName,
style: props.style,
role: "tooltip",
"aria-hidden": visibleState
}, otherProps, {
onMouseEnter: onMouseEnter,
onMouseLeave: onMouseLeave
}), /*#__PURE__*/React__namespace.createElement("div", {
className: "p-tooltip-arrow"
}), /*#__PURE__*/React__namespace.createElement("div", {
ref: textRef,
className: "p-tooltip-text"
}, empty && props.children));
};
if (visibleState) {
var element = createElement();
return /*#__PURE__*/React__namespace.createElement(Portal, {
element: element,
appendTo: props.appendTo,
visible: true
});
}
return null;
}));
Tooltip.displayName = 'Tooltip';
var ButtonBase = {
defaultProps: {
__TYPE: 'Button',
label: null,
icon: null,
iconPos: 'left',
badge: null,
severity: null,
rounded: false,
raised: false,
outlined: false,
text: false,
link: false,
badgeClassName: null,
tooltip: null,
size: null,
tooltipOptions: null,
disabled: false,
loading: false,
loadingIcon: 'pi pi-spinner pi-spin',
visible: true,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, ButtonBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, ButtonBase.defaultProps);
}
};
var Button = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var _classNames2;
var props = ButtonBase.getProps(inProps);
var elementRef = React__namespace.useRef(ref);
React__namespace.useEffect(function () {
ObjectUtils.combinedRefs(elementRef, ref);
}, [elementRef, ref]);
if (props.visible === false) {
return null;
}
var createIcon = function createIcon() {
var icon = props.loading ? props.loadingIcon : props.icon;
var className = classNames('p-button-icon p-c', _defineProperty({
'p-button-loading-icon': props.loading
}, "p-button-icon-".concat(props.iconPos), props.label));
return IconUtils.getJSXIcon(icon, {
className: className
}, {
props: props
});
};
var createLabel = function createLabel() {
if (props.label) {
return /*#__PURE__*/React__namespace.createElement("span", {
className: "p-button-label p-c"
}, props.label);
}
return !props.children && !props.label && /*#__PURE__*/React__namespace.createElement("span", {
className: "p-button-label p-c",
dangerouslySetInnerHTML: {
__html: ' '
}
});
};
var createBadge = function createBadge() {
if (props.badge) {
var badgeClassName = classNames('p-badge', props.badgeClassName);
return /*#__PURE__*/React__namespace.createElement("span", {
className: badgeClassName
}, props.badge);
}
return null;
};
var disabled = props.disabled || props.loading;
var showTooltip = !disabled || props.tooltipOptions && props.tooltipOptions.showOnDisabled;
var hasTooltip = ObjectUtils.isNotEmpty(props.tooltip) && showTooltip;
var otherProps = ButtonBase.getOtherProps(props);
var sizeMapping = {
large: 'lg',
small: 'sm'
};
var size = sizeMapping[props.size];
var className = classNames('p-button p-component', props.className, (_classNames2 = {
'p-button-icon-only': (props.icon || props.loading && props.loadingIcon) && !props.label && !props.children,
'p-button-vertical': (props.iconPos === 'top' || props.iconPos === 'bottom') && props.label,
'p-disabled': disabled,
'p-button-loading': props.loading,
'p-button-outlined': props.outlined,
'p-button-raised': props.raised,
'p-button-link': props.link,
'p-button-text': props.text,
'p-button-rounded': props.rounded,
'p-button-loading-label-only': props.loading && !props.icon && props.label
}, _defineProperty(_classNames2, "p-button-loading-".concat(props.iconPos), props.loading && props.loadingIcon && props.label), _defineProperty(_classNames2, "p-button-".concat(size), size), _defineProperty(_classNames2, "p-button-".concat(props.severity), props.severity), _classNames2));
var icon = createIcon();
var label = createLabel();
var badge = createBadge();
var defaultAriaLabel = props.label ? props.label + (props.badge ? ' ' + props.badge : '') : props['aria-label'];
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement("button", _extends({
ref: elementRef,
"aria-label": defaultAriaLabel
}, otherProps, {
className: className,
disabled: disabled
}), icon, label, props.children, badge, /*#__PURE__*/React__namespace.createElement(Ripple, null)), hasTooltip && /*#__PURE__*/React__namespace.createElement(Tooltip, _extends({
target: elementRef,
content: props.tooltip
}, props.tooltipOptions)));
}));
Button.displayName = 'Button';
var KeyFilter = {
/* eslint-disable */
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
},
/* eslint-enable */getRegex: function getRegex(keyfilter) {
return KeyFilter.DEFAULT_MASKS[keyfilter] ? KeyFilter.DEFAULT_MASKS[keyfilter] : keyfilter;
},
onKeyPress: function onKeyPress(e, keyfilter, validateOnly) {
if (validateOnly) {
return;
}
if (e.ctrlKey || e.altKey) {
return;
}
var isPrintableKey = e.key.length === 1;
if (!isPrintableKey) {
return;
}
var regex = this.getRegex(keyfilter);
if (!regex.test(e.key)) {
e.preventDefault();
}
},
onPaste: function onPaste(e, keyfilter, validateOnly) {
if (validateOnly) {
return;
}
var regex = this.getRegex(keyfilter);
var clipboard = e.clipboardData.getData('text');
// loop over each letter pasted and if any fail prevent the paste
_toConsumableArray(clipboard).forEach(function (c) {
if (!regex.test(c)) {
e.preventDefault();
return false;
}
});
},
validate: function validate(e, keyfilter) {
var value = e.target.value,
validatePattern = true;
var regex = this.getRegex(keyfilter);
if (value && !regex.test(value)) {
validatePattern = false;
}
return validatePattern;
}
};
var InputTextBase = {
defaultProps: {
__TYPE: 'InputText',
keyfilter: null,
validateOnly: false,
tooltip: null,
tooltipOptions: null,
onInput: null,
onKeyDown: null,
onPaste: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, InputTextBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, InputTextBase.defaultProps);
}
};
var InputText = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = InputTextBase.getProps(inProps);
var elementRef = React__namespace.useRef(ref);
var onKeyDown = function onKeyDown(event) {
props.onKeyDown && props.onKeyDown(event);
if (props.keyfilter) {
KeyFilter.onKeyPress(event, props.keyfilter, props.validateOnly);
}
};
var onInput = function onInput(event) {
var validatePattern = true;
if (props.keyfilter && props.validateOnly) {
validatePattern = KeyFilter.validate(event, props.keyfilter);
}
props.onInput && props.onInput(event, validatePattern);
if (!props.onChange) {
var target = event.target;
ObjectUtils.isNotEmpty(target.value) ? DomHandler.addClass(target, 'p-filled') : DomHandler.removeClass(target, 'p-filled');
}
};
var onPaste = function onPaste(event) {
props.onPaste && props.onPaste(event);
if (props.keyfilter) {
KeyFilter.onPaste(event, props.keyfilter, props.validateOnly);
}
};
var currentValue = elementRef.current && elementRef.current.value;
var isFilled = React__namespace.useMemo(function () {
return ObjectUtils.isNotEmpty(props.value) || ObjectUtils.isNotEmpty(props.defaultValue) || ObjectUtils.isNotEmpty(currentValue);
}, [props.value, props.defaultValue, currentValue]);
React__namespace.useEffect(function () {
ObjectUtils.combinedRefs(elementRef, ref);
}, [elementRef, ref]);
var hasTooltip = ObjectUtils.isNotEmpty(props.tooltip);
var otherProps = InputTextBase.getOtherProps(props);
var className = classNames('p-inputtext p-component', {
'p-disabled': props.disabled,
'p-filled': isFilled
}, props.className);
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement("input", _extends({
ref: elementRef
}, otherProps, {
className: className,
onInput: onInput,
onKeyDown: onKeyDown,
onPaste: onPaste
})), hasTooltip && /*#__PURE__*/React__namespace.createElement(Tooltip, _extends({
target: elementRef,
content: props.tooltip
}, props.tooltipOptions)));
}));
InputText.displayName = 'InputText';
var OverlayService = EventBus();
var AutoCompleteBase = {
defaultProps: {
__TYPE: 'AutoComplete',
id: null,
appendTo: null,
autoFocus: false,
autoHighlight: false,
className: null,
completeMethod: null,
delay: 300,
disabled: false,
dropdown: false,
dropdownAriaLabel: null,
dropdownAutoFocus: true,
dropdownIcon: 'pi pi-chevron-down',
dropdownMode: 'blank',
emptyMessage: null,
field: null,
forceSelection: false,
inputClassName: null,
inputId: null,
inputRef: null,
inputStyle: null,
itemTemplate: null,
maxLength: null,
minLength: 1,
multiple: false,
name: null,
onBlur: null,
onChange: null,
onClear: null,
onClick: null,
onContextMenu: null,
onDblClick: null,
onDropdownClick: null,
onFocus: null,
onHide: null,
onKeyPress: null,
onKeyUp: null,
onMouseDown: null,
onSelect: null,
onShow: null,
onUnselect: null,
optionGroupChildren: null,
optionGroupLabel: null,
optionGroupTemplate: null,
panelClassName: null,
panelStyle: null,
placeholder: null,
readOnly: false,
removeIcon: 'pi pi-times-circle',
scrollHeight: '200px',
selectedItemTemplate: null,
selectionLimit: null,
showEmptyMessage: false,
size: null,
style: null,
suggestions: null,
tabIndex: null,
tooltip: null,
tooltipOptions: null,
transitionOptions: null,
type: 'text',
value: null,
virtualScrollerOptions: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, AutoCompleteBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, AutoCompleteBase.defaultProps);
}
};
var VirtualScrollerBase = {
defaultProps: {
__TYPE: 'VirtualScroller',
id: null,
style: null,
className: null,
tabIndex: 0,
items: null,
itemSize: 0,
scrollHeight: null,
scrollWidth: null,
orientation: 'vertical',
step: 0,
numToleratedItems: null,
delay: 0,
resizeDelay: 10,
appendOnly: false,
inline: false,
lazy: false,
disabled: false,
loaderDisabled: false,
columns: null,
loading: undefined,
autoSize: false,
showSpacer: true,
showLoader: false,
loadingTemplate: null,
loaderIconTemplate: null,
itemTemplate: null,
contentTemplate: null,
onScroll: null,
onScrollIndexChange: null,
onLazyLoad: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, VirtualScrollerBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, VirtualScrollerBase.defaultProps);
}
};
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; }
var VirtualScroller = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = VirtualScrollerBase.getProps(inProps);
var prevProps = usePrevious(inProps) || {};
var vertical = props.orientation === 'vertical';
var horizontal = props.orientation === 'horizontal';
var both = props.orientation === 'both';
var _React$useState = React__namespace.useState(both ? {
rows: 0,
cols: 0
} : 0),
_React$useState2 = _slicedToArray(_React$useState, 2),
firstState = _React$useState2[0],
setFirstState = _React$useState2[1];
var _React$useState3 = React__namespace.useState(both ? {
rows: 0,
cols: 0
} : 0),
_React$useState4 = _slicedToArray(_React$useState3, 2),
lastState = _React$useState4[0],
setLastState = _React$useState4[1];
var _React$useState5 = React__namespace.useState(0),
_React$useState6 = _slicedToArray(_React$useState5, 2),
pageState = _React$useState6[0],
setPageState = _React$useState6[1];
var _React$useState7 = React__namespace.useState(both ? {
rows: 0,
cols: 0
} : 0),
_React$useState8 = _slicedToArray(_React$useState7, 2),
numItemsInViewportState = _React$useState8[0],
setNumItemsInViewportState = _React$useState8[1];
var _React$useState9 = React__namespace.useState(props.numToleratedItems),
_React$useState10 = _slicedToArray(_React$useState9, 2),
numToleratedItemsState = _React$useState10[0],
setNumToleratedItemsState = _React$useState10[1];
var _React$useState11 = React__namespace.useState(props.loading || false),
_React$useState12 = _slicedToArray(_React$useState11, 2),
loadingState = _React$useState12[0],
setLoadingState = _React$useState12[1];
var _React$useState13 = React__namespace.useState([]),
_React$useState14 = _slicedToArray(_React$useState13, 2),
loaderArrState = _React$useState14[0],
setLoaderArrState = _React$useState14[1];
var elementRef = React__namespace.useRef(null);
var _contentRef = React__namespace.useRef(null);
var _spacerRef = React__namespace.useRef(null);
var _stickyRef = React__namespace.useRef(null);
var lastScrollPos = React__namespace.useRef(both ? {
top: 0,
left: 0
} : 0);
var scrollTimeout = React__namespace.useRef(null);
var resizeTimeout = React__namespace.useRef(null);
var contentStyle = React__namespace.useRef({});
var spacerStyle = React__namespace.useRef({});
var defaultWidth = React__namespace.useRef(null);
var defaultHeight = React__namespace.useRef(null);
var defaultContentWidth = React__namespace.useRef(null);
var defaultContentHeight = React__namespace.useRef(null);
var isItemRangeChanged = React__namespace.useRef(false);
var lazyLoadState = React__namespace.useRef(null);
var _useResizeListener = useResizeListener({
listener: function listener(event) {
return onResize();
},
when: !props.disabled
}),
_useResizeListener2 = _slicedToArray(_useResizeListener, 1),
bindWindowResizeListener = _useResizeListener2[0];
var _useEventListener = useEventListener({
target: 'window',
type: 'orientationchange',
listener: function listener(event) {
return onResize();
},
when: !props.disabled
}),
_useEventListener2 = _slicedToArray(_useEventListener, 1),
bindOrientationChangeListener = _useEventListener2[0];
var getElementRef = function getElementRef() {
return elementRef;
};
var getPageByFirst = function getPageByFirst(first) {
return Math.floor((first + numToleratedItemsState * 4) / (props.step || 1));
};
var setContentElement = function setContentElement(element) {
_contentRef.current = element || _contentRef.current || DomHandler.findSingle(elementRef.current, '.p-virtualscroller-content');
};
var isPageChanged = function isPageChanged(first) {
return props.step ? pageState !== getPageByFirst(first) : true;
};
var scrollTo = function scrollTo(options) {
lastScrollPos.current = both ? {
top: 0,
left: 0
} : 0;
elementRef.current && elementRef.current.scrollTo(options);
};
var scrollToIndex = function scrollToIndex(index) {
var behavior = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'auto';
var _calculateNumItems = calculateNumItems(),
numToleratedItems = _calculateNumItems.numToleratedItems;
var contentPos = 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 scrollToItem = function scrollToItem() {
var left = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
var top = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
return scrollTo({
left: left,
top: top,
behavior: behavior
});
};
var newFirst = both ? {
rows: 0,
cols: 0
} : 0;
var isRangeChanged = false;
if (both) {
newFirst = {
rows: calculateFirst(index[0], numToleratedItems[0]),
cols: calculateFirst(index[1], numToleratedItems[1])
};
scrollToItem(calculateCoord(newFirst.cols, props.itemSize[1], contentPos.left), calculateCoord(newFirst.rows, props.itemSize[0], contentPos.top));
isRangeChanged = firstState.rows !== newFirst.rows || firstState.cols !== newFirst.cols;
} else {
newFirst = calculateFirst(index, numToleratedItems);
horizontal ? scrollToItem(calculateCoord(newFirst, props.itemSize, contentPos.left), 0) : scrollToItem(0, calculateCoord(newFirst, props.itemSize, contentPos.top));
isRangeChanged = firstState !== newFirst;
}
isItemRangeChanged.current = isRangeChanged;
setFirstState(newFirst);
};
var scrollInView = function scrollInView(index, to) {
var behavior = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'auto';
if (to) {
var _getRenderedRange = getRenderedRange(),
first = _getRenderedRange.first,
viewport = _getRenderedRange.viewport;
var scrollToItem = function scrollToItem() {
var left = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
var top = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
return scrollTo({
left: left,
top: top,
behavior: behavior
});
};
var isToStart = to === 'to-start';
var isToEnd = to === 'to-end';
if (isToStart) {
if (both) {
if (viewport.first.rows - first.rows > index[0]) {
scrollToItem(viewport.first.cols * props.itemSize[1], (viewport.first.rows - 1) * props.itemSize[0]);
} else if (viewport.first.cols - first.cols > index[1]) {
scrollToItem((viewport.first.cols - 1) * props.itemSize[1], viewport.first.rows * props.itemSize[0]);
}
} else {
if (viewport.first - first > index) {
var pos = (viewport.first - 1) * props.itemSize;
horizontal ? scrollToItem(pos, 0) : scrollToItem(0, pos);
}
}
} else if (isToEnd) {
if (both) {
if (viewport.last.rows - first.rows <= index[0] + 1) {
scrollToItem(viewport.first.cols * props.itemSize[1], (viewport.first.rows + 1) * props.itemSize[0]);
} else if (viewport.last.cols - first.cols <= index[1] + 1) {
scrollToItem((viewport.first.cols + 1) * props.itemSize[1], viewport.first.rows * props.itemSize[0]);
}
} else {
if (viewport.last - first <= index + 1) {
var _pos2 = (viewport.first + 1) * props.itemSize;
horizontal ? scrollToItem(_pos2, 0) : scrollToItem(0, _pos2);
}
}
}
} else {
scrollToIndex(index, behavior);
}
};
var getRows = function getRows() {
return loadingState ? props.loaderDisabled ? loaderArrState : [] : loadedItems();
};
var getColumns = function getColumns() {
if (props.columns && both || horizontal) {
return loadingState && props.loaderDisabled ? both ? loaderArrState[0] : loaderArrState : props.columns.slice(both ? firstState.cols : firstState, both ? lastState.cols : lastState);
}
return props.columns;
};
var getRenderedRange = function getRenderedRange() {
var calculateFirstInViewport = function calculateFirstInViewport(_pos, _size) {
return Math.floor(_pos / (_size || _pos));
};
var firstInViewport = firstState;
var lastInViewport = 0;
if (elementRef.current) {
var _elementRef$current = elementRef.current,
scrollTop = _elementRef$current.scrollTop,
scrollLeft = _elementRef$current.scrollLeft;
if (both) {
firstInViewport = {
rows: calculateFirstInViewport(scrollTop, props.itemSize[0]),
cols: calculateFirstInViewport(scrollLeft, props.itemSize[1])
};
lastInViewport = {
rows: firstInViewport.rows + numItemsInViewportState.rows,
cols: firstInViewport.cols + numItemsInViewportState.cols
};
} else {
var scrollPos = horizontal ? scrollLeft : scrollTop;
firstInViewport = calculateFirstInViewport(scrollPos, props.itemSize);
lastInViewport = firstInViewport + numItemsInViewportState;
}
}
return {
first: firstState,
last: lastState,
viewport: {
first: firstInViewport,
last: lastInViewport
}
};
};
var calculateNumItems = function calculateNumItems() {
var contentPos = getContentPosition();
var contentWidth = elementRef.current ? elementRef.current.offsetWidth - contentPos.left : 0;
var contentHeight = elementRef.current ? elementRef.current.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 = both ? {
rows: calculateNumItemsInViewport(contentHeight, props.itemSize[0]),
cols: calculateNumItemsInViewport(contentWidth, props.itemSize[1])
} : calculateNumItemsInViewport(horizontal ? contentWidth : contentHeight, props.itemSize);
var numToleratedItems = numToleratedItemsState || (both ? [calculateNumToleratedItems(numItemsInViewport.rows), calculateNumToleratedItems(numItemsInViewport.cols)] : calculateNumToleratedItems(numItemsInViewport));
return {
numItemsInViewport: numItemsInViewport,
numToleratedItems: numToleratedItems
};
};
var calculateOptions = function calculateOptions() {
var _calculateNumItems2 = calculateNumItems(),
numItemsInViewport = _calculateNumItems2.numItemsInViewport,
numToleratedItems = _calculateNumItems2.numToleratedItems;
var calculateLast = function calculateLast(_first, _num, _numT) {
var _isCols = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false;
return getLast(_first + _num + (_first < _numT ? 2 : 3) * _numT, _isCols);
};
var last = both ? {
rows: calculateLast(firstState.rows, numItemsInViewport.rows, numToleratedItems[0]),
cols: calculateLast(firstState.cols, numItemsInViewport.cols, numToleratedItems[1], true)
} : calculateLast(firstState, numItemsInViewport, numToleratedItems);
setNumItemsInViewportState(numItemsInViewport);
setNumToleratedItemsState(numToleratedItems);
setLastState(last);
if (props.showLoader) {
setLoaderArrState(both ? Array.from({
length: numItemsInViewport.rows
}).map(function () {
return Array.from({
length: numItemsInViewport.cols
});
}) : Array.from({
length: numItemsInViewport
}));
}
if (props.lazy) {
Promise.resolve().then(function () {
lazyLoadState.current = {
first: props.step ? both ? {
rows: 0,
cols: firstState.cols
} : 0 : firstState,
last: Math.min(props.step ? props.step : last, props.items.length)
};
props.onLazyLoad && props.onLazyLoad(lazyLoadState.current);
});
}
};
var calculateAutoSize = function calculateAutoSize(loading) {
if (props.autoSize && !loading) {
Promise.resolve().then(function () {
if (_contentRef.current) {
_contentRef.current.style.minHeight = _contentRef.current.style.minWidth = 'auto';
_contentRef.current.style.position = 'relative';
elementRef.current.style.contain = 'none';
/*const [contentWidth, contentHeight] = [DomHandler.getWidth(contentRef.current), DomHandler.getHeight(contentRef.current)];
contentWidth !== defaultContentWidth.current && (elementRef.current.style.width = '');
contentHeight !== defaultContentHeight.current && (elementRef.current.style.height = '');*/
var _ref = [DomHandler.getWidth(elementRef.current), DomHandler.getHeight(elementRef.current)],
width = _ref[0],
height = _ref[1];
(both || horizontal) && (elementRef.current.style.width = (width < defaultWidth.current ? width : props.scrollWidth || defaultWidth.current) + 'px');
(both || vertical) && (elementRef.current.style.height = (height < defaultHeight.current ? height : props.scrollHeight || defaultHeight.current) + 'px');
_contentRef.current.style.minHeight = _contentRef.current.style.minWidth = '';
_contentRef.current.style.position = '';
elementRef.current.style.contain = '';
}
});
}
};
var getLast = function getLast() {
var last = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
var isCols = arguments.length > 1 ? arguments[1] : undefined;
return props.items ? Math.min(isCols ? (props.columns || props.items[0]).length : props.items.length, last) : 0;
};
var getContentPosition = function getContentPosition() {
if (_contentRef.current) {
var style = getComputedStyle(_contentRef.current);
var left = parseFloat(style.paddingLeft) + Math.max(parseFloat(style.left) || 0, 0);
var right = parseFloat(style.paddingRight) + Math.max(parseFloat(style.right) || 0, 0);
var top = parseFloat(style.paddingTop) + Math.max(parseFloat(style.top) || 0, 0);
var bottom = parseFloat(style.paddingBottom) + Math.max(parseFloat(style.bottom) || 0, 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
};
};
var setSize = function setSize() {
if (elementRef.current) {
var parentElement = elementRef.current.parentElement;
var width = props.scrollWidth || "".concat(elementRef.current.offsetWidth || parentElement.offsetWidth, "px");
var height = props.scrollHeight || "".concat(elementRef.current.offsetHeight || parentElement.offsetHeight, "px");
var setProp = function setProp(_name, _value) {
return elementRef.current.style[_name] = _value;
};
if (both || horizontal) {
setProp('height', height);
setProp('width', width);
} else {
setProp('height', height);
}
}
};
var setSpacerSize = function setSpacerSize() {
var items = props.items;
if (items) {
var contentPos = getContentPosition();
var setProp = function setProp(_name, _value, _size) {
var _cpos = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 0;
return spacerStyle.current = _objectSpread$v(_objectSpread$v({}, spacerStyle.current), _defineProperty({}, "".concat(_name), (_value || []).length * _size + _cpos + 'px'));
};
if (both) {
setProp('height', items, props.itemSize[0], contentPos.y);
setProp('width', props.columns || items[1], props.itemSize[1], contentPos.x);
} else {
horizontal ? setProp('width', props.columns || items, props.itemSize, contentPos.x) : setProp('height', items, props.itemSize, contentPos.y);
}
}
};
var setContentPosition = function setContentPosition(pos) {
if (_contentRef.current && !props.appendOnly) {
var first = pos ? pos.first : firstState;
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;
_stickyRef.current && (_stickyRef.current.style.top = "-".concat(_y, "px"));
contentStyle.current = _objectSpread$v(_objectSpread$v({}, contentStyle.current), {
transform: "translate3d(".concat(_x, "px, ").concat(_y, "px, 0)")
});
};
if (both) {
setTransform(calculateTranslateVal(first.cols, props.itemSize[1]), calculateTranslateVal(first.rows, props.itemSize[0]));
} else {
var translateVal = calculateTranslateVal(first, props.itemSize);
horizontal ? setTransform(translateVal, 0) : setTransform(0, translateVal);
}
}
};
var onScrollPositionChange = function onScrollPositionChange(event) {
var target = event.target;
var contentPos = 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 getLast(lastValue, _isCols);
};
var scrollTop = calculateScrollPos(target.scrollTop, contentPos.top);
var scrollLeft = calculateScrollPos(target.scrollLeft, contentPos.left);
var newFirst = both ? {
rows: 0,
cols: 0
} : 0;
var newLast = lastState;
var isRangeChanged = false;
var newScrollPos = lastScrollPos.current;
if (both) {
var isScrollDown = lastScrollPos.current.top <= scrollTop;
var isScrollRight = lastScrollPos.current.left <= scrollLeft;
if (!props.appendOnly || props.appendOnly && (isScrollDown || isScrollRight)) {
var currentIndex = {
rows: calculateCurrentIndex(scrollTop, props.itemSize[0]),
cols: calculateCurrentIndex(scrollLeft, props.itemSize[1])
};
var triggerIndex = {
rows: calculateTriggerIndex(currentIndex.rows, firstState.rows, lastState.rows, numItemsInViewportState.rows, numToleratedItemsState[0], isScrollDown),
cols: calculateTriggerIndex(currentIndex.cols, firstState.cols, lastState.cols, numItemsInViewportState.cols, numToleratedItemsState[1], isScrollRight)
};
newFirst = {
rows: calculateFirst(currentIndex.rows, triggerIndex.rows, firstState.rows, lastState.rows, numItemsInViewportState.rows, numToleratedItemsState[0], isScrollDown),
cols: calculateFirst(currentIndex.cols, triggerIndex.cols, firstState.cols, lastState.cols, numItemsInViewportState.cols, numToleratedItemsState[1], isScrollRight)
};
newLast = {
rows: calculateLast(currentIndex.rows, newFirst.rows, lastState.rows, numItemsInViewportState.rows, numToleratedItemsState[0]),
cols: calculateLast(currentIndex.cols, newFirst.cols, lastState.cols, numItemsInViewportState.cols, numToleratedItemsState[1], true)
};
isRangeChanged = newFirst.rows !== firstState.rows || newLast.rows !== lastState.rows || newFirst.cols !== firstState.cols || newLast.cols !== lastState.cols || isItemRangeChanged.current;
newScrollPos = {
top: scrollTop,
left: scrollLeft
};
}
} else {
var scrollPos = horizontal ? scrollLeft : scrollTop;
var isScrollDownOrRight = lastScrollPos.current <= scrollPos;
if (!props.appendOnly || props.appendOnly && isScrollDownOrRight) {
var _currentIndex2 = calculateCurrentIndex(scrollPos, props.itemSize);
var _triggerIndex2 = calculateTriggerIndex(_currentIndex2, firstState, lastState, numItemsInViewportState, numToleratedItemsState, isScrollDownOrRight);
newFirst = calculateFirst(_currentIndex2, _triggerIndex2, firstState, lastState, numItemsInViewportState, numToleratedItemsState, isScrollDownOrRight);
newLast = calculateLast(_currentIndex2, newFirst, lastState, numItemsInViewportState, numToleratedItemsState);
isRangeChanged = newFirst !== firstState || newLast !== lastState || isItemRangeChanged.current;
newScrollPos = scrollPos;
}
}
return {
first: newFirst,
last: newLast,
isRangeChanged: isRangeChanged,
scrollPos: newScrollPos
};
};
var onScrollChange = function onScrollChange(event) {
var _onScrollPositionChan = onScrollPositionChange(event),
first = _onScrollPositionChan.first,
last = _onScrollPositionChan.last,
isRangeChanged = _onScrollPositionChan.isRangeChanged,
scrollPos = _onScrollPositionChan.scrollPos;
if (isRangeChanged) {
var newState = {
first: first,
last: last
};
setContentPosition(newState);
setFirstState(first);
setLastState(last);
lastScrollPos.current = scrollPos;
props.onScrollIndexChange && props.onScrollIndexChange(newState);
if (props.lazy && isPageChanged(first)) {
var newLazyLoadState = {
first: props.step ? Math.min(getPageByFirst(first) * props.step, props.items.length - props.step) : first,
last: Math.min(props.step ? (getPageByFirst(first) + 1) * props.step : last, props.items.length)
};
var isLazyStateChanged = !lazyLoadState.current || lazyLoadState.current.first !== newLazyLoadState.first || lazyLoadState.current.last !== newLazyLoadState.last;
isLazyStateChanged && props.onLazyLoad && props.onLazyLoad(newLazyLoadState);
lazyLoadState.current = newLazyLoadState;
}
}
};
var onScroll = function onScroll(event) {
props.onScroll && props.onScroll(event);
if (props.delay) {
if (scrollTimeout.current) {
clearTimeout(scrollTimeout.current);
}
if (isPageChanged(firstState)) {
if (!loadingState && props.showLoader) {
var _onScrollPositionChan2 = onScrollPositionChange(event),
isRangeChanged = _onScrollPositionChan2.isRangeChanged;
var changed = isRangeChanged || (props.step ? isPageChanged(firstState) : false);
changed && setLoadingState(true);
}
scrollTimeout.current = setTimeout(function () {
onScrollChange(event);
if (loadingState && props.showLoader && (!props.lazy || props.loading === undefined)) {
setLoadingState(false);
setPageState(getPageByFirst(firstState));
}
}, props.delay);
}
} else {
onScrollChange(event);
}
};
var onResize = function onResize() {
if (resizeTimeout.current) {
clearTimeout(resizeTimeout.current);
}
resizeTimeout.current = setTimeout(function () {
if (elementRef.current) {
var _ref2 = [DomHandler.getWidth(elementRef.current), DomHandler.getHeight(elementRef.current)],
width = _ref2[0],
height = _ref2[1];
var isDiffWidth = width !== defaultWidth.current,
isDiffHeight = height !== defaultHeight.current;
var reinit = both ? isDiffWidth || isDiffHeight : horizontal ? isDiffWidth : vertical ? isDiffHeight : false;
if (reinit) {
setNumToleratedItemsState(props.numToleratedItems);
defaultWidth.current = width;
defaultHeight.current = height;
defaultContentWidth.current = DomHandler.getWidth(_contentRef.current);
defaultContentHeight.current = DomHandler.getHeight(_contentRef.current);
}
}
}, props.resizeDelay);
};
var getOptions = function getOptions(renderedIndex) {
var count = (props.items || []).length;
var index = both ? firstState.rows + renderedIndex : firstState + renderedIndex;
return {
index: index,
count: count,
first: index === 0,
last: index === count - 1,
even: index % 2 === 0,
odd: index % 2 !== 0,
props: props
};
};
var loaderOptions = function loaderOptions(index, extOptions) {
var count = loaderArrState.length;
return _objectSpread$v({
index: index,
count: count,
first: index === 0,
last: index === count - 1,
even: index % 2 === 0,
odd: index % 2 !== 0,
props: props
}, extOptions);
};
var loadedItems = function loadedItems() {
var items = props.items;
if (items && !loadingState) {
if (both) return items.slice(props.appendOnly ? 0 : firstState.rows, lastState.rows).map(function (item) {
return props.columns ? item : item.slice(props.appendOnly ? 0 : firstState.cols, lastState.cols);
});else if (horizontal && props.columns) return items;else return items.slice(props.appendOnly ? 0 : firstState, lastState);
}
return [];
};
var viewInit = function viewInit() {
if (elementRef.current && DomHandler.isVisible(elementRef.current)) {
setContentElement(_contentRef.current);
init();
bindWindowResizeListener();
bindOrientationChangeListener();
defaultWidth.current = DomHandler.getWidth(elementRef.current);
defaultHeight.current = DomHandler.getHeight(elementRef.current);
defaultContentWidth.current = DomHandler.getWidth(_contentRef.current);
defaultContentHeight.current = DomHandler.getHeight(_contentRef.current);
}
};
var init = function init() {
if (!props.disabled) {
setSize();
calculateOptions();
setSpacerSize();
}
};
useMountEffect(function () {
viewInit();
});
useUpdateEffect(function () {
init();
}, [props.itemSize, props.scrollHeight, props.scrollWidth]);
useUpdateEffect(function () {
if (props.numToleratedItems !== numToleratedItemsState) {
setNumToleratedItemsState(props.numToleratedItems);
}
}, [props.numToleratedItems]);
useUpdateEffect(function () {
if (props.numToleratedItems === numToleratedItemsState) {
init(); // reinit after resizing
}
}, [numToleratedItemsState]);
useUpdateEffect(function () {
if (!prevProps.items || prevProps.items.length !== (props.items || []).length) {
init();
}
var loading = loadingState;
if (props.lazy && prevProps.loading !== props.loading && props.loading !== loadingState) {
setLoadingState(props.loading);
loading = props.loading;
}
calculateAutoSize(loading);
});
useUpdateEffect(function () {
lastScrollPos.current = both ? {
top: 0,
left: 0
} : 0;
}, [props.orientation]);
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
getElementRef: getElementRef,
scrollTo: scrollTo,
scrollToIndex: scrollToIndex,
scrollInView: scrollInView,
getRenderedRange: getRenderedRange
};
});
var createLoaderItem = function createLoaderItem(index) {
var extOptions = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
var options = loaderOptions(index, extOptions);
var content = ObjectUtils.getJSXElement(props.loadingTemplate, options);
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, {
key: index
}, content);
};
var createLoader = function createLoader() {
if (!props.loaderDisabled && props.showLoader && loadingState) {
var className = classNames('p-virtualscroller-loader', {
'p-component-overlay': !props.loadingTemplate
});
var content = /*#__PURE__*/React__namespace.createElement("i", {
className: "p-virtualscroller-loading-icon pi pi-spinner pi-spin"
});
if (props.loadingTemplate) {
content = loaderArrState.map(function (_, index) {
return createLoaderItem(index, both && {
numCols: numItemsInViewportState.cols
});
});
} else if (props.loaderIconTemplate) {
var defaultContentOptions = {
className: 'p-virtualscroller-loading-icon',
element: content,
props: props
};
content = ObjectUtils.getJSXElement(props.loaderIconTemplate, defaultContentOptions);
}
return /*#__PURE__*/React__namespace.createElement("div", {
className: className
}, content);
}
return null;
};
var createSpacer = function createSpacer() {
if (props.showSpacer) {
return /*#__PURE__*/React__namespace.createElement("div", {
ref: _spacerRef,
style: spacerStyle.current,
className: "p-virtualscroller-spacer"
});
}
return null;
};
var createItem = function createItem(item, index) {
var options = getOptions(index);
var content = ObjectUtils.getJSXElement(props.itemTemplate, item, options);
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, {
key: options.index
}, content);
};
var createItems = function createItems() {
var items = loadedItems();
return items.map(createItem);
};
var createContent = function createContent() {
var items = createItems();
var className = classNames('p-virtualscroller-content', {
'p-virtualscroller-loading': loadingState
});
var content = /*#__PURE__*/React__namespace.createElement("div", {
ref: _contentRef,
style: contentStyle.current,
className: className
}, items);
if (props.contentTemplate) {
var defaultOptions = {
style: contentStyle.current,
className: className,
spacerStyle: spacerStyle.current,
contentRef: function contentRef(el) {
return _contentRef.current = ObjectUtils.getRefElement(el);
},
spacerRef: function spacerRef(el) {
return _spacerRef.current = ObjectUtils.getRefElement(el);
},
stickyRef: function stickyRef(el) {
return _stickyRef.current = ObjectUtils.getRefElement(el);
},
items: loadedItems(),
getItemOptions: function getItemOptions(index) {
return getOptions(index);
},
children: items,
element: content,
props: props,
loading: loadingState,
getLoaderOptions: function getLoaderOptions(index, ext) {
return loaderOptions(index, ext);
},
loadingTemplate: props.loadingTemplate,
itemSize: props.itemSize,
rows: getRows(),
columns: getColumns(),
vertical: vertical,
horizontal: horizontal,
both: both
};
return ObjectUtils.getJSXElement(props.contentTemplate, defaultOptions);
}
return content;
};
if (props.disabled) {
var content = ObjectUtils.getJSXElement(props.contentTemplate, {
items: props.items,
rows: props.items,
columns: props.columns
});
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, props.children, content);
} else {
var otherProps = VirtualScrollerBase.getOtherProps(props);
var className = classNames('p-virtualscroller', {
'p-virtualscroller-inline': props.inline,
'p-virtualscroller-both p-both-scroll': both,
'p-virtualscroller-horizontal p-horizontal-scroll': horizontal
}, props.className);
var loader = createLoader();
var _content = createContent();
var spacer = createSpacer();
return /*#__PURE__*/React__namespace.createElement("div", _extends({
ref: elementRef,
className: className,
tabIndex: props.tabIndex,
style: props.style
}, otherProps, {
onScroll: onScroll
}), _content, spacer, loader);
}
}));
VirtualScroller.displayName = 'VirtualScroller';
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 AutoCompletePanel = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (props, ref) {
var getOptionGroupRenderKey = function getOptionGroupRenderKey(optionGroup) {
return ObjectUtils.resolveFieldData(optionGroup, props.optionGroupLabel);
};
var createGroupChildren = function createGroupChildren(optionGroup, i, style) {
var groupChildren = props.getOptionGroupChildren(optionGroup);
return groupChildren.map(function (item, j) {
var key = i + '_' + j;
var selected = props.selectedItem === item;
var content = props.itemTemplate ? ObjectUtils.getJSXElement(props.itemTemplate, item, j) : props.field ? ObjectUtils.resolveFieldData(item, props.field) : item;
var className = classNames('p-autocomplete-item', {
'p-disabled': item.disabled
});
return /*#__PURE__*/React__namespace.createElement("li", {
key: key,
role: "option",
"aria-selected": selected,
className: className,
style: style,
onClick: function onClick(e) {
return props.onItemClick(e, item);
},
"data-group": i,
"data-index": j
}, content, /*#__PURE__*/React__namespace.createElement(Ripple, null));
});
};
var createItem = function createItem(suggestion, index) {
var scrollerOptions = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
var style = {
height: scrollerOptions.props ? scrollerOptions.props.itemSize : undefined
};
if (props.optionGroupLabel) {
var content = props.optionGroupTemplate ? ObjectUtils.getJSXElement(props.optionGroupTemplate, suggestion, index) : props.getOptionGroupLabel(suggestion);
var childrenContent = createGroupChildren(suggestion, index, style);
var key = index + '_' + getOptionGroupRenderKey(suggestion);
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, {
key: key
}, /*#__PURE__*/React__namespace.createElement("li", {
className: "p-autocomplete-item-group",
style: style
}, content), childrenContent);
} else {
var _content = props.itemTemplate ? ObjectUtils.getJSXElement(props.itemTemplate, suggestion, index) : props.field ? ObjectUtils.resolveFieldData(suggestion, props.field) : suggestion;
var className = classNames('p-autocomplete-item', {
'p-disabled': suggestion.disabled
});
return /*#__PURE__*/React__namespace.createElement("li", {
key: index,
role: "option",
"aria-selected": props.selectedItem === suggestion,
className: className,
style: style,
onClick: function onClick(e) {
return props.onItemClick(e, suggestion);
}
}, _content, /*#__PURE__*/React__namespace.createElement(Ripple, null));
}
};
var createItems = function createItems() {
return props.suggestions ? props.suggestions.map(createItem) : null;
};
var createContent = function createContent() {
if (props.showEmptyMessage && ObjectUtils.isEmpty(props.suggestions)) {
var emptyMessage = props.emptyMessage || localeOption('emptyMessage');
return /*#__PURE__*/React__namespace.createElement("ul", {
className: "p-autocomplete-items"
}, /*#__PURE__*/React__namespace.createElement("li", {
className: "p-autocomplete-item"
}, emptyMessage));
}
if (props.virtualScrollerOptions) {
var virtualScrollerProps = _objectSpread$u(_objectSpread$u({}, props.virtualScrollerOptions), {
style: _objectSpread$u(_objectSpread$u({}, props.virtualScrollerOptions.style), {
height: props.scrollHeight
}),
autoSize: true,
items: props.suggestions,
itemTemplate: function itemTemplate(item, options) {
return item && createItem(item, options.index, options);
},
contentTemplate: function contentTemplate(options) {
var className = classNames('p-autocomplete-items', options.className);
return /*#__PURE__*/React__namespace.createElement("ul", {
ref: options.contentRef,
style: options.style,
className: className,
role: "listbox",
id: props.listId
}, options.children);
}
});
return /*#__PURE__*/React__namespace.createElement(VirtualScroller, _extends({
ref: props.virtualScrollerRef
}, virtualScrollerProps));
} else {
var items = createItems();
return /*#__PURE__*/React__namespace.createElement("ul", {
className: "p-autocomplete-items",
role: "listbox",
id: props.listId
}, items);
}
};
var createElement = function createElement() {
var className = classNames('p-autocomplete-panel p-component', props.panelClassName, {
'p-input-filled': PrimeReact.inputStyle === 'filled',
'p-ripple-disabled': PrimeReact.ripple === false
});
var style = _objectSpread$u({
maxHeight: props.scrollHeight
}, props.panelStyle || {});
var content = createContent();
return /*#__PURE__*/React__namespace.createElement(CSSTransition, {
nodeRef: ref,
classNames: "p-connected-overlay",
"in": props["in"],
timeout: {
enter: 120,
exit: 100
},
options: props.transitionOptions,
unmountOnExit: true,
onEnter: props.onEnter,
onEntering: props.onEntering,
onEntered: props.onEntered,
onExit: props.onExit,
onExited: props.onExited
}, /*#__PURE__*/React__namespace.createElement("div", {
ref: ref,
className: className,
style: style,
onClick: props.onClick
}, content));
};
var element = createElement();
return /*#__PURE__*/React__namespace.createElement(Portal, {
element: element,
appendTo: props.appendTo
});
}));
AutoCompletePanel.displayName = 'AutoCompletePanel';
var AutoComplete = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = AutoCompleteBase.getProps(inProps);
var _React$useState = React__namespace.useState(props.id),
_React$useState2 = _slicedToArray(_React$useState, 2),
idState = _React$useState2[0],
setIdState = _React$useState2[1];
var _React$useState3 = React__namespace.useState(false),
_React$useState4 = _slicedToArray(_React$useState3, 2),
searchingState = _React$useState4[0],
setSearchingState = _React$useState4[1];
var _React$useState5 = React__namespace.useState(false),
_React$useState6 = _slicedToArray(_React$useState5, 2),
focusedState = _React$useState6[0],
setFocusedState = _React$useState6[1];
var _React$useState7 = React__namespace.useState(false),
_React$useState8 = _slicedToArray(_React$useState7, 2),
overlayVisibleState = _React$useState8[0],
setOverlayVisibleState = _React$useState8[1];
var elementRef = React__namespace.useRef(null);
var overlayRef = React__namespace.useRef(null);
var inputRef = React__namespace.useRef(props.inputRef);
var multiContainerRef = React__namespace.useRef(null);
var virtualScrollerRef = React__namespace.useRef(null);
var timeout = React__namespace.useRef(null);
var selectedItem = React__namespace.useRef(null);
var _useOverlayListener = useOverlayListener({
target: elementRef,
overlay: overlayRef,
listener: function listener(event, _ref) {
var type = _ref.type,
valid = _ref.valid;
if (valid) {
type === 'outside' ? !isInputClicked(event) && hide() : hide();
}
},
when: overlayVisibleState
}),
_useOverlayListener2 = _slicedToArray(_useOverlayListener, 2),
bindOverlayListener = _useOverlayListener2[0],
unbindOverlayListener = _useOverlayListener2[1];
var isInputClicked = function isInputClicked(event) {
return props.multiple ? event.target === multiContainerRef.current || multiContainerRef.current.contains(event.target) : event.target === inputRef.current;
};
var onInputChange = function onInputChange(event) {
//Cancel the search request if user types within the timeout
if (timeout.current) {
clearTimeout(timeout.current);
}
var query = event.target.value;
if (!props.multiple) {
updateModel(event, query);
}
if (ObjectUtils.isEmpty(query)) {
hide();
props.onClear && props.onClear(event);
} else {
if (query.length >= props.minLength) {
timeout.current = setTimeout(function () {
search(event, query, 'input');
}, props.delay);
} else {
hide();
}
}
};
var search = 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 (props.completeMethod) {
setSearchingState(true);
props.completeMethod({
originalEvent: event,
query: query
});
}
};
var selectItem = function selectItem(event, option, preventInputFocus) {
if (props.multiple) {
inputRef.current.value = '';
if (!isSelected(option)) {
// allows empty value/selectionlimit and within sectionlimit
if (!props.value || !props.selectionLimit || props.value.length < props.selectionLimit) {
var newValue = props.value ? [].concat(_toConsumableArray(props.value), [option]) : [option];
updateModel(event, newValue);
}
}
} else {
updateInputField(option);
updateModel(event, option);
}
if (props.onSelect) {
props.onSelect({
originalEvent: event,
value: option
});
}
if (!preventInputFocus) {
DomHandler.focus(inputRef.current);
hide();
}
};
var updateModel = function updateModel(event, value) {
// #2176 only call change if value actually changed
if (selectedItem && ObjectUtils.deepEquals(selectedItem.current, value)) {
return;
}
if (props.onChange) {
props.onChange({
originalEvent: event,
value: value,
stopPropagation: function stopPropagation() {},
preventDefault: function preventDefault() {},
target: {
name: props.name,
id: idState,
value: value
}
});
}
selectedItem.current = value;
};
var formatValue = function formatValue(value) {
if (value) {
if (typeof value === 'string') {
return value;
} else if (props.selectedItemTemplate) {
var resolvedFieldData = ObjectUtils.getJSXElement(props.selectedItemTemplate, value);
return resolvedFieldData ? resolvedFieldData : value;
} else if (props.field) {
var _resolvedFieldData = ObjectUtils.resolveFieldData(value, props.field);
return _resolvedFieldData !== null && _resolvedFieldData !== undefined ? _resolvedFieldData : value;
} else {
return value;
}
}
return '';
};
var updateInputField = function updateInputField(value) {
inputRef.current.value = formatValue(value);
};
var show = function show() {
setOverlayVisibleState(true);
};
var hide = function hide() {
setOverlayVisibleState(false);
setSearchingState(false);
};
var onOverlayEnter = function onOverlayEnter() {
ZIndexUtils.set('overlay', overlayRef.current, PrimeReact.autoZIndex, PrimeReact.zIndex['overlay']);
alignOverlay();
};
var onOverlayEntering = function onOverlayEntering() {
if (props.autoHighlight && props.suggestions && props.suggestions.length) {
var element = getScrollableElement().firstChild.firstChild;
DomHandler.addClass(element, 'p-highlight');
}
};
var onOverlayEntered = function onOverlayEntered() {
bindOverlayListener();
props.onShow && props.onShow();
};
var onOverlayExit = function onOverlayExit() {
unbindOverlayListener();
};
var onOverlayExited = function onOverlayExited() {
ZIndexUtils.clear(overlayRef.current);
props.onHide && props.onHide();
};
var alignOverlay = function alignOverlay() {
var target = props.multiple ? multiContainerRef.current : inputRef.current;
DomHandler.alignOverlay(overlayRef.current, target, props.appendTo || PrimeReact.appendTo);
};
var onPanelClick = function onPanelClick(event) {
OverlayService.emit('overlay-click', {
originalEvent: event,
target: elementRef.current
});
};
var onDropdownClick = function onDropdownClick(event) {
if (props.dropdownAutoFocus) {
DomHandler.focus(inputRef.current, props.dropdownAutoFocus);
}
if (props.dropdownMode === 'blank') search(event, '', 'dropdown');else if (props.dropdownMode === 'current') search(event, inputRef.current.value, 'dropdown');
if (props.onDropdownClick) {
props.onDropdownClick({
originalEvent: event,
query: inputRef.current.value
});
}
};
var removeItem = function removeItem(event, index) {
var removedValue = props.value[index];
var newValue = props.value.filter(function (_, i) {
return index !== i;
});
updateModel(event, newValue);
if (props.onUnselect) {
props.onUnselect({
originalEvent: event,
value: removedValue
});
}
};
var onInputKeyDown = function onInputKeyDown(event) {
if (overlayVisibleState) {
var highlightItem = DomHandler.findSingle(overlayRef.current, 'li.p-highlight');
switch (event.which) {
//down
case 40:
if (highlightItem) {
var nextElement = findNextItem(highlightItem);
if (nextElement) {
DomHandler.addClass(nextElement, 'p-highlight');
DomHandler.removeClass(highlightItem, 'p-highlight');
DomHandler.scrollInView(getScrollableElement(), nextElement);
}
} else {
highlightItem = DomHandler.findSingle(overlayRef.current, 'li');
if (DomHandler.hasClass(highlightItem, 'p-autocomplete-item-group')) {
highlightItem = findNextItem(highlightItem);
}
if (highlightItem) {
DomHandler.addClass(highlightItem, 'p-highlight');
}
}
event.preventDefault();
break;
//up
case 38:
if (highlightItem) {
var previousElement = findPrevItem(highlightItem);
if (previousElement) {
DomHandler.addClass(previousElement, 'p-highlight');
DomHandler.removeClass(highlightItem, 'p-highlight');
DomHandler.scrollInView(getScrollableElement(), previousElement);
}
}
event.preventDefault();
break;
//enter
case 13:
if (highlightItem) {
selectHighlightItem(event, highlightItem);
hide();
event.preventDefault();
}
break;
//escape
case 27:
hide();
event.preventDefault();
break;
//tab
case 9:
if (highlightItem) {
selectHighlightItem(event, highlightItem);
}
hide();
break;
}
}
if (props.multiple) {
switch (event.which) {
//backspace
case 8:
if (props.value && props.value.length && !inputRef.current.value) {
var removedValue = props.value[props.value.length - 1];
var newValue = props.value.slice(0, -1);
updateModel(event, newValue);
if (props.onUnselect) {
props.onUnselect({
originalEvent: event,
value: removedValue
});
}
}
break;
}
}
};
var selectHighlightItem = function selectHighlightItem(event, item) {
if (props.optionGroupLabel) {
var optionGroup = props.suggestions[item.dataset.group];
selectItem(event, getOptionGroupChildren(optionGroup)[item.dataset.index]);
} else {
selectItem(event, props.suggestions[DomHandler.index(item)]);
}
};
var findNextItem = function findNextItem(item) {
var nextItem = item.nextElementSibling;
return nextItem ? DomHandler.hasClass(nextItem, 'p-autocomplete-item-group') ? findNextItem(nextItem) : nextItem : null;
};
var findPrevItem = function findPrevItem(item) {
var prevItem = item.previousElementSibling;
return prevItem ? DomHandler.hasClass(prevItem, 'p-autocomplete-item-group') ? findPrevItem(prevItem) : prevItem : null;
};
var onInputFocus = function onInputFocus(event) {
setFocusedState(true);
props.onFocus && props.onFocus(event);
};
var forceItemSelection = function forceItemSelection(event) {
var inputValue = event.target.value.trim();
var item = (props.suggestions || []).find(function (it) {
var value = props.field ? ObjectUtils.resolveFieldData(it, props.field) : it;
return value && inputValue === value.trim();
});
if (item) {
selectItem(event, item, true);
} else {
inputRef.current.value = '';
updateModel(event, null);
props.onClear && props.onClear(event);
}
};
var onInputBlur = function onInputBlur(event) {
setFocusedState(false);
if (props.forceSelection) {
forceItemSelection(event);
}
props.onBlur && props.onBlur(event);
};
var onMultiContainerClick = function onMultiContainerClick(event) {
DomHandler.focus(inputRef.current);
props.onClick && props.onClick(event);
};
var onMultiInputFocus = function onMultiInputFocus(event) {
onInputFocus(event);
DomHandler.addClass(multiContainerRef.current, 'p-focus');
};
var onMultiInputBlur = function onMultiInputBlur(event) {
onInputBlur(event);
DomHandler.removeClass(multiContainerRef.current, 'p-focus');
};
var isSelected = function isSelected(val) {
return props.value ? props.value.some(function (v) {
return ObjectUtils.equals(v, val);
}) : false;
};
var getScrollableElement = function getScrollableElement() {
return virtualScrollerRef.current ? overlayRef.current.firstChild : overlayRef.current;
};
var getOptionGroupLabel = function getOptionGroupLabel(optionGroup) {
return props.optionGroupLabel ? ObjectUtils.resolveFieldData(optionGroup, props.optionGroupLabel) : optionGroup;
};
var getOptionGroupChildren = function getOptionGroupChildren(optionGroup) {
return ObjectUtils.resolveFieldData(optionGroup, props.optionGroupChildren);
};
React__namespace.useEffect(function () {
ObjectUtils.combinedRefs(inputRef, props.inputRef);
}, [inputRef, props.inputRef]);
useMountEffect(function () {
if (!idState) {
setIdState(UniqueComponentId());
}
if (props.autoFocus) {
DomHandler.focus(inputRef.current, props.autoFocus);
}
});
useUpdateEffect(function () {
if (searchingState) {
ObjectUtils.isNotEmpty(props.suggestions) || props.showEmptyMessage ? show() : hide();
setSearchingState(false);
}
}, [props.suggestions]);
useUpdateEffect(function () {
if (inputRef.current && !props.multiple) {
updateInputField(props.value);
}
if (overlayVisibleState) {
alignOverlay();
}
});
useUnmountEffect(function () {
if (timeout.current) {
clearTimeout(timeout.current);
}
ZIndexUtils.clear(overlayRef.current);
});
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
search: search,
show: show,
hide: hide,
focus: function focus() {
return DomHandler.focus(inputRef.current);
},
getElement: function getElement() {
return elementRef.current;
},
getOverlay: function getOverlay() {
return overlayRef.current;
},
getInput: function getInput() {
return inputRef.current;
},
getVirtualScroller: function getVirtualScroller() {
return virtualScrollerRef.current;
}
};
});
var createSimpleAutoComplete = function createSimpleAutoComplete() {
var value = formatValue(props.value);
var ariaControls = overlayVisibleState ? idState + '_list' : null;
var className = classNames('p-autocomplete-input', props.inputClassName, {
'p-autocomplete-dd-input': props.dropdown
});
return /*#__PURE__*/React__namespace.createElement(InputText, _extends({
ref: inputRef,
id: props.inputId,
type: props.type,
name: props.name,
defaultValue: value,
role: "combobox",
"aria-autocomplete": "list",
"aria-controls": ariaControls,
"aria-haspopup": "listbox",
"aria-expanded": overlayVisibleState,
className: className,
style: props.inputStyle,
autoComplete: "off",
readOnly: props.readOnly,
disabled: props.disabled,
placeholder: props.placeholder,
size: props.size,
maxLength: props.maxLength,
tabIndex: props.tabIndex,
onBlur: onInputBlur,
onFocus: onInputFocus,
onChange: onInputChange,
onMouseDown: props.onMouseDown,
onKeyUp: props.onKeyUp,
onKeyDown: onInputKeyDown,
onKeyPress: props.onKeyPress,
onContextMenu: props.onContextMenu,
onClick: props.onClick,
onDoubleClick: props.onDblClick
}, ariaProps));
};
var createChips = function createChips() {
if (ObjectUtils.isNotEmpty(props.value)) {
return props.value.map(function (val, index) {
var key = index + 'multi-item';
return /*#__PURE__*/React__namespace.createElement("li", {
key: key,
className: "p-autocomplete-token p-highlight"
}, /*#__PURE__*/React__namespace.createElement("span", {
className: "p-autocomplete-token-label"
}, formatValue(val)), !props.disabled && IconUtils.getJSXIcon(props.removeIcon, {
className: 'p-autocomplete-token-icon',
onClick: function onClick(e) {
return removeItem(e, index);
}
}, {
props: props
}));
});
}
return null;
};
var createMultiInput = function createMultiInput() {
var ariaControls = overlayVisibleState ? idState + '_list' : null;
return /*#__PURE__*/React__namespace.createElement("li", {
className: "p-autocomplete-input-token"
}, /*#__PURE__*/React__namespace.createElement("input", _extends({
ref: inputRef,
type: props.type,
disabled: props.disabled,
placeholder: props.placeholder,
role: "combobox",
"aria-autocomplete": "list",
"aria-controls": ariaControls,
"aria-haspopup": "listbox",
"aria-expanded": overlayVisibleState,
autoComplete: "off",
readOnly: props.readOnly,
tabIndex: props.tabIndex,
onChange: onInputChange,
id: props.inputId,
name: props.name,
style: props.inputStyle,
className: props.inputClassName,
maxLength: props.maxLength,
onKeyUp: props.onKeyUp,
onKeyDown: onInputKeyDown,
onKeyPress: props.onKeyPress,
onFocus: onMultiInputFocus,
onBlur: onMultiInputBlur
}, ariaProps)));
};
var createMultipleAutoComplete = function createMultipleAutoComplete() {
var className = classNames('p-autocomplete-multiple-container p-component p-inputtext', {
'p-disabled': props.disabled
});
var tokens = createChips();
var input = createMultiInput();
return /*#__PURE__*/React__namespace.createElement("ul", {
ref: multiContainerRef,
className: className,
onContextMenu: props.onContextMenu,
onMouseDown: props.onMouseDown,
onClick: onMultiContainerClick,
onDoubleClick: props.onDblClick
}, tokens, input);
};
var createDropdown = function createDropdown() {
if (props.dropdown) {
var ariaLabel = props.dropdownAriaLabel || props.placeholder || localeOption('choose');
return /*#__PURE__*/React__namespace.createElement(Button, {
type: "button",
icon: props.dropdownIcon,
className: "p-autocomplete-dropdown",
disabled: props.disabled,
onClick: onDropdownClick,
"aria-label": ariaLabel
});
}
return null;
};
var createLoader = function createLoader() {
if (searchingState) {
return /*#__PURE__*/React__namespace.createElement("i", {
className: "p-autocomplete-loader pi pi-spinner pi-spin"
});
}
return null;
};
var createInput = function createInput() {
return props.multiple ? createMultipleAutoComplete() : createSimpleAutoComplete();
};
var listId = idState + '_list';
var hasTooltip = ObjectUtils.isNotEmpty(props.tooltip);
var otherProps = AutoCompleteBase.getOtherProps(props);
var ariaProps = ObjectUtils.reduceKeys(otherProps, DomHandler.ARIA_PROPS);
var className = classNames('p-autocomplete p-component p-inputwrapper', {
'p-autocomplete-dd': props.dropdown,
'p-autocomplete-multiple': props.multiple,
'p-inputwrapper-filled': props.value,
'p-inputwrapper-focus': focusedState
}, props.className);
var loader = createLoader();
var input = createInput();
var dropdown = createDropdown();
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement("span", _extends({
ref: elementRef,
id: idState,
style: props.style,
className: className
}, otherProps), input, loader, dropdown, /*#__PURE__*/React__namespace.createElement(AutoCompletePanel, _extends({
ref: overlayRef,
virtualScrollerRef: virtualScrollerRef
}, props, {
listId: listId,
onItemClick: selectItem,
selectedItem: selectedItem,
onClick: onPanelClick,
getOptionGroupLabel: getOptionGroupLabel,
getOptionGroupChildren: getOptionGroupChildren,
"in": overlayVisibleState,
onEnter: onOverlayEnter,
onEntering: onOverlayEntering,
onEntered: onOverlayEntered,
onExit: onOverlayExit,
onExited: onOverlayExited
}))), hasTooltip && /*#__PURE__*/React__namespace.createElement(Tooltip, _extends({
target: elementRef,
content: props.tooltip
}, props.tooltipOptions)));
}));
AutoComplete.displayName = 'AutoComplete';
var AvatarBase = {
defaultProps: {
__TYPE: 'Avatar',
className: null,
icon: null,
image: null,
imageAlt: 'avatar',
imageFallback: 'default',
label: null,
onImageError: null,
shape: 'square',
size: 'normal',
style: null,
template: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, AvatarBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, AvatarBase.defaultProps);
}
};
var Avatar = /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = AvatarBase.getProps(inProps);
var elementRef = React__namespace.useRef(null);
var _React$useState = React__namespace.useState(false),
_React$useState2 = _slicedToArray(_React$useState, 2),
imageFailed = _React$useState2[0],
setImageFailed = _React$useState2[1];
var createContent = function createContent() {
if (ObjectUtils.isNotEmpty(props.image) && !imageFailed) {
return /*#__PURE__*/React__namespace.createElement("img", {
src: props.image,
alt: props.imageAlt,
onError: onImageError
});
} else if (props.label) {
return /*#__PURE__*/React__namespace.createElement("span", {
className: "p-avatar-text"
}, props.label);
} else if (props.icon) {
return IconUtils.getJSXIcon(props.icon, {
className: 'p-avatar-icon'
}, {
props: props
});
}
return null;
};
var onImageError = function onImageError(event) {
if (props.imageFallback === 'default') {
if (!props.onImageError) {
// fallback to label or icon
setImageFailed(true);
event.target.src = null;
}
} else {
// try fallback as an image
event.target.src = props.imageFallback;
}
props.onImageError && props.onImageError(event);
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
getElement: function getElement() {
return elementRef.current;
}
};
});
var otherProps = AvatarBase.getOtherProps(props);
var containerClassName = classNames('p-avatar p-component', {
'p-avatar-image': ObjectUtils.isNotEmpty(props.image) && !imageFailed,
'p-avatar-circle': props.shape === 'circle',
'p-avatar-lg': props.size === 'large',
'p-avatar-xl': props.size === 'xlarge',
'p-avatar-clickable': !!props.onClick
}, props.className);
var content = props.template ? ObjectUtils.getJSXElement(props.template, props) : createContent();
return /*#__PURE__*/React__namespace.createElement("div", _extends({
ref: elementRef,
className: containerClassName,
style: props.style
}, otherProps), content, props.children);
});
Avatar.displayName = 'Avatar';
var AvatarGroupBase = {
defaultProps: {
__TYPE: 'AvatarGroup',
style: null,
className: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, AvatarGroupBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, AvatarGroupBase.defaultProps);
}
};
var AvatarGroup = /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = AvatarGroupBase.getProps(inProps);
var elementRef = React__namespace.useRef(null);
var otherProps = AvatarGroupBase.getOtherProps(props);
var className = classNames('p-avatar-group p-component', props.className);
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
getElement: function getElement() {
return elementRef.current;
}
};
});
return /*#__PURE__*/React__namespace.createElement("div", _extends({
ref: elementRef,
className: className,
style: props.style
}, otherProps), props.children);
});
AvatarGroup.displayName = 'AvatarGroup';
var BadgeBase = {
defaultProps: {
__TYPE: 'Badge',
value: null,
severity: null,
size: null,
style: null,
className: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, BadgeBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, BadgeBase.defaultProps);
}
};
var Badge = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = BadgeBase.getProps(inProps);
var elementRef = React__namespace.useRef(null);
var otherProps = BadgeBase.getOtherProps(props);
var className = classNames('p-badge p-component', _defineProperty({
'p-badge-no-gutter': ObjectUtils.isNotEmpty(props.value) && String(props.value).length === 1,
'p-badge-dot': ObjectUtils.isEmpty(props.value),
'p-badge-lg': props.size === 'large',
'p-badge-xl': props.size === 'xlarge'
}, "p-badge-".concat(props.severity), props.severity !== null), props.className);
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
getElement: function getElement() {
return elementRef.current;
}
};
});
return /*#__PURE__*/React__namespace.createElement("span", _extends({
ref: elementRef,
className: className,
style: props.style
}, otherProps), props.value);
}));
Badge.displayName = 'Badge';
var BlockUIBase = {
defaultProps: {
__TYPE: 'BlockUI',
autoZIndex: true,
baseZIndex: 0,
blocked: false,
className: null,
containerClassName: null,
containerStyle: null,
fullScreen: false,
id: null,
onBlocked: null,
onUnblocked: null,
style: null,
template: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, BlockUIBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, BlockUIBase.defaultProps);
}
};
var BlockUI = /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = BlockUIBase.getProps(inProps);
var _React$useState = React__namespace.useState(props.blocked),
_React$useState2 = _slicedToArray(_React$useState, 2),
visibleState = _React$useState2[0],
setVisibleState = _React$useState2[1];
var elementRef = React__namespace.useRef(null);
var maskRef = React__namespace.useRef(null);
var block = function block() {
setVisibleState(true);
};
var unblock = function unblock() {
var callback = function callback() {
setVisibleState(false);
props.fullScreen && DomHandler.removeClass(document.body, 'p-overflow-hidden');
props.onUnblocked && props.onUnblocked();
};
if (maskRef.current) {
DomHandler.addClass(maskRef.current, 'p-component-overlay-leave');
maskRef.current.addEventListener('animationend', function () {
ZIndexUtils.clear(maskRef.current);
callback();
});
} else {
callback();
}
};
var onPortalMounted = function onPortalMounted() {
if (props.fullScreen) {
DomHandler.addClass(document.body, 'p-overflow-hidden');
document.activeElement.blur();
}
if (props.autoZIndex) {
var key = props.fullScreen ? 'modal' : 'overlay';
ZIndexUtils.set(key, maskRef.current, PrimeReact.autoZIndex, props.baseZIndex || PrimeReact.zIndex[key]);
}
props.onBlocked && props.onBlocked();
};
useMountEffect(function () {
visibleState && block();
});
useUpdateEffect(function () {
props.blocked ? block() : unblock();
}, [props.blocked]);
useUnmountEffect(function () {
if (props.fullScreen) {
DomHandler.removeClass(document.body, 'p-overflow-hidden');
}
ZIndexUtils.clear(maskRef.current);
});
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
block: block,
unblock: unblock,
getElement: function getElement() {
return elementRef.current;
}
};
});
var createMask = function createMask() {
if (visibleState) {
var appendTo = props.fullScreen ? document.body : 'self';
var _className = classNames('p-blockui p-component-overlay p-component-overlay-enter', {
'p-blockui-document': props.fullScreen
}, props.className);
var content = props.template ? ObjectUtils.getJSXElement(props.template, props) : null;
var _mask = /*#__PURE__*/React__namespace.createElement("div", {
ref: maskRef,
className: _className,
style: props.style
}, content);
return /*#__PURE__*/React__namespace.createElement(Portal, {
element: _mask,
appendTo: appendTo,
onMounted: onPortalMounted
});
}
return null;
};
var otherProps = BlockUIBase.getOtherProps(props);
var mask = createMask();
var className = classNames('p-blockui-container', props.containerClassName);
return /*#__PURE__*/React__namespace.createElement("div", _extends({
id: props.id,
ref: elementRef,
className: className,
style: props.containerStyle
}, otherProps), props.children, mask);
});
BlockUI.displayName = 'BlockUI';
var BreadCrumbBase = {
defaultProps: {
__TYPE: 'BreadCrumb',
id: null,
model: null,
home: null,
style: null,
className: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, BreadCrumbBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, BreadCrumbBase.defaultProps);
}
};
var BreadCrumb = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = BreadCrumbBase.getProps(inProps);
var elementRef = React__namespace.useRef(null);
var itemClick = function itemClick(event, item) {
if (item.disabled) {
event.preventDefault();
return;
}
if (!item.url) {
event.preventDefault();
}
if (item.command) {
item.command({
originalEvent: event,
item: item
});
}
};
var createHome = function createHome() {
var home = props.home;
if (home) {
if (home.visible === false) {
return null;
}
var _icon = home.icon,
target = home.target,
url = home.url,
disabled = home.disabled,
style = home.style,
_className = home.className,
template = home.template;
var _className2 = classNames('p-breadcrumb-home', {
'p-disabled': disabled
}, _className);
var icon = IconUtils.getJSXIcon(_icon, {
className: 'p-menuitem-icon'
}, {
props: props
});
var content = /*#__PURE__*/React__namespace.createElement("a", {
href: url || '#',
className: "p-menuitem-link",
"aria-disabled": disabled,
target: target,
onClick: function onClick(event) {
return itemClick(event, home);
}
}, icon);
if (template) {
var defaultContentOptions = {
onClick: function onClick(event) {
return itemClick(event, home);
},
className: 'p-menuitem-link',
labelClassName: 'p-menuitem-text',
element: content,
props: props
};
content = ObjectUtils.getJSXElement(template, home, defaultContentOptions);
}
return /*#__PURE__*/React__namespace.createElement("li", {
className: _className2,
style: style
}, content);
}
return null;
};
var createSeparator = function createSeparator() {
return /*#__PURE__*/React__namespace.createElement("li", {
className: "p-breadcrumb-chevron pi pi-chevron-right"
});
};
var createMenuitem = function createMenuitem(item) {
if (item.visible === false) {
return null;
}
var className = classNames(item.className, {
'p-disabled': item.disabled
});
var label = item.label && /*#__PURE__*/React__namespace.createElement("span", {
className: "p-menuitem-text"
}, item.label);
var content = /*#__PURE__*/React__namespace.createElement("a", {
href: item.url || '#',
className: "p-menuitem-link",
target: item.target,
onClick: function onClick(event) {
return itemClick(event, item);
},
"aria-disabled": item.disabled
}, label);
if (item.template) {
var defaultContentOptions = {
onClick: function onClick(event) {
return itemClick(event, item);
},
className: 'p-menuitem-link',
labelClassName: 'p-menuitem-text',
element: content,
props: props
};
content = ObjectUtils.getJSXElement(item.template, item, defaultContentOptions);
}
return /*#__PURE__*/React__namespace.createElement("li", {
className: className,
style: item.style
}, content);
};
var createMenuitems = function createMenuitems() {
if (props.model) {
var _items = props.model.map(function (item, index) {
if (item.visible === false) {
return null;
}
var menuitem = createMenuitem(item);
var separator = index === props.model.length - 1 ? null : createSeparator();
var key = item.label + '_' + index;
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, {
key: key
}, menuitem, separator);
});
return _items;
}
return null;
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
getElement: function getElement() {
return elementRef.current;
}
};
});
var otherProps = BreadCrumbBase.getOtherProps(props);
var className = classNames('p-breadcrumb p-component', props.className);
var home = createHome();
var items = createMenuitems();
var separator = createSeparator();
return /*#__PURE__*/React__namespace.createElement("nav", _extends({
id: props.id,
ref: elementRef,
className: className,
style: props.style,
"aria-label": "Breadcrumb"
}, otherProps), /*#__PURE__*/React__namespace.createElement("ul", null, home, separator, items));
}));
BreadCrumb.displayName = 'BreadCrumb';
var CalendarBase = {
defaultProps: {
__TYPE: 'Calendar',
appendTo: null,
ariaLabelledBy: null,
autoZIndex: true,
baseZIndex: 0,
className: null,
clearButtonClassName: 'p-button-secondary',
dateFormat: null,
dateTemplate: null,
decadeTemplate: null,
disabled: false,
disabledDates: null,
disabledDays: null,
footerTemplate: null,
formatDateTime: null,
headerTemplate: null,
hideOnDateTimeSelect: false,
hourFormat: '24',
icon: 'pi pi-calendar',
iconPos: 'right',
id: null,
inline: false,
inputClassName: null,
inputId: null,
inputMode: 'none',
inputRef: null,
inputStyle: null,
keepInvalid: false,
locale: null,
mask: null,
maxDate: null,
maxDateCount: null,
minDate: null,
monthNavigator: false,
monthNavigatorTemplate: null,
name: null,
numberOfMonths: 1,
onBlur: null,
onChange: null,
onClearButtonClick: null,
onFocus: null,
onHide: null,
onInput: null,
onMonthChange: null,
onSelect: null,
onShow: null,
onTodayButtonClick: null,
onViewDateChange: null,
onVisibleChange: null,
panelClassName: null,
panelStyle: null,
parseDateTime: null,
placeholder: null,
readOnlyInput: false,
required: false,
selectOtherMonths: false,
selectionMode: 'single',
shortYearCutoff: '+10',
showButtonBar: false,
showIcon: false,
showMillisec: false,
showMinMaxRange: false,
showOnFocus: true,
showOtherMonths: true,
showSeconds: false,
showTime: false,
showWeek: false,
stepHour: 1,
stepMillisec: 1,
stepMinute: 1,
stepSecond: 1,
style: null,
tabIndex: null,
timeOnly: false,
todayButtonClassName: 'p-button-secondary',
tooltip: null,
tooltipOptions: null,
touchUI: false,
transitionOptions: null,
value: null,
view: 'date',
viewDate: null,
visible: false,
yearNavigator: false,
yearNavigatorTemplate: null,
yearRange: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, CalendarBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, CalendarBase.defaultProps);
}
};
var CalendarPanel = /*#__PURE__*/React__namespace.forwardRef(function (props, ref) {
var createElement = function createElement() {
return /*#__PURE__*/React__namespace.createElement(CSSTransition, {
nodeRef: ref,
classNames: "p-connected-overlay",
"in": props["in"],
timeout: {
enter: 120,
exit: 100
},
options: props.transitionOptions,
unmountOnExit: true,
onEnter: props.onEnter,
onEntered: props.onEntered,
onExit: props.onExit,
onExited: props.onExited
}, /*#__PURE__*/React__namespace.createElement("div", {
ref: ref,
className: props.className,
style: props.style,
onClick: props.onClick,
onMouseUp: props.onMouseUp
}, props.children));
};
var element = createElement();
return props.inline ? element : /*#__PURE__*/React__namespace.createElement(Portal, {
element: element,
appendTo: props.appendTo
});
});
CalendarPanel.displayName = 'CalendarPanel';
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; }
var Calendar = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var _classNames;
var props = CalendarBase.getProps(inProps);
var _React$useState = React__namespace.useState(false),
_React$useState2 = _slicedToArray(_React$useState, 2),
focusedState = _React$useState2[0],
setFocusedState = _React$useState2[1];
var _React$useState3 = React__namespace.useState(false),
_React$useState4 = _slicedToArray(_React$useState3, 2),
overlayVisibleState = _React$useState4[0],
setOverlayVisibleState = _React$useState4[1];
var _React$useState5 = React__namespace.useState(null),
_React$useState6 = _slicedToArray(_React$useState5, 2),
viewDateState = _React$useState6[0],
setViewDateState = _React$useState6[1];
var elementRef = React__namespace.useRef(null);
var overlayRef = React__namespace.useRef(null);
var inputRef = React__namespace.useRef(props.inputRef);
var navigation = React__namespace.useRef(null);
var ignoreFocusFunctionality = React__namespace.useRef(false);
var isKeydown = React__namespace.useRef(false);
var timePickerTimer = React__namespace.useRef(null);
var viewStateChanged = React__namespace.useRef(false);
var touchUIMask = React__namespace.useRef(null);
var overlayEventListener = React__namespace.useRef(null);
var touchUIMaskClickListener = React__namespace.useRef(null);
var isOverlayClicked = React__namespace.useRef(false);
var ignoreMaskChange = React__namespace.useRef(false);
var _React$useState7 = React__namespace.useState('date'),
_React$useState8 = _slicedToArray(_React$useState7, 2),
currentView = _React$useState8[0],
setCurrentView = _React$useState8[1];
var _React$useState9 = React__namespace.useState(null),
_React$useState10 = _slicedToArray(_React$useState9, 2),
currentMonth = _React$useState10[0],
setCurrentMonth = _React$useState10[1];
var _React$useState11 = React__namespace.useState(null),
_React$useState12 = _slicedToArray(_React$useState11, 2),
currentYear = _React$useState12[0],
setCurrentYear = _React$useState12[1];
var _React$useState13 = React__namespace.useState([]),
_React$useState14 = _slicedToArray(_React$useState13, 2),
yearOptions = _React$useState14[0],
setYearOptions = _React$useState14[1];
var previousValue = usePrevious(props.value);
var visible = props.inline || (props.onVisibleChange ? props.visible : overlayVisibleState);
var attributeSelector = UniqueComponentId();
var _useOverlayListener = useOverlayListener({
target: elementRef,
overlay: overlayRef,
listener: function listener(event, _ref) {
var type = _ref.type,
valid = _ref.valid;
if (valid) {
type === 'outside' ? !isOverlayClicked.current && !isNavIconClicked(event.target) && hide('outside') : hide();
}
isOverlayClicked.current = false;
},
when: !(props.touchUI || props.inline) && visible
}),
_useOverlayListener2 = _slicedToArray(_useOverlayListener, 2),
bindOverlayListener = _useOverlayListener2[0],
unbindOverlayListener = _useOverlayListener2[1];
var getDateFormat = function getDateFormat() {
return props.dateFormat || localeOption('dateFormat', props.locale);
};
var onInputFocus = function onInputFocus(event) {
if (ignoreFocusFunctionality.current) {
setFocusedState(true);
ignoreFocusFunctionality.current = false;
} else {
if (props.showOnFocus && !visible) {
show();
}
setFocusedState(true);
props.onFocus && props.onFocus(event);
}
};
var onInputBlur = function onInputBlur(event) {
setFocusedState(false);
!props.keepInvalid && updateInputfield(props.value);
props.onBlur && props.onBlur(event);
};
var onInputKeyDown = function onInputKeyDown(event) {
isKeydown.current = true;
switch (event.which) {
//escape
case 27:
{
hide();
break;
}
//tab
case 9:
{
visible && trapFocus(event);
props.touchUI && disableModality();
break;
}
}
};
var onUserInput = function onUserInput(event) {
// IE 11 Workaround for input placeholder
if (!isKeydown.current) {
return;
}
isKeydown.current = false;
updateValueOnInput(event, event.target.value);
props.onInput && props.onInput(event);
};
var updateValueOnInput = function updateValueOnInput(event, rawValue) {
try {
var value = parseValueFromString(rawValue);
if (isValidSelection(value)) {
updateModel(event, value);
updateViewDate(event, value.length ? value[0] : value);
}
} catch (err) {
//invalid date
var _value = props.keepInvalid ? rawValue : null;
updateModel(event, _value);
}
};
var reFocusInputField = function reFocusInputField() {
if (!props.inline && inputRef.current) {
ignoreFocusFunctionality.current = true;
DomHandler.focus(inputRef.current);
}
};
var isValidSelection = function isValidSelection(value) {
var isValid = true;
if (isSingleSelection()) {
if (!(isSelectable(value.getDate(), value.getMonth(), value.getFullYear(), false) && isSelectableTime(value))) {
isValid = false;
}
} else if (value.every(function (v) {
return isSelectable(v.getDate(), v.getMonth(), v.getFullYear(), false) && isSelectableTime(v);
})) {
if (isRangeSelection()) {
isValid = value.length > 1 && value[1] > value[0] ? true : false;
}
}
return isValid;
};
var onButtonClick = function onButtonClick() {
visible ? hide() : show();
};
var onPrevButtonClick = function onPrevButtonClick(event) {
navigation.current = {
backward: true,
button: true
};
navBackward(event);
};
var onNextButtonClick = function onNextButtonClick(event) {
navigation.current = {
backward: false,
button: true
};
navForward(event);
};
var onContainerButtonKeydown = function onContainerButtonKeydown(event) {
switch (event.which) {
//tab
case 9:
trapFocus(event);
break;
//escape
case 27:
hide(null, reFocusInputField);
event.preventDefault();
break;
}
};
var trapFocus = function trapFocus(event) {
event.preventDefault();
var focusableElements = DomHandler.getFocusableElements(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();
}
}
}
};
var updateFocus = function updateFocus() {
if (navigation.current) {
if (navigation.current.button) {
initFocusableCell();
if (navigation.current.backward) DomHandler.findSingle(overlayRef.current, '.p-datepicker-prev').focus();else DomHandler.findSingle(overlayRef.current, '.p-datepicker-next').focus();
} else {
var cell;
if (navigation.current.backward) {
var cells = DomHandler.find(overlayRef.current, '.p-datepicker-calendar td span:not(.p-disabled)');
cell = cells[cells.length - 1];
} else {
cell = DomHandler.findSingle(overlayRef.current, '.p-datepicker-calendar td span:not(.p-disabled)');
}
if (cell) {
cell.tabIndex = '0';
cell.focus();
}
}
navigation.current = null;
} else {
initFocusableCell();
}
};
var initFocusableCell = function initFocusableCell() {
var cell;
if (props.view === 'month') {
var cells = DomHandler.find(overlayRef.current, '.p-monthpicker .p-monthpicker-month');
var selectedCell = DomHandler.findSingle(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(overlayRef.current, 'span.p-highlight');
if (!cell) {
var todayCell = DomHandler.findSingle(overlayRef.current, 'td.p-datepicker-today span:not(.p-disabled)');
cell = todayCell || DomHandler.findSingle(overlayRef.current, '.p-datepicker-calendar td span:not(.p-disabled)');
}
}
if (cell) {
cell.tabIndex = '0';
}
};
var navBackward = function navBackward(event) {
if (props.disabled) {
event.preventDefault();
return;
}
var newViewDate = new Date(getViewDate().getTime());
newViewDate.setDate(1);
if (currentView === 'date') {
if (newViewDate.getMonth() === 0) {
newViewDate.setMonth(11);
newViewDate.setFullYear(decrementYear());
setCurrentMonth(11);
} else {
newViewDate.setMonth(newViewDate.getMonth() - 1);
setCurrentMonth(function (prevState) {
return prevState - 1;
});
}
} else if (currentView === 'month') {
var newYear = newViewDate.getFullYear() - 1;
if (props.yearNavigator) {
var minYear = parseInt(props.yearRange.split(':')[0], 10);
if (newYear < minYear) {
newYear = minYear;
}
}
newViewDate.setFullYear(newYear);
}
if (currentView === 'month') {
newViewDate.setFullYear(decrementYear());
} else if (currentView === 'year') {
newViewDate.setFullYear(decrementDecade());
}
updateViewDate(event, newViewDate);
event.preventDefault();
};
var navForward = function navForward(event) {
if (props.disabled) {
event.preventDefault();
return;
}
var newViewDate = new Date(getViewDate().getTime());
newViewDate.setDate(1);
if (currentView === 'date') {
if (newViewDate.getMonth() === 11) {
newViewDate.setMonth(0);
newViewDate.setFullYear(incrementYear());
setCurrentMonth(0);
} else {
newViewDate.setMonth(newViewDate.getMonth() + 1);
setCurrentMonth(function (prevState) {
return prevState + 1;
});
}
} else if (currentView === 'month') {
var newYear = newViewDate.getFullYear() + 1;
if (props.yearNavigator) {
var maxYear = parseInt(props.yearRange.split(':')[1], 10);
if (newYear > maxYear) {
newYear = maxYear;
}
}
newViewDate.setFullYear(newYear);
}
if (currentView === 'month') {
newViewDate.setFullYear(incrementYear());
} else if (currentView === 'year') {
newViewDate.setFullYear(incrementDecade());
}
updateViewDate(event, newViewDate);
event.preventDefault();
};
var populateYearOptions = function populateYearOptions(start, end) {
var _yearOptions = [];
for (var i = start; i <= end; i++) {
yearOptions.push(i);
}
setYearOptions(_yearOptions);
};
var decrementYear = function decrementYear() {
var _currentYear = currentYear - 1;
setCurrentYear(_currentYear);
if (props.yearNavigator && _currentYear < yearOptions[0]) {
var difference = yearOptions[yearOptions.length - 1] - yearOptions[0];
populateYearOptions(yearOptions[0] - difference, yearOptions[yearOptions.length - 1] - difference);
}
return _currentYear;
};
var incrementYear = function incrementYear() {
var _currentYear = currentYear + 1;
setCurrentYear(_currentYear);
if (props.yearNavigator && _currentYear.current > yearOptions[yearOptions.length - 1]) {
var difference = yearOptions[yearOptions.length - 1] - yearOptions[0];
populateYearOptions(yearOptions[0] + difference, yearOptions[yearOptions.length - 1] + difference);
}
return _currentYear;
};
var onMonthDropdownChange = function onMonthDropdownChange(event, value) {
var currentViewDate = getViewDate();
var newViewDate = new Date(currentViewDate.getTime());
newViewDate.setMonth(parseInt(value, 10));
updateViewDate(event, newViewDate);
};
var onYearDropdownChange = function onYearDropdownChange(event, value) {
var currentViewDate = getViewDate();
var newViewDate = new Date(currentViewDate.getTime());
newViewDate.setFullYear(parseInt(value, 10));
updateViewDate(event, newViewDate);
};
var onTodayButtonClick = 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()
};
updateViewDate(event, today);
onDateSelect(event, dateMeta, timeMeta);
props.onTodayButtonClick && props.onTodayButtonClick(event);
};
var onClearButtonClick = function onClearButtonClick(event) {
updateModel(event, null);
updateInputfield(null);
hide();
props.onClearButtonClick && props.onClearButtonClick(event);
};
var onPanelClick = function onPanelClick(event) {
if (!props.inline) {
OverlayService.emit('overlay-click', {
originalEvent: event,
target: elementRef.current
});
}
};
var onPanelMouseUp = function onPanelMouseUp(event) {
onPanelClick(event);
};
var onTimePickerElementMouseDown = function onTimePickerElementMouseDown(event, type, direction) {
if (!props.disabled) {
repeat(event, null, type, direction);
event.preventDefault();
}
};
var onTimePickerElementMouseUp = function onTimePickerElementMouseUp() {
if (!props.disabled) {
clearTimePickerTimer();
}
};
var onTimePickerElementMouseLeave = function onTimePickerElementMouseLeave() {
if (!props.disabled) {
clearTimePickerTimer();
}
};
var repeat = function repeat(event, interval, type, direction) {
clearTimePickerTimer();
timePickerTimer.current = setTimeout(function () {
repeat(event, 100, type, direction);
}, interval || 500);
switch (type) {
case 0:
if (direction === 1) incrementHour(event);else decrementHour(event);
break;
case 1:
if (direction === 1) incrementMinute(event);else decrementMinute(event);
break;
case 2:
if (direction === 1) incrementSecond(event);else decrementSecond(event);
break;
case 3:
if (direction === 1) incrementMilliSecond(event);else decrementMilliSecond(event);
break;
}
};
var clearTimePickerTimer = function clearTimePickerTimer() {
if (timePickerTimer.current) {
clearTimeout(timePickerTimer.current);
}
};
var incrementHour = function incrementHour(event) {
var currentTime = getCurrentDateTime();
var currentHour = currentTime.getHours();
var newHour = currentHour + props.stepHour;
newHour = newHour >= 24 ? newHour - 24 : newHour;
if (validateHour(newHour, currentTime)) {
if (props.maxDate && props.maxDate.toDateString() === currentTime.toDateString() && props.maxDate.getHours() === newHour) {
if (props.maxDate.getMinutes() < currentTime.getMinutes()) {
if (props.maxDate.getSeconds() < currentTime.getSeconds()) {
if (props.maxDate.getMilliseconds() < currentTime.getMilliseconds()) {
updateTime(event, newHour, props.maxDate.getMinutes(), props.maxDate.getSeconds(), props.maxDate.getMilliseconds());
} else {
updateTime(event, newHour, props.maxDate.getMinutes(), props.maxDate.getSeconds(), currentTime.getMilliseconds());
}
} else {
updateTime(event, newHour, props.maxDate.getMinutes(), currentTime.getSeconds(), currentTime.getMilliseconds());
}
} else if (props.maxDate.getMinutes() === currentTime.getMinutes()) {
if (props.maxDate.getSeconds() < currentTime.getSeconds()) {
if (props.maxDate.getMilliseconds() < currentTime.getMilliseconds()) {
updateTime(event, newHour, props.maxDate.getMinutes(), props.maxDate.getSeconds(), props.maxDate.getMilliseconds());
} else {
updateTime(event, newHour, props.maxDate.getMinutes(), props.maxDate.getSeconds(), currentTime.getMilliseconds());
}
} else {
updateTime(event, newHour, props.maxDate.getMinutes(), currentTime.getSeconds(), currentTime.getMilliseconds());
}
} else {
updateTime(event, newHour, currentTime.getMinutes(), currentTime.getSeconds(), currentTime.getMilliseconds());
}
} else {
updateTime(event, newHour, currentTime.getMinutes(), currentTime.getSeconds(), currentTime.getMilliseconds());
}
}
event.preventDefault();
};
var decrementHour = function decrementHour(event) {
var currentTime = getCurrentDateTime();
var currentHour = currentTime.getHours();
var newHour = currentHour - props.stepHour;
newHour = newHour < 0 ? newHour + 24 : newHour;
if (validateHour(newHour, currentTime)) {
if (props.minDate && props.minDate.toDateString() === currentTime.toDateString() && props.minDate.getHours() === newHour) {
if (props.minDate.getMinutes() > currentTime.getMinutes()) {
if (props.minDate.getSeconds() > currentTime.getSeconds()) {
if (props.minDate.getMilliseconds() > currentTime.getMilliseconds()) {
updateTime(event, newHour, props.minDate.getMinutes(), props.minDate.getSeconds(), props.minDate.getMilliseconds());
} else {
updateTime(event, newHour, props.minDate.getMinutes(), props.minDate.getSeconds(), currentTime.getMilliseconds());
}
} else {
updateTime(event, newHour, props.minDate.getMinutes(), currentTime.getSeconds(), currentTime.getMilliseconds());
}
} else if (props.minDate.getMinutes() === currentTime.getMinutes()) {
if (props.minDate.getSeconds() > currentTime.getSeconds()) {
if (props.minDate.getMilliseconds() > currentTime.getMilliseconds()) {
updateTime(event, newHour, props.minDate.getMinutes(), props.minDate.getSeconds(), props.minDate.getMilliseconds());
} else {
updateTime(event, newHour, props.minDate.getMinutes(), props.minDate.getSeconds(), currentTime.getMilliseconds());
}
} else {
updateTime(event, newHour, props.minDate.getMinutes(), currentTime.getSeconds(), currentTime.getMilliseconds());
}
} else {
updateTime(event, newHour, currentTime.getMinutes(), currentTime.getSeconds(), currentTime.getMilliseconds());
}
} else {
updateTime(event, newHour, currentTime.getMinutes(), currentTime.getSeconds(), currentTime.getMilliseconds());
}
}
event.preventDefault();
};
var doStepMinute = function doStepMinute(currentMinute, step) {
if (props.stepMinute <= 1) {
return step ? currentMinute + step : currentMinute;
}
if (!step) {
step = props.stepMinute;
if (currentMinute % step === 0) {
return currentMinute;
}
}
return Math.floor((currentMinute + step) / step) * step;
};
var incrementMinute = function incrementMinute(event) {
var currentTime = getCurrentDateTime();
var currentMinute = currentTime.getMinutes();
var newMinute = doStepMinute(currentMinute, props.stepMinute);
newMinute = newMinute > 59 ? newMinute - 60 : newMinute;
if (validateMinute(newMinute, currentTime)) {
if (props.maxDate && props.maxDate.toDateString() === currentTime.toDateString() && props.maxDate.getMinutes() === newMinute) {
if (props.maxDate.getSeconds() < currentTime.getSeconds()) {
if (props.maxDate.getMilliseconds() < currentTime.getMilliseconds()) {
updateTime(event, currentTime.getHours(), newMinute, props.maxDate.getSeconds(), props.maxDate.getMilliseconds());
} else {
updateTime(event, currentTime.getHours(), newMinute, props.maxDate.getSeconds(), currentTime.getMilliseconds());
}
} else {
updateTime(event, currentTime.getHours(), newMinute, currentTime.getSeconds(), currentTime.getMilliseconds());
}
} else {
updateTime(event, currentTime.getHours(), newMinute, currentTime.getSeconds(), currentTime.getMilliseconds());
}
}
event.preventDefault();
};
var decrementMinute = function decrementMinute(event) {
var currentTime = getCurrentDateTime();
var currentMinute = currentTime.getMinutes();
var newMinute = doStepMinute(currentMinute, -props.stepMinute);
newMinute = newMinute < 0 ? newMinute + 60 : newMinute;
if (validateMinute(newMinute, currentTime)) {
if (props.minDate && props.minDate.toDateString() === currentTime.toDateString() && props.minDate.getMinutes() === newMinute) {
if (props.minDate.getSeconds() > currentTime.getSeconds()) {
if (props.minDate.getMilliseconds() > currentTime.getMilliseconds()) {
updateTime(event, currentTime.getHours(), newMinute, props.minDate.getSeconds(), props.minDate.getMilliseconds());
} else {
updateTime(event, currentTime.getHours(), newMinute, props.minDate.getSeconds(), currentTime.getMilliseconds());
}
} else {
updateTime(event, currentTime.getHours(), newMinute, currentTime.getSeconds(), currentTime.getMilliseconds());
}
} else {
updateTime(event, currentTime.getHours(), newMinute, currentTime.getSeconds(), currentTime.getMilliseconds());
}
}
event.preventDefault();
};
var incrementSecond = function incrementSecond(event) {
var currentTime = getCurrentDateTime();
var currentSecond = currentTime.getSeconds();
var newSecond = currentSecond + props.stepSecond;
newSecond = newSecond > 59 ? newSecond - 60 : newSecond;
if (validateSecond(newSecond, currentTime)) {
if (props.maxDate && props.maxDate.toDateString() === currentTime.toDateString() && props.maxDate.getSeconds() === newSecond) {
if (props.maxDate.getMilliseconds() < currentTime.getMilliseconds()) {
updateTime(event, currentTime.getHours(), currentTime.getMinutes(), newSecond, props.maxDate.getMilliseconds());
} else {
updateTime(event, currentTime.getHours(), currentTime.getMinutes(), newSecond, currentTime.getMilliseconds());
}
} else {
updateTime(event, currentTime.getHours(), currentTime.getMinutes(), newSecond, currentTime.getMilliseconds());
}
}
event.preventDefault();
};
var decrementSecond = function decrementSecond(event) {
var currentTime = getCurrentDateTime();
var currentSecond = currentTime.getSeconds();
var newSecond = currentSecond - props.stepSecond;
newSecond = newSecond < 0 ? newSecond + 60 : newSecond;
if (validateSecond(newSecond, currentTime)) {
if (props.minDate && props.minDate.toDateString() === currentTime.toDateString() && props.minDate.getSeconds() === newSecond) {
if (props.minDate.getMilliseconds() > currentTime.getMilliseconds()) {
updateTime(event, currentTime.getHours(), currentTime.getMinutes(), newSecond, props.minDate.getMilliseconds());
} else {
updateTime(event, currentTime.getHours(), currentTime.getMinutes(), newSecond, currentTime.getMilliseconds());
}
} else {
updateTime(event, currentTime.getHours(), currentTime.getMinutes(), newSecond, currentTime.getMilliseconds());
}
}
event.preventDefault();
};
var incrementMilliSecond = function incrementMilliSecond(event) {
var currentTime = getCurrentDateTime();
var currentMillisecond = currentTime.getMilliseconds();
var newMillisecond = currentMillisecond + props.stepMillisec;
newMillisecond = newMillisecond > 999 ? newMillisecond - 1000 : newMillisecond;
if (validateMillisecond(newMillisecond, currentTime)) {
updateTime(event, currentTime.getHours(), currentTime.getMinutes(), currentTime.getSeconds(), newMillisecond);
}
event.preventDefault();
};
var decrementMilliSecond = function decrementMilliSecond(event) {
var currentTime = getCurrentDateTime();
var currentMillisecond = currentTime.getMilliseconds();
var newMillisecond = currentMillisecond - props.stepMillisec;
newMillisecond = newMillisecond < 0 ? newMillisecond + 999 : newMillisecond;
if (validateMillisecond(newMillisecond, currentTime)) {
updateTime(event, currentTime.getHours(), currentTime.getMinutes(), currentTime.getSeconds(), newMillisecond);
}
event.preventDefault();
};
var toggleAmPm = function toggleAmPm(event) {
var currentTime = getCurrentDateTime();
var currentHour = currentTime.getHours();
var newHour = currentHour >= 12 ? currentHour - 12 : currentHour + 12;
if (validateHour(convertTo24Hour(newHour, !(currentHour > 11)), currentTime)) {
updateTime(event, newHour, currentTime.getMinutes(), currentTime.getSeconds(), currentTime.getMilliseconds());
}
event.preventDefault();
};
var getViewDate = function getViewDate(date) {
var propValue = props.value;
var viewDate = date || (props.onViewDateChange ? props.viewDate : viewDateState);
if (Array.isArray(propValue)) {
propValue = propValue[0];
}
return viewDate && isValidDate(viewDate) ? viewDate : propValue && isValidDate(propValue) ? propValue : new Date();
};
var getCurrentDateTime = function getCurrentDateTime() {
if (isSingleSelection()) {
return props.value && props.value instanceof Date ? props.value : getViewDate();
} else if (isMultipleSelection()) {
if (props.value && props.value.length) {
return props.value[props.value.length - 1];
}
} else if (isRangeSelection()) {
if (props.value && props.value.length) {
var startDate = props.value[0];
var endDate = props.value[1];
return endDate || startDate;
}
}
return new Date();
};
var isValidDate = function isValidDate(date) {
return date instanceof Date && !isNaN(date);
};
var convertTo24Hour = function convertTo24Hour(hour, pm) {
if (props.hourFormat == '12') {
return hour === 12 ? pm ? 12 : 0 : pm ? hour + 12 : hour;
}
return hour;
};
var validateHour = function validateHour(hour, value) {
var valid = true;
var valueDateString = value ? value.toDateString() : null;
if (props.minDate && valueDateString && props.minDate.toDateString() === valueDateString) {
if (props.minDate.getHours() > hour) {
valid = false;
}
}
if (props.maxDate && valueDateString && props.maxDate.toDateString() === valueDateString) {
if (props.maxDate.getHours() < hour) {
valid = false;
}
}
return valid;
};
var validateMinute = function validateMinute(minute, value) {
var valid = true;
var valueDateString = value ? value.toDateString() : null;
if (props.minDate && valueDateString && props.minDate.toDateString() === valueDateString) {
if (value.getHours() === props.minDate.getHours()) {
if (props.minDate.getMinutes() > minute) {
valid = false;
}
}
}
if (props.maxDate && valueDateString && props.maxDate.toDateString() === valueDateString) {
if (value.getHours() === props.maxDate.getHours()) {
if (props.maxDate.getMinutes() < minute) {
valid = false;
}
}
}
return valid;
};
var validateSecond = function validateSecond(second, value) {
var valid = true;
var valueDateString = value ? value.toDateString() : null;
if (props.minDate && valueDateString && props.minDate.toDateString() === valueDateString) {
if (value.getHours() === props.minDate.getHours() && value.getMinutes() === props.minDate.getMinutes()) {
if (props.minDate.getSeconds() > second) {
valid = false;
}
}
}
if (props.maxDate && valueDateString && props.maxDate.toDateString() === valueDateString) {
if (value.getHours() === props.maxDate.getHours() && value.getMinutes() === props.maxDate.getMinutes()) {
if (props.maxDate.getSeconds() < second) {
valid = false;
}
}
}
return valid;
};
var validateMillisecond = function validateMillisecond(millisecond, value) {
var valid = true;
var valueDateString = value ? value.toDateString() : null;
if (props.minDate && valueDateString && props.minDate.toDateString() === valueDateString) {
if (value.getHours() === props.minDate.getHours() && value.getSeconds() === props.minDate.getSeconds() && value.getMinutes() === props.minDate.getMinutes()) {
if (props.minDate.getMilliseconds() > millisecond) {
valid = false;
}
}
}
if (props.maxDate && valueDateString && props.maxDate.toDateString() === valueDateString) {
if (value.getHours() === props.maxDate.getHours() && value.getSeconds() === props.maxDate.getSeconds() && value.getMinutes() === props.maxDate.getMinutes()) {
if (props.maxDate.getMilliseconds() < millisecond) {
valid = false;
}
}
}
return valid;
};
var validateDate = function validateDate(value) {
if (props.yearNavigator) {
var viewYear = value.getFullYear();
var minRangeYear = props.yearRange ? parseInt(props.yearRange.split(':')[0], 10) : null;
var maxRangeYear = props.yearRange ? parseInt(props.yearRange.split(':')[1], 10) : null;
var minYear = props.minDate && minRangeYear != null ? Math.max(props.minDate.getFullYear(), minRangeYear) : props.minDate || minRangeYear;
var maxYear = props.maxDate && maxRangeYear != null ? Math.min(props.maxDate.getFullYear(), maxRangeYear) : props.maxDate || maxRangeYear;
if (minYear && minYear > viewYear) {
viewYear = minYear;
}
if (maxYear && maxYear < viewYear) {
viewYear = maxYear;
}
value.setFullYear(viewYear);
}
if (props.monthNavigator && props.view !== 'month') {
var viewMonth = value.getMonth();
var viewMonthWithMinMax = parseInt(isInMinYear(value) && Math.max(props.minDate.getMonth(), viewMonth).toString() || isInMaxYear(value) && Math.min(props.maxDate.getMonth(), viewMonth).toString() || viewMonth);
value.setMonth(viewMonthWithMinMax);
}
};
var updateTime = function updateTime(event, hour, minute, second, millisecond) {
var newDateTime = getCurrentDateTime();
newDateTime.setHours(hour);
newDateTime.setMinutes(minute);
newDateTime.setSeconds(second);
newDateTime.setMilliseconds(millisecond);
if (isMultipleSelection()) {
if (props.value && props.value.length) {
var value = _toConsumableArray(props.value);
value[value.length - 1] = newDateTime;
newDateTime = value;
} else {
newDateTime = [newDateTime];
}
} else if (isRangeSelection()) {
if (props.value && props.value.length) {
var startDate = props.value[0];
var endDate = props.value[1];
newDateTime = endDate ? [startDate, newDateTime] : [newDateTime, null];
} else {
newDateTime = [newDateTime, null];
}
}
updateModel(event, newDateTime);
if (props.onSelect) {
props.onSelect({
originalEvent: event,
value: newDateTime
});
}
updateInputfield(newDateTime);
};
var updateViewDate = function updateViewDate(event, value) {
validateDate(value);
if (props.onViewDateChange) {
props.onViewDateChange({
originalEvent: event,
value: value
});
} else {
viewStateChanged.current = true;
setViewDateState(value);
}
setCurrentMonth(value.getMonth());
setCurrentYear(value.getFullYear());
};
var setNavigationState = function setNavigationState(newViewDate) {
if (!props.showMinMaxRange || props.view !== 'date' || !overlayRef.current) {
return;
}
var navPrev = DomHandler.findSingle(overlayRef.current, '.p-datepicker-prev');
var navNext = DomHandler.findSingle(overlayRef.current, '.p-datepicker-next');
if (props.disabled) {
DomHandler.addClass(navPrev, 'p-disabled');
DomHandler.addClass(navNext, 'p-disabled');
return;
}
// previous (check first day of month at 00:00:00)
if (props.minDate) {
var firstDayOfMonth = new Date(newViewDate.getTime());
if (firstDayOfMonth.getMonth() === 0) {
firstDayOfMonth.setMonth(11, 1);
firstDayOfMonth.setFullYear(firstDayOfMonth.getFullYear() - 1);
} else {
firstDayOfMonth.setMonth(firstDayOfMonth.getMonth() - 1, 1);
}
firstDayOfMonth.setHours(0);
firstDayOfMonth.setMinutes(0);
firstDayOfMonth.setSeconds(0);
if (props.minDate > firstDayOfMonth) {
DomHandler.addClass(navPrev, 'p-disabled');
} else {
DomHandler.removeClass(navPrev, 'p-disabled');
}
}
// next (check last day of month at 11:59:59)
if (props.maxDate) {
var lastDayOfMonth = new Date(newViewDate.getTime());
if (lastDayOfMonth.getMonth() === 11) {
lastDayOfMonth.setMonth(0, 1);
lastDayOfMonth.setFullYear(lastDayOfMonth.getFullYear() + 1);
} else {
lastDayOfMonth.setMonth(lastDayOfMonth.getMonth() + 1, 1);
}
lastDayOfMonth.setHours(0);
lastDayOfMonth.setMinutes(0);
lastDayOfMonth.setSeconds(0);
lastDayOfMonth.setSeconds(-1);
if (props.maxDate < lastDayOfMonth) {
DomHandler.addClass(navNext, 'p-disabled');
} else {
DomHandler.removeClass(navNext, 'p-disabled');
}
}
};
var onDateCellKeydown = 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')) {
navigation.current = {
backward: false
};
navForward(event);
} else {
nextRow.children[cellIndex].children[0].tabIndex = '0';
nextRow.children[cellIndex].children[0].focus();
}
} else {
navigation.current = {
backward: false
};
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')) {
navigation.current = {
backward: true
};
navBackward(event);
} else {
_focusCell.tabIndex = '0';
_focusCell.focus();
}
} else {
navigation.current = {
backward: true
};
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')) {
navigateToMonth(true, groupIndex, event);
} else {
_focusCell2.tabIndex = '0';
_focusCell2.focus();
}
} else {
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')) {
navigateToMonth(false, groupIndex, event);
} else {
_focusCell3.tabIndex = '0';
_focusCell3.focus();
}
} else {
navigateToMonth(false, groupIndex, event);
}
event.preventDefault();
break;
}
//enter
case 13:
{
onDateSelect(event, date);
event.preventDefault();
break;
}
//escape
case 27:
{
hide(null, reFocusInputField);
event.preventDefault();
break;
}
//tab
case 9:
{
trapFocus(event);
break;
}
}
};
var navigateToMonth = function navigateToMonth(prev, groupIndex, event) {
if (prev) {
if (props.numberOfMonths === 1 || groupIndex === 0) {
navigation.current = {
backward: true
};
navBackward(event);
} else {
var prevMonthContainer = 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 (props.numberOfMonths === 1 || groupIndex === props.numberOfMonths - 1) {
navigation.current = {
backward: false
};
navForward(event);
} else {
var nextMonthContainer = overlayRef.current.children[groupIndex + 1];
var _focusCell4 = DomHandler.findSingle(nextMonthContainer, '.p-datepicker-calendar td span:not(.p-disabled)');
_focusCell4.tabIndex = '0';
_focusCell4.focus();
}
}
};
var onDateSelect = function onDateSelect(event, dateMeta, timeMeta) {
if (props.disabled || !dateMeta.selectable) {
event.preventDefault();
return;
}
DomHandler.find(overlayRef.current, '.p-datepicker-calendar td span:not(.p-disabled)').forEach(function (cell) {
return cell.tabIndex = -1;
});
event.currentTarget.focus();
if (isMultipleSelection()) {
if (isSelected(dateMeta)) {
var value = props.value.filter(function (date, i) {
return !isDateEquals(date, dateMeta);
});
updateModel(event, value);
updateInputfield(value);
} else if (!props.maxDateCount || !props.value || props.maxDateCount > props.value.length) {
selectDate(event, dateMeta, timeMeta);
}
} else {
selectDate(event, dateMeta, timeMeta);
}
if (!props.inline && isSingleSelection() && (!props.showTime || props.hideOnDateTimeSelect)) {
setTimeout(function () {
hide('dateselect');
}, 100);
if (touchUIMask.current) {
disableModality();
}
}
event.preventDefault();
};
var selectTime = function selectTime(date, timeMeta) {
if (props.showTime) {
var hours, minutes, seconds, milliseconds;
if (timeMeta) {
hours = timeMeta.hours;
minutes = timeMeta.minutes;
seconds = timeMeta.seconds;
milliseconds = timeMeta.milliseconds;
} else {
var time = getCurrentDateTime();
var _ref2 = [time.getHours(), time.getMinutes(), time.getSeconds(), time.getMilliseconds()];
hours = _ref2[0];
minutes = _ref2[1];
seconds = _ref2[2];
milliseconds = _ref2[3];
}
date.setHours(hours);
date.setMinutes(minutes);
date.setSeconds(seconds);
date.setMilliseconds(milliseconds);
}
};
var selectDate = function selectDate(event, dateMeta, timeMeta) {
var date = new Date(dateMeta.year, dateMeta.month, dateMeta.day);
selectTime(date, timeMeta);
if (props.minDate && props.minDate > date) {
date = props.minDate;
}
if (props.maxDate && props.maxDate < date) {
date = props.maxDate;
}
var selectedValues = date;
if (isSingleSelection()) {
updateModel(event, date);
} else if (isMultipleSelection()) {
selectedValues = props.value ? [].concat(_toConsumableArray(props.value), [date]) : [date];
updateModel(event, selectedValues);
} else if (isRangeSelection()) {
if (props.value && props.value.length) {
var startDate = props.value[0];
var endDate = 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];
updateModel(event, selectedValues);
} else {
selectedValues = [date, null];
updateModel(event, selectedValues);
}
}
if (props.onSelect) {
props.onSelect({
originalEvent: event,
value: date
});
}
updateInputfield(selectedValues);
};
var decrementDecade = function decrementDecade() {
var _currentYear = currentYear - 10;
setCurrentYear(_currentYear);
return _currentYear;
};
var incrementDecade = function incrementDecade() {
var _currentYear = currentYear + 10;
setCurrentYear(_currentYear);
return _currentYear;
};
var switchToMonthView = function switchToMonthView(event) {
setCurrentView('month');
event.preventDefault();
};
var switchToYearView = function switchToYearView(event) {
setCurrentView('year');
event.preventDefault();
};
var onMonthSelect = function onMonthSelect(event, month) {
if (props.view === 'month') {
onDateSelect(event, {
year: currentYear,
month: month,
day: 1,
selectable: true
});
event.preventDefault();
} else {
setCurrentMonth(month);
createMonthsMeta(month, currentYear);
var currentDate = new Date(getCurrentDateTime().getTime());
currentDate.setDate(1); // #2948 always set to 1st of month
currentDate.setMonth(month);
currentDate.setYear(currentYear);
setViewDateState(currentDate);
setCurrentView('date');
props.onMonthChange && props.onMonthChange({
month: month + 1,
year: currentYear
});
}
};
var onYearSelect = function onYearSelect(event, year) {
if (props.view === 'year') {
onDateSelect(event, {
year: year,
month: 0,
day: 1,
selectable: true
});
} else {
setCurrentYear(year);
setCurrentView('month');
props.onMonthChange && props.onMonthChange({
month: currentMonth + 1,
year: year
});
}
};
var updateModel = function updateModel(event, value) {
if (props.onChange) {
var newValue = value && value instanceof Date ? new Date(value.getTime()) : value;
viewStateChanged.current = true;
props.onChange({
originalEvent: event,
value: newValue,
stopPropagation: function stopPropagation() {},
preventDefault: function preventDefault() {},
target: {
name: props.name,
id: props.id,
value: newValue
}
});
}
};
var show = function show(type) {
if (props.onVisibleChange) {
props.onVisibleChange({
visible: true,
type: type
});
} else {
setOverlayVisibleState(true);
overlayEventListener.current = function (e) {
if (!isOutsideClicked(e)) {
isOverlayClicked.current = true;
}
};
OverlayService.on('overlay-click', overlayEventListener.current);
}
};
var hide = function hide(type, callback) {
var _hideCallback = function _hideCallback() {
viewStateChanged.current = false;
ignoreFocusFunctionality.current = false;
isOverlayClicked.current = false;
callback && callback();
OverlayService.off('overlay-click', overlayEventListener.current);
overlayEventListener.current = null;
};
props.touchUI && disableModality();
if (props.onVisibleChange) {
props.onVisibleChange({
visible: false,
type: type,
callback: _hideCallback
});
} else {
setOverlayVisibleState(false);
_hideCallback();
}
};
var onOverlayEnter = function onOverlayEnter() {
if (props.autoZIndex) {
var key = props.touchUI ? 'modal' : 'overlay';
ZIndexUtils.set(key, overlayRef.current, PrimeReact.autoZIndex, props.baseZIndex || PrimeReact.zIndex[key]);
}
alignOverlay();
};
var onOverlayEntered = function onOverlayEntered() {
bindOverlayListener();
props.onShow && props.onShow();
};
var onOverlayExit = function onOverlayExit() {
unbindOverlayListener();
};
var onOverlayExited = function onOverlayExited() {
ZIndexUtils.clear(overlayRef.current);
props.onHide && props.onHide();
};
var appendDisabled = function appendDisabled() {
return props.appendTo === 'self' || props.inline;
};
var alignOverlay = function alignOverlay() {
if (props.touchUI) {
enableModality();
} else if (overlayRef && overlayRef.current && inputRef && inputRef.current) {
DomHandler.alignOverlay(overlayRef.current, inputRef.current, props.appendTo || PrimeReact.appendTo);
if (appendDisabled()) {
DomHandler.relativePosition(overlayRef.current, inputRef.current);
} else {
if (currentView === 'date') {
overlayRef.current.style.width = DomHandler.getOuterWidth(overlayRef.current) + 'px';
overlayRef.current.style.minWidth = DomHandler.getOuterWidth(inputRef.current) + 'px';
} else {
overlayRef.current.style.width = DomHandler.getOuterWidth(inputRef.current) + 'px';
}
DomHandler.absolutePosition(overlayRef.current, inputRef.current);
}
}
};
var enableModality = function enableModality() {
if (!touchUIMask.current) {
touchUIMask.current = document.createElement('div');
touchUIMask.current.style.zIndex = String(ZIndexUtils.get(overlayRef.current) - 1);
DomHandler.addMultipleClasses(touchUIMask.current, 'p-component-overlay p-datepicker-mask p-datepicker-mask-scrollblocker p-component-overlay-enter');
touchUIMaskClickListener.current = function () {
disableModality();
hide();
};
touchUIMask.current.addEventListener('click', touchUIMaskClickListener.current);
document.body.appendChild(touchUIMask.current);
DomHandler.addClass(document.body, 'p-overflow-hidden');
}
};
var disableModality = function disableModality() {
if (touchUIMask.current) {
DomHandler.addClass(touchUIMask.current, 'p-component-overlay-leave');
touchUIMask.current.addEventListener('animationend', function () {
destroyMask();
});
}
};
var destroyMask = function destroyMask() {
if (touchUIMask.current) {
touchUIMask.current.removeEventListener('click', touchUIMaskClickListener.current);
touchUIMaskClickListener.current = null;
document.body.removeChild(touchUIMask.current);
touchUIMask.current = 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');
}
};
var isOutsideClicked = function isOutsideClicked(event) {
return elementRef.current && !(elementRef.current.isSameNode(event.target) || isNavIconClicked(event.target) || elementRef.current.contains(event.target) || overlayRef.current && overlayRef.current.contains(event.target));
};
var isNavIconClicked = 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');
};
var getFirstDayOfMonthIndex = function getFirstDayOfMonthIndex(month, year) {
var day = new Date();
day.setDate(1);
day.setMonth(month);
day.setFullYear(year);
var dayIndex = day.getDay() + getSundayIndex();
return dayIndex >= 7 ? dayIndex - 7 : dayIndex;
};
var getDaysCountInMonth = function getDaysCountInMonth(month, year) {
return 32 - daylightSavingAdjust(new Date(year, month, 32)).getDate();
};
var getDaysCountInPrevMonth = function getDaysCountInPrevMonth(month, year) {
var prev = getPreviousMonthAndYear(month, year);
return getDaysCountInMonth(prev.month, prev.year);
};
var daylightSavingAdjust = function daylightSavingAdjust(date) {
if (!date) {
return null;
}
date.setHours(date.getHours() > 12 ? date.getHours() + 2 : 0);
return date;
};
var getPreviousMonthAndYear = 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
};
};
var getNextMonthAndYear = 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
};
};
var getSundayIndex = function getSundayIndex() {
var firstDayOfWeek = localeOption('firstDayOfWeek', props.locale);
return firstDayOfWeek > 0 ? 7 - firstDayOfWeek : 0;
};
var createWeekDaysMeta = function createWeekDaysMeta() {
var weekDays = [];
var _localeOptions = localeOptions(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;
};
var createMonthsMeta = function createMonthsMeta(month, year) {
var months = [];
for (var i = 0; i < props.numberOfMonths; i++) {
var m = month + i;
var y = year;
if (m > 11) {
m = m % 11 - 1;
y = year + 1;
}
months.push(createMonthMeta(m, y));
}
return months;
};
var createMonthMeta = function createMonthMeta(month, year) {
var dates = [];
var firstDay = getFirstDayOfMonthIndex(month, year);
var daysLength = getDaysCountInMonth(month, year);
var prevMonthDaysLength = 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 = getPreviousMonthAndYear(month, year);
week.push({
day: j,
month: prev.month,
year: prev.year,
otherMonth: true,
today: isToday(today, j, prev.month, prev.year),
selectable: 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: isToday(today, dayNo, month, year),
selectable: isSelectable(dayNo, month, year, false)
});
dayNo++;
}
} else {
for (var _j2 = 0; _j2 < 7; _j2++) {
if (dayNo > daysLength) {
var next = getNextMonthAndYear(month, year);
week.push({
day: dayNo - daysLength,
month: next.month,
year: next.year,
otherMonth: true,
today: isToday(today, dayNo - daysLength, next.month, next.year),
selectable: isSelectable(dayNo - daysLength, next.month, next.year, true)
});
} else {
week.push({
day: dayNo,
month: month,
year: year,
today: isToday(today, dayNo, month, year),
selectable: isSelectable(dayNo, month, year, false)
});
}
dayNo++;
}
}
if (props.showWeek) {
weekNumbers.push(getWeekNumber(new Date(week[0].year, week[0].month, week[0].day)));
}
dates.push(week);
}
return {
month: month,
year: year,
dates: dates,
weekNumbers: weekNumbers
};
};
var getWeekNumber = 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;
};
var isSelectable = function isSelectable(day, month, year, otherMonth) {
var validMin = true;
var validMax = true;
var validDate = true;
var validDay = true;
var validMonth = true;
if (props.minDate) {
if (props.minDate.getFullYear() > year) {
validMin = false;
} else if (props.minDate.getFullYear() === year) {
if (props.minDate.getMonth() > month) {
validMin = false;
} else if (props.minDate.getMonth() === month) {
if (day > 0 && props.minDate.getDate() > day) {
validMin = false;
}
}
}
}
if (props.maxDate) {
if (props.maxDate.getFullYear() < year) {
validMax = false;
} else if (props.maxDate.getFullYear() === year) {
if (props.maxDate.getMonth() < month) {
validMax = false;
} else if (props.maxDate.getMonth() === month) {
if (day > 0 && props.maxDate.getDate() < day) {
validMax = false;
}
}
}
}
if (props.disabledDates) {
validDate = !isDateDisabled(day, month, year);
}
if (props.disabledDays) {
validDay = !isDayDisabled(day, month, year);
}
if (props.selectOtherMonths === false && otherMonth) {
validMonth = false;
}
return validMin && validMax && validDate && validDay && validMonth;
};
var isSelectableTime = function isSelectableTime(value) {
var validMin = true;
var validMax = true;
if (props.minDate && props.minDate.toDateString() === value.toDateString()) {
if (props.minDate.getHours() > value.getHours()) {
validMin = false;
} else if (props.minDate.getHours() === value.getHours()) {
if (props.minDate.getMinutes() > value.getMinutes()) {
validMin = false;
} else if (props.minDate.getMinutes() === value.getMinutes()) {
if (props.minDate.getSeconds() > value.getSeconds()) {
validMin = false;
} else if (props.minDate.getSeconds() === value.getSeconds()) {
if (props.minDate.getMilliseconds() > value.getMilliseconds()) {
validMin = false;
}
}
}
}
}
if (props.maxDate && props.maxDate.toDateString() === value.toDateString()) {
if (props.maxDate.getHours() < value.getHours()) {
validMax = false;
} else if (props.maxDate.getHours() === value.getHours()) {
if (props.maxDate.getMinutes() < value.getMinutes()) {
validMax = false;
} else if (props.maxDate.getMinutes() === value.getMinutes()) {
if (props.maxDate.getSeconds() < value.getSeconds()) {
validMax = false;
} else if (props.maxDate.getSeconds() === value.getSeconds()) {
if (props.maxDate.getMilliseconds() < value.getMilliseconds()) {
validMax = false;
}
}
}
}
}
return validMin && validMax;
};
var isSelected = function isSelected(dateMeta) {
if (props.value) {
if (isSingleSelection()) {
return isDateEquals(props.value, dateMeta);
} else if (isMultipleSelection()) {
var selected = false;
var _iterator = _createForOfIteratorHelper$c(props.value),
_step;
try {
for (_iterator.s(); !(_step = _iterator.n()).done;) {
var date = _step.value;
selected = isDateEquals(date, dateMeta);
if (selected) {
break;
}
}
} catch (err) {
_iterator.e(err);
} finally {
_iterator.f();
}
return selected;
} else if (isRangeSelection()) {
if (props.value[1]) return isDateEquals(props.value[0], dateMeta) || isDateEquals(props.value[1], dateMeta) || isDateBetween(props.value[0], props.value[1], dateMeta);else {
return isDateEquals(props.value[0], dateMeta);
}
}
} else {
return false;
}
};
var isComparable = function isComparable() {
return props.value != null && typeof props.value !== 'string';
};
var isMonthSelected = function isMonthSelected(month) {
if (isComparable()) {
var value = isRangeSelection() ? props.value[0] : props.value;
return !isMultipleSelection() ? value.getMonth() === month && value.getFullYear() === currentYear : false;
}
return false;
};
var isYearSelected = function isYearSelected(year) {
if (isComparable()) {
var value = isRangeSelection() ? props.value[0] : props.value;
return !isMultipleSelection() && isComparable() ? value.getFullYear() === year : false;
}
return false;
};
var switchViewButtonDisabled = function switchViewButtonDisabled() {
return props.numberOfMonths > 1 || props.disabled;
};
var isDateEquals = 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;
};
var isDateBetween = 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;
};
var isSingleSelection = function isSingleSelection() {
return props.selectionMode === 'single';
};
var isRangeSelection = function isRangeSelection() {
return props.selectionMode === 'range';
};
var isMultipleSelection = function isMultipleSelection() {
return props.selectionMode === 'multiple';
};
var isToday = function isToday(today, day, month, year) {
return today.getDate() === day && today.getMonth() === month && today.getFullYear() === year;
};
var isDateDisabled = function isDateDisabled(day, month, year) {
return props.disabledDates ? props.disabledDates.some(function (d) {
return d.getFullYear() === year && d.getMonth() === month && d.getDate() === day;
}) : false;
};
var isDayDisabled = function isDayDisabled(day, month, year) {
if (props.disabledDays) {
var weekday = new Date(year, month, day);
var weekdayNumber = weekday.getDay();
return props.disabledDays.indexOf(weekdayNumber) !== -1;
}
return false;
};
var updateInputfield = function updateInputfield(value) {
if (!inputRef.current) {
return;
}
var formattedValue = '';
if (value) {
try {
if (isSingleSelection()) {
formattedValue = isValidDate(value) ? formatDateTime(value) : props.keepInvalid ? value : '';
} else if (isMultipleSelection()) {
for (var i = 0; i < value.length; i++) {
var selectedValue = value[i];
var dateAsString = isValidDate(selectedValue) ? formatDateTime(selectedValue) : '';
formattedValue += dateAsString;
if (i !== value.length - 1) {
formattedValue += ', ';
}
}
} else if (isRangeSelection()) {
if (value && value.length) {
var startDate = value[0];
var endDate = value[1];
formattedValue = isValidDate(startDate) ? formatDateTime(startDate) : '';
if (endDate) {
formattedValue += isValidDate(endDate) ? ' - ' + formatDateTime(endDate) : '';
}
}
}
} catch (err) {
formattedValue = value;
}
}
inputRef.current.value = formattedValue;
};
var formatDateTime = function formatDateTime(date) {
if (props.formatDateTime) {
return props.formatDateTime(date);
}
var formattedValue = null;
if (date) {
if (props.timeOnly) {
formattedValue = formatTime(date);
} else {
formattedValue = formatDate(date, getDateFormat());
if (props.showTime) {
formattedValue += ' ' + formatTime(date);
}
}
}
return formattedValue;
};
var formatDate = 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(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 + ticksTo1970;
break;
case "'":
if (lookAhead("'")) {
output += "'";
} else {
literal = true;
}
break;
default:
output += format.charAt(iFormat);
}
}
}
}
return output;
};
var formatTime = 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 (props.hourFormat === '12' && hours > 11 && hours !== 12) {
hours -= 12;
}
if (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 (props.showSeconds) {
output += ':';
output += seconds < 10 ? '0' + seconds : seconds;
}
if (props.showMillisec) {
output += '.';
output += milliseconds < 100 ? (milliseconds < 10 ? '00' : '0') + milliseconds : milliseconds;
}
if (props.hourFormat === '12') {
output += date.getHours() > 11 ? ' PM' : ' AM';
}
return output;
};
var parseValueFromString = function parseValueFromString(text) {
if (!text || text.trim().length === 0) {
return null;
}
var value;
if (isSingleSelection()) {
value = parseDateTime(text);
} else if (isMultipleSelection()) {
var tokens = text.split(',');
value = [];
var _iterator2 = _createForOfIteratorHelper$c(tokens),
_step2;
try {
for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
var token = _step2.value;
value.push(parseDateTime(token.trim()));
}
} catch (err) {
_iterator2.e(err);
} finally {
_iterator2.f();
}
} else if (isRangeSelection()) {
var _tokens = text.split(' - ');
value = [];
for (var i = 0; i < _tokens.length; i++) {
value[i] = parseDateTime(_tokens[i].trim());
}
}
return value;
};
var parseDateTime = function parseDateTime(text) {
if (props.parseDateTime) {
return props.parseDateTime(text);
}
var date;
var parts = text.split(' ');
if (props.timeOnly) {
date = new Date();
populateTime(date, parts[0], parts[1]);
} else {
if (props.showTime) {
date = parseDate(parts[0], getDateFormat());
populateTime(date, parts[1], parts[2]);
} else {
date = parseDate(text, getDateFormat());
}
}
return date;
};
var populateTime = function populateTime(value, timeString, ampm) {
if (props.hourFormat === '12' && ampm !== 'PM' && ampm !== 'AM') {
throw new Error('Invalid Time');
}
var time = parseTime(timeString, ampm);
value.setHours(time.hour);
value.setMinutes(time.minute);
value.setSeconds(time.second);
value.setMilliseconds(time.millisecond);
};
var parseTime = function parseTime(value, ampm) {
value = props.showMillisec ? value.replace('.', ':') : value;
var tokens = value.split(':');
var validTokenLength = props.showSeconds ? 3 : 2;
validTokenLength = props.showMillisec ? validTokenLength + 1 : validTokenLength;
if (tokens.length !== validTokenLength || tokens[0].length !== 2 || tokens[1].length !== 2 || props.showSeconds && tokens[2].length !== 2 || 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 = props.showSeconds ? parseInt(tokens[2], 10) : null;
var ms = props.showMillisec ? parseInt(tokens[3], 10) : null;
if (isNaN(h) || isNaN(m) || h > 23 || m > 59 || props.hourFormat === '12' && h > 12 || props.showSeconds && (isNaN(s) || s > 59) || props.showMillisec && (isNaN(s) || s > 1000)) {
throw new Error('Invalid time');
} else {
if (props.hourFormat === '12' && h !== 12 && ampm === 'PM') {
h += 12;
}
return {
hour: h,
minute: m,
second: s,
millisecond: ms
};
}
};
// Ported from jquery-ui datepicker parseDate
var parseDate = 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 props.shortYearCutoff !== 'string' ? props.shortYearCutoff : new Date().getFullYear() % 100 + parseInt(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 (props.view === 'month') {
day = 1;
}
var _localeOptions3 = localeOptions(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('!') - 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 = getDaysCountInMonth(year, month - 1);
if (day <= dim) {
break;
}
month++;
day -= dim;
} while (true);
}
date = 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;
};
var isInMinYear = function isInMinYear(viewDate) {
return props.minDate && props.minDate.getFullYear() === viewDate.getFullYear();
};
var isInMaxYear = function isInMaxYear(viewDate) {
return props.maxDate && props.maxDate.getFullYear() === viewDate.getFullYear();
};
React__namespace.useEffect(function () {
ObjectUtils.combinedRefs(inputRef, props.inputRef);
}, [inputRef, props.inputRef]);
useMountEffect(function () {
var unbindMaskEvents = null;
var viewDate = getViewDate(props.viewDate);
validateDate(viewDate);
setViewDateState(viewDate);
setCurrentMonth(viewDate.getMonth());
setCurrentYear(viewDate.getFullYear());
setCurrentView(props.view);
if (props.inline) {
overlayRef && overlayRef.current.setAttribute(attributeSelector, '');
if (!props.disabled) {
initFocusableCell();
if (props.numberOfMonths === 1) {
overlayRef.current.style.width = DomHandler.getOuterWidth(overlayRef.current) + 'px';
}
}
} else if (props.mask) {
unbindMaskEvents = mask(inputRef.current, {
mask: props.mask,
readOnly: props.readOnlyInput || props.disabled,
onChange: function onChange(e) {
!ignoreMaskChange.current && updateValueOnInput(e.originalEvent, e.value);
ignoreMaskChange.current = false;
},
onBlur: function onBlur() {
ignoreMaskChange.current = true;
}
}).unbindEvents;
}
if (props.value) {
updateInputfield(props.value);
setValue(props.value);
}
return function () {
props.mask && unbindMaskEvents && unbindMaskEvents();
};
});
useUpdateEffect(function () {
setCurrentView(props.view);
}, [props.view]);
useUpdateEffect(function () {
if (!props.onViewDateChange && !viewStateChanged.current) {
setValue(props.value);
}
}, [props.onViewDateChange, props.value]);
useUpdateEffect(function () {
var newDate = props.value;
if (previousValue !== newDate) {
updateInputfield(newDate);
// #3516 view date not updated when value set programatically
if (!visible && newDate) {
var viewDate = newDate;
if (isMultipleSelection()) {
if (newDate.length) {
viewDate = newDate[newDate.length - 1];
}
} else if (isRangeSelection()) {
if (newDate.length) {
var startDate = newDate[0];
var endDate = newDate[1];
viewDate = endDate || startDate;
}
}
if (viewDate instanceof Date) {
validateDate(viewDate);
setViewDateState(viewDate);
setCurrentMonth(viewDate.getMonth());
setCurrentYear(viewDate.getFullYear());
}
}
}
}, [props.value, visible]);
useUpdateEffect(function () {
updateInputfield(props.value);
}, [props.dateFormat, props.hourFormat, props.timeOnly, props.showSeconds, props.showMillisec]);
useUpdateEffect(function () {
if (overlayRef.current) {
setNavigationState(viewDateState);
updateFocus();
}
});
useUnmountEffect(function () {
if (touchUIMask.current) {
disableModality();
touchUIMask.current = null;
}
ZIndexUtils.clear(overlayRef.current);
});
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
show: show,
hide: hide,
getCurrentDateTime: getCurrentDateTime,
getViewDate: getViewDate,
updateViewDate: updateViewDate,
focus: function focus() {
return DomHandler.focus(inputRef.current);
},
getElement: function getElement() {
return elementRef.current;
},
getOverlay: function getOverlay() {
return overlayRef.current;
},
getInput: function getInput() {
return inputRef.current;
}
};
});
var setValue = function setValue(propValue) {
if (Array.isArray(propValue)) {
propValue = propValue[0];
}
var prevPropValue = previousValue;
if (Array.isArray(prevPropValue)) {
prevPropValue = prevPropValue[0];
}
if (!prevPropValue && propValue || propValue && propValue instanceof Date && propValue.getTime() !== prevPropValue.getTime()) {
var viewDate = props.viewDate && isValidDate(props.viewDate) ? props.viewDate : propValue && isValidDate(propValue) ? propValue : new Date();
validateDate(viewDate);
setViewDateState(viewDate);
viewStateChanged.current = true;
}
};
var createBackwardNavigator = function createBackwardNavigator(isVisible) {
var navigatorProps = isVisible ? {
onClick: onPrevButtonClick,
onKeyDown: function onKeyDown(e) {
return onContainerButtonKeydown(e);
}
} : {
style: {
visibility: 'hidden'
}
};
return /*#__PURE__*/React__namespace.createElement("button", _extends({
type: "button",
className: "p-datepicker-prev"
}, navigatorProps), /*#__PURE__*/React__namespace.createElement("span", {
className: "p-datepicker-prev-icon pi pi-chevron-left"
}), /*#__PURE__*/React__namespace.createElement(Ripple, null));
};
var createForwardNavigator = function createForwardNavigator(isVisible) {
var navigatorProps = isVisible ? {
onClick: onNextButtonClick,
onKeyDown: function onKeyDown(e) {
return onContainerButtonKeydown(e);
}
} : {
style: {
visibility: 'hidden'
}
};
return /*#__PURE__*/React__namespace.createElement("button", _extends({
type: "button",
className: "p-datepicker-next"
}, navigatorProps), /*#__PURE__*/React__namespace.createElement("span", {
className: "p-datepicker-next-icon pi pi-chevron-right"
}), /*#__PURE__*/React__namespace.createElement(Ripple, null));
};
var createTitleMonthElement = function createTitleMonthElement(month) {
var monthNames = localeOption('monthNames', props.locale);
if (props.monthNavigator && props.view !== 'month') {
var viewDate = getViewDate();
var viewMonth = viewDate.getMonth();
var displayedMonthOptions = monthNames.map(function (month, index) {
return (!isInMinYear(viewDate) || index >= props.minDate.getMonth()) && (!isInMaxYear(viewDate) || index <= 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__namespace.createElement("select", {
className: "p-datepicker-month",
onChange: function onChange(e) {
return onMonthDropdownChange(e, e.target.value);
},
value: viewMonth
}, displayedMonthOptions.map(function (option) {
return /*#__PURE__*/React__namespace.createElement("option", {
key: option.label,
value: option.value
}, option.label);
}));
if (props.monthNavigatorTemplate) {
var defaultContentOptions = {
onChange: onMonthDropdownChange,
className: 'p-datepicker-month',
value: viewMonth,
names: displayedMonthNames,
options: displayedMonthOptions,
element: _content,
props: props
};
return ObjectUtils.getJSXElement(props.monthNavigatorTemplate, defaultContentOptions);
}
return _content;
}
return currentView === 'date' && /*#__PURE__*/React__namespace.createElement("button", {
className: "p-datepicker-month p-link",
onClick: switchToMonthView,
disabled: switchViewButtonDisabled()
}, monthNames[month]);
};
var createTitleYearElement = function createTitleYearElement(metaYear) {
if (props.yearNavigator) {
var _yearOptions2 = [];
var years = props.yearRange.split(':');
var yearStart = parseInt(years[0], 10);
var yearEnd = parseInt(years[1], 10);
for (var i = yearStart; i <= yearEnd; i++) {
_yearOptions2.push(i);
}
var viewDate = getViewDate();
var viewYear = viewDate.getFullYear();
var displayedYearNames = _yearOptions2.filter(function (year) {
return !(props.minDate && props.minDate.getFullYear() > year) && !(props.maxDate && props.maxDate.getFullYear() < year);
});
var _content2 = /*#__PURE__*/React__namespace.createElement("select", {
className: "p-datepicker-year",
onChange: function onChange(e) {
return onYearDropdownChange(e, e.target.value);
},
value: viewYear
}, displayedYearNames.map(function (year) {
return /*#__PURE__*/React__namespace.createElement("option", {
key: year,
value: year
}, year);
}));
if (props.yearNavigatorTemplate) {
var options = displayedYearNames.map(function (name, i) {
return {
label: name,
value: name,
index: i
};
});
var defaultContentOptions = {
onChange: onYearDropdownChange,
className: 'p-datepicker-year',
value: viewYear,
names: displayedYearNames,
options: options,
element: _content2,
props: props
};
return ObjectUtils.getJSXElement(props.yearNavigatorTemplate, defaultContentOptions);
}
return _content2;
}
var displayYear = props.numberOfMonths > 1 ? metaYear : currentYear;
return currentView !== 'year' && /*#__PURE__*/React__namespace.createElement("button", {
className: "p-datepicker-year p-link",
onClick: switchToYearView,
disabled: switchViewButtonDisabled()
}, displayYear);
};
var createTitleDecadeElement = function createTitleDecadeElement() {
var years = yearPickerValues();
if (currentView === 'year') {
return /*#__PURE__*/React__namespace.createElement("span", {
className: "p-datepicker-decade"
}, props.decadeTemplate ? props.decadeTemplate(years) : /*#__PURE__*/React__namespace.createElement("span", null, "".concat(yearPickerValues()[0], " - ").concat(yearPickerValues()[yearPickerValues().length - 1])));
}
return null;
};
var createTitle = function createTitle(monthMetaData) {
var month = createTitleMonthElement(monthMetaData.month);
var year = createTitleYearElement(monthMetaData.year);
var decade = createTitleDecadeElement();
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-datepicker-title"
}, month, year, decade);
};
var createDayNames = function createDayNames(weekDays) {
var dayNames = weekDays.map(function (weekDay, index) {
return /*#__PURE__*/React__namespace.createElement("th", {
key: "".concat(weekDay, "-").concat(index),
scope: "col"
}, /*#__PURE__*/React__namespace.createElement("span", null, weekDay));
});
if (props.showWeek) {
var weekHeader = /*#__PURE__*/React__namespace.createElement("th", {
scope: "col",
key: "wn",
className: "p-datepicker-weekheader p-disabled"
}, /*#__PURE__*/React__namespace.createElement("span", null, localeOption('weekHeader', props.locale)));
return [weekHeader].concat(_toConsumableArray(dayNames));
}
return dayNames;
};
var createDateCellContent = function createDateCellContent(date, className, groupIndex) {
var content = props.dateTemplate ? props.dateTemplate(date) : date.day;
return /*#__PURE__*/React__namespace.createElement("span", {
className: className,
onClick: function onClick(e) {
return onDateSelect(e, date);
},
onKeyDown: function onKeyDown(e) {
return onDateCellKeydown(e, date, groupIndex);
}
}, content, /*#__PURE__*/React__namespace.createElement(Ripple, null));
};
var createWeek = function createWeek(weekDates, weekNumber, groupIndex) {
var week = weekDates.map(function (date) {
var selected = 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 && !props.showOtherMonths ? null : createDateCellContent(date, dateClassName, groupIndex);
return /*#__PURE__*/React__namespace.createElement("td", {
key: date.day,
className: cellClassName
}, content);
});
if (props.showWeek) {
var weekNumberCell = /*#__PURE__*/React__namespace.createElement("td", {
key: 'wn' + weekNumber,
className: "p-datepicker-weeknumber"
}, /*#__PURE__*/React__namespace.createElement("span", {
className: "p-disabled"
}, weekNumber));
return [weekNumberCell].concat(_toConsumableArray(week));
}
return week;
};
var createDates = function createDates(monthMetaData, groupIndex) {
return monthMetaData.dates.map(function (weekDates, index) {
return /*#__PURE__*/React__namespace.createElement("tr", {
key: index
}, createWeek(weekDates, monthMetaData.weekNumbers[index], groupIndex));
});
};
var createDateViewGrid = function createDateViewGrid(monthMetaData, weekDays, groupIndex) {
var dayNames = createDayNames(weekDays);
var dates = createDates(monthMetaData, groupIndex);
return currentView === 'date' && /*#__PURE__*/React__namespace.createElement("div", {
className: "p-datepicker-calendar-container"
}, /*#__PURE__*/React__namespace.createElement("table", {
className: "p-datepicker-calendar"
}, /*#__PURE__*/React__namespace.createElement("thead", null, /*#__PURE__*/React__namespace.createElement("tr", null, dayNames)), /*#__PURE__*/React__namespace.createElement("tbody", null, dates)));
};
var createMonth = function createMonth(monthMetaData, index) {
var weekDays = createWeekDaysMeta();
var backwardNavigator = createBackwardNavigator(index === 0);
var forwardNavigator = createForwardNavigator(props.numberOfMonths === 1 || index === props.numberOfMonths - 1);
var title = createTitle(monthMetaData);
var dateViewGrid = createDateViewGrid(monthMetaData, weekDays, index);
var header = props.headerTemplate ? props.headerTemplate() : null;
return /*#__PURE__*/React__namespace.createElement("div", {
key: monthMetaData.month,
className: "p-datepicker-group"
}, /*#__PURE__*/React__namespace.createElement("div", {
className: "p-datepicker-header"
}, header, backwardNavigator, title, forwardNavigator), dateViewGrid);
};
var createMonths = function createMonths(monthsMetaData) {
var groups = monthsMetaData.map(createMonth);
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-datepicker-group-container"
}, groups);
};
var createDateView = function createDateView() {
var viewDate = getViewDate();
var monthsMetaData = createMonthsMeta(viewDate.getMonth(), viewDate.getFullYear());
var months = createMonths(monthsMetaData);
return months;
};
var monthPickerValues = function monthPickerValues() {
var monthPickerValues = [];
var monthNamesShort = localeOption('monthNamesShort', props.locale);
for (var i = 0; i <= 11; i++) {
monthPickerValues.push(monthNamesShort[i]);
}
return monthPickerValues;
};
var yearPickerValues = function yearPickerValues() {
var yearPickerValues = [];
var base = currentYear - currentYear % 10;
for (var i = 0; i < 10; i++) {
yearPickerValues.push(base + i);
}
return yearPickerValues;
};
var createMonthYearView = function createMonthYearView() {
var backwardNavigator = createBackwardNavigator(true);
var forwardNavigator = createForwardNavigator(true);
var yearElement = createTitleYearElement(getViewDate().getFullYear());
var decade = createTitleDecadeElement();
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement("div", {
className: "p-datepicker-group-container"
}, /*#__PURE__*/React__namespace.createElement("div", {
className: "p-datepicker-group"
}, /*#__PURE__*/React__namespace.createElement("div", {
className: "p-datepicker-header"
}, backwardNavigator, /*#__PURE__*/React__namespace.createElement("div", {
className: "p-datepicker-title"
}, yearElement, decade), forwardNavigator))));
};
var createDatePicker = function createDatePicker() {
if (!props.timeOnly) {
if (props.view === 'date') {
return createDateView();
} else {
return createMonthYearView();
}
}
return null;
};
var createHourPicker = function createHourPicker() {
var currentTime = getCurrentDateTime();
var minute = doStepMinute(currentTime.getMinutes());
var hour = currentTime.getHours();
// #3770 account for step minutes rolling to next hour
hour = minute > 59 ? hour + 1 : hour;
if (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__namespace.createElement("div", {
className: "p-hour-picker"
}, /*#__PURE__*/React__namespace.createElement("button", {
type: "button",
className: "p-link",
onMouseDown: function onMouseDown(e) {
return onTimePickerElementMouseDown(e, 0, 1);
},
onMouseUp: onTimePickerElementMouseUp,
onMouseLeave: onTimePickerElementMouseLeave,
onKeyDown: function onKeyDown(e) {
return onContainerButtonKeydown(e);
}
}, /*#__PURE__*/React__namespace.createElement("span", {
className: "pi pi-chevron-up"
}), /*#__PURE__*/React__namespace.createElement(Ripple, null)), /*#__PURE__*/React__namespace.createElement("span", null, hourDisplay), /*#__PURE__*/React__namespace.createElement("button", {
type: "button",
className: "p-link",
onMouseDown: function onMouseDown(e) {
return onTimePickerElementMouseDown(e, 0, -1);
},
onMouseUp: onTimePickerElementMouseUp,
onMouseLeave: onTimePickerElementMouseLeave,
onKeyDown: function onKeyDown(e) {
return onContainerButtonKeydown(e);
}
}, /*#__PURE__*/React__namespace.createElement("span", {
className: "pi pi-chevron-down"
}), /*#__PURE__*/React__namespace.createElement(Ripple, null)));
};
var createMinutePicker = function createMinutePicker() {
var currentTime = getCurrentDateTime();
var minute = doStepMinute(currentTime.getMinutes());
minute = minute > 59 ? minute - 60 : minute;
var minuteDisplay = minute < 10 ? '0' + minute : minute;
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-minute-picker"
}, /*#__PURE__*/React__namespace.createElement("button", {
type: "button",
className: "p-link",
onMouseDown: function onMouseDown(e) {
return onTimePickerElementMouseDown(e, 1, 1);
},
onMouseUp: onTimePickerElementMouseUp,
onMouseLeave: onTimePickerElementMouseLeave,
onKeyDown: function onKeyDown(e) {
return onContainerButtonKeydown(e);
}
}, /*#__PURE__*/React__namespace.createElement("span", {
className: "pi pi-chevron-up"
}), /*#__PURE__*/React__namespace.createElement(Ripple, null)), /*#__PURE__*/React__namespace.createElement("span", null, minuteDisplay), /*#__PURE__*/React__namespace.createElement("button", {
type: "button",
className: "p-link",
onMouseDown: function onMouseDown(e) {
return onTimePickerElementMouseDown(e, 1, -1);
},
onMouseUp: onTimePickerElementMouseUp,
onMouseLeave: onTimePickerElementMouseLeave,
onKeyDown: function onKeyDown(e) {
return onContainerButtonKeydown(e);
}
}, /*#__PURE__*/React__namespace.createElement("span", {
className: "pi pi-chevron-down"
}), /*#__PURE__*/React__namespace.createElement(Ripple, null)));
};
var createSecondPicker = function createSecondPicker() {
if (props.showSeconds) {
var currentTime = getCurrentDateTime();
var second = currentTime.getSeconds();
var secondDisplay = second < 10 ? '0' + second : second;
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-second-picker"
}, /*#__PURE__*/React__namespace.createElement("button", {
type: "button",
className: "p-link",
onMouseDown: function onMouseDown(e) {
return onTimePickerElementMouseDown(e, 2, 1);
},
onMouseUp: onTimePickerElementMouseUp,
onMouseLeave: onTimePickerElementMouseLeave,
onKeyDown: function onKeyDown(e) {
return onContainerButtonKeydown(e);
}
}, /*#__PURE__*/React__namespace.createElement("span", {
className: "pi pi-chevron-up"
}), /*#__PURE__*/React__namespace.createElement(Ripple, null)), /*#__PURE__*/React__namespace.createElement("span", null, secondDisplay), /*#__PURE__*/React__namespace.createElement("button", {
type: "button",
className: "p-link",
onMouseDown: function onMouseDown(e) {
return onTimePickerElementMouseDown(e, 2, -1);
},
onMouseUp: onTimePickerElementMouseUp,
onMouseLeave: onTimePickerElementMouseLeave,
onKeyDown: function onKeyDown(e) {
return onContainerButtonKeydown(e);
}
}, /*#__PURE__*/React__namespace.createElement("span", {
className: "pi pi-chevron-down"
}), /*#__PURE__*/React__namespace.createElement(Ripple, null)));
}
return null;
};
var createMiliSecondPicker = function createMiliSecondPicker() {
if (props.showMillisec) {
var currentTime = getCurrentDateTime();
var millisecond = currentTime.getMilliseconds();
var millisecondDisplay = millisecond < 100 ? (millisecond < 10 ? '00' : '0') + millisecond : millisecond;
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-millisecond-picker"
}, /*#__PURE__*/React__namespace.createElement("button", {
type: "button",
className: "p-link",
onMouseDown: function onMouseDown(e) {
return onTimePickerElementMouseDown(e, 3, 1);
},
onMouseUp: onTimePickerElementMouseUp,
onMouseLeave: onTimePickerElementMouseLeave,
onKeyDown: function onKeyDown(e) {
return onContainerButtonKeydown(e);
}
}, /*#__PURE__*/React__namespace.createElement("span", {
className: "pi pi-chevron-up"
}), /*#__PURE__*/React__namespace.createElement(Ripple, null)), /*#__PURE__*/React__namespace.createElement("span", null, millisecondDisplay), /*#__PURE__*/React__namespace.createElement("button", {
type: "button",
className: "p-link",
onMouseDown: function onMouseDown(e) {
return onTimePickerElementMouseDown(e, 3, -1);
},
onMouseUp: onTimePickerElementMouseUp,
onMouseLeave: onTimePickerElementMouseLeave,
onKeyDown: function onKeyDown(e) {
return onContainerButtonKeydown(e);
}
}, /*#__PURE__*/React__namespace.createElement("span", {
className: "pi pi-chevron-down"
}), /*#__PURE__*/React__namespace.createElement(Ripple, null)));
}
return null;
};
var createAmPmPicker = function createAmPmPicker() {
if (props.hourFormat === '12') {
var currentTime = getCurrentDateTime();
var hour = currentTime.getHours();
var display = hour > 11 ? 'PM' : 'AM';
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-ampm-picker"
}, /*#__PURE__*/React__namespace.createElement("button", {
type: "button",
className: "p-link",
onClick: toggleAmPm
}, /*#__PURE__*/React__namespace.createElement("span", {
className: "pi pi-chevron-up"
}), /*#__PURE__*/React__namespace.createElement(Ripple, null)), /*#__PURE__*/React__namespace.createElement("span", null, display), /*#__PURE__*/React__namespace.createElement("button", {
type: "button",
className: "p-link",
onClick: toggleAmPm
}, /*#__PURE__*/React__namespace.createElement("span", {
className: "pi pi-chevron-down"
}), /*#__PURE__*/React__namespace.createElement(Ripple, null)));
}
return null;
};
var createSeparator = function createSeparator(separator) {
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-separator"
}, /*#__PURE__*/React__namespace.createElement("span", null, separator));
};
var createTimePicker = function createTimePicker() {
if ((props.showTime || props.timeOnly) && currentView === 'date') {
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-timepicker"
}, createHourPicker(), createSeparator(':'), createMinutePicker(), props.showSeconds && createSeparator(':'), createSecondPicker(), props.showMillisec && createSeparator('.'), createMiliSecondPicker(), props.hourFormat === '12' && createSeparator(':'), createAmPmPicker());
}
return null;
};
var createInputElement = function createInputElement() {
if (!props.inline) {
return /*#__PURE__*/React__namespace.createElement(InputText, {
ref: inputRef,
id: props.inputId,
name: props.name,
type: "text",
className: props.inputClassName,
style: props.inputStyle,
readOnly: props.readOnlyInput,
disabled: props.disabled,
required: props.required,
autoComplete: "off",
placeholder: props.placeholder,
tabIndex: props.tabIndex,
onInput: onUserInput,
onFocus: onInputFocus,
onBlur: onInputBlur,
onKeyDown: onInputKeyDown,
"aria-labelledby": props.ariaLabelledBy,
inputMode: props.inputMode,
tooltip: props.tooltip,
tooltipOptions: props.tooltipOptions
});
}
return null;
};
var createButton = function createButton() {
if (props.showIcon) {
return /*#__PURE__*/React__namespace.createElement(Button, {
type: "button",
icon: props.icon,
onClick: onButtonClick,
tabIndex: "-1",
disabled: props.disabled,
className: "p-datepicker-trigger"
});
}
return null;
};
var createContent = function createContent() {
var input = createInputElement();
var button = createButton();
if (props.iconPos === 'left') {
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, button, input);
}
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, input, button);
};
var createButtonBar = function createButtonBar() {
if (props.showButtonBar) {
var todayClassName = classNames('p-button-text', props.todayButtonClassName);
var clearClassName = classNames('p-button-text', props.clearButtonClassName);
var _localeOptions4 = localeOptions(props.locale),
today = _localeOptions4.today,
clear = _localeOptions4.clear;
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-datepicker-buttonbar"
}, /*#__PURE__*/React__namespace.createElement(Button, {
type: "button",
label: today,
onClick: onTodayButtonClick,
onKeyDown: function onKeyDown(e) {
return onContainerButtonKeydown(e);
},
className: todayClassName
}), /*#__PURE__*/React__namespace.createElement(Button, {
type: "button",
label: clear,
onClick: onClearButtonClick,
onKeyDown: function onKeyDown(e) {
return onContainerButtonKeydown(e);
},
className: clearClassName
}));
}
return null;
};
var createFooter = function createFooter() {
if (props.footerTemplate) {
var _content3 = props.footerTemplate();
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-datepicker-footer"
}, _content3);
}
return null;
};
var createMonthPicker = function createMonthPicker() {
if (currentView === 'month') {
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-monthpicker"
}, monthPickerValues().map(function (m, i) {
return /*#__PURE__*/React__namespace.createElement("span", {
onClick: function onClick(event) {
return onMonthSelect(event, i);
},
key: "month".concat(i + 1),
className: classNames('p-monthpicker-month', {
'p-highlight': isMonthSelected(i),
'p-disabled': !isSelectable(0, i, currentYear)
})
}, m);
}));
}
return null;
};
var createYearPicker = function createYearPicker() {
if (currentView === 'year') {
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-yearpicker"
}, yearPickerValues().map(function (y, i) {
return /*#__PURE__*/React__namespace.createElement("span", {
onClick: function onClick(event) {
return onYearSelect(event, y);
},
key: "year".concat(i + 1),
className: classNames('p-yearpicker-year', {
'p-highlight': isYearSelected(y),
'p-disabled': !(isSelectable(0, 0, y) || isSelectable(30, 11, y))
})
}, y);
}));
}
return null;
};
var otherProps = CalendarBase.getOtherProps(props);
var className = classNames('p-calendar p-component p-inputwrapper', props.className, (_classNames = {}, _defineProperty(_classNames, "p-calendar-w-btn p-calendar-w-btn-".concat(props.iconPos), props.showIcon), _defineProperty(_classNames, 'p-calendar-disabled', props.disabled), _defineProperty(_classNames, 'p-calendar-timeonly', props.timeOnly), _defineProperty(_classNames, 'p-inputwrapper-filled', props.value || DomHandler.hasClass(inputRef.current, 'p-filled') && inputRef.current.value !== ''), _defineProperty(_classNames, 'p-inputwrapper-focus', focusedState), _classNames));
var panelClassName = classNames('p-datepicker p-component', props.panelClassName, {
'p-datepicker-inline': props.inline,
'p-disabled': props.disabled,
'p-datepicker-timeonly': props.timeOnly,
'p-datepicker-multiple-month': props.numberOfMonths > 1,
'p-datepicker-monthpicker': currentView === 'month',
'p-datepicker-touch-ui': props.touchUI,
'p-input-filled': PrimeReact.inputStyle === 'filled',
'p-ripple-disabled': PrimeReact.ripple === false
});
var content = createContent();
var datePicker = createDatePicker();
var timePicker = createTimePicker();
var buttonBar = createButtonBar();
var footer = createFooter();
var monthPicker = createMonthPicker();
var yearPicker = createYearPicker();
return /*#__PURE__*/React__namespace.createElement("span", _extends({
ref: elementRef,
id: props.id,
className: className,
style: props.style
}, otherProps), content, /*#__PURE__*/React__namespace.createElement(CalendarPanel, {
ref: overlayRef,
className: panelClassName,
style: props.panelStyle,
appendTo: props.appendTo,
inline: props.inline,
onClick: onPanelClick,
onMouseUp: onPanelMouseUp,
"in": visible,
onEnter: onOverlayEnter,
onEntered: onOverlayEntered,
onExit: onOverlayExit,
onExited: onOverlayExited,
transitionOptions: props.transitionOptions
}, datePicker, timePicker, monthPicker, yearPicker, buttonBar, footer));
}));
Calendar.displayName = 'Calendar';
var CardBase = {
defaultProps: {
__TYPE: 'Card',
id: null,
header: null,
footer: null,
title: null,
subTitle: null,
style: null,
className: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, CardBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, CardBase.defaultProps);
}
};
var Card = /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = CardBase.getProps(inProps);
var elementRef = React__namespace.useRef(ref);
var createHeader = function createHeader() {
if (props.header) {
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-card-header"
}, ObjectUtils.getJSXElement(props.header, props));
}
return null;
};
var createBody = function createBody() {
var title = props.title && /*#__PURE__*/React__namespace.createElement("div", {
className: "p-card-title"
}, ObjectUtils.getJSXElement(props.title, props));
var subTitle = props.subTitle && /*#__PURE__*/React__namespace.createElement("div", {
className: "p-card-subtitle"
}, ObjectUtils.getJSXElement(props.subTitle, props));
var children = props.children && /*#__PURE__*/React__namespace.createElement("div", {
className: "p-card-content"
}, props.children);
var footer = props.footer && /*#__PURE__*/React__namespace.createElement("div", {
className: "p-card-footer"
}, ObjectUtils.getJSXElement(props.footer, props));
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-card-body"
}, title, subTitle, children, footer);
};
React__namespace.useEffect(function () {
ObjectUtils.combinedRefs(elementRef, ref);
}, [elementRef, ref]);
var otherProps = CardBase.getOtherProps(props);
var className = classNames('p-card p-component', props.className);
var header = createHeader();
var body = createBody();
return /*#__PURE__*/React__namespace.createElement("div", _extends({
id: props.id,
ref: elementRef,
className: className,
style: props.style
}, otherProps), header, body);
});
Card.displayName = 'Card';
var CarouselBase = {
defaultProps: {
__TYPE: 'Carousel',
id: null,
value: null,
page: 0,
header: null,
footer: null,
style: null,
className: null,
itemTemplate: null,
circular: false,
showIndicators: true,
showNavigators: true,
autoplayInterval: 0,
numVisible: 1,
numScroll: 1,
responsiveOptions: null,
orientation: 'horizontal',
verticalViewPortHeight: '300px',
contentClassName: null,
containerClassName: null,
indicatorsContentClassName: null,
onPageChange: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, CarouselBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, CarouselBase.defaultProps);
}
};
var CarouselItem = /*#__PURE__*/React__namespace.memo(function (props) {
var content = props.template(props.item);
var className = classNames(props.className, 'p-carousel-item', {
'p-carousel-item-active': props.active,
'p-carousel-item-start': props.start,
'p-carousel-item-end': props.end
});
return /*#__PURE__*/React__namespace.createElement("div", {
className: className
}, content);
});
var Carousel = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = CarouselBase.getProps(inProps);
var _React$useState = React__namespace.useState(props.numVisible),
_React$useState2 = _slicedToArray(_React$useState, 2),
numVisibleState = _React$useState2[0],
setNumVisibleState = _React$useState2[1];
var _React$useState3 = React__namespace.useState(props.numScroll),
_React$useState4 = _slicedToArray(_React$useState3, 2),
numScrollState = _React$useState4[0],
setNumScrollState = _React$useState4[1];
var _React$useState5 = React__namespace.useState(props.page * props.numScroll * -1),
_React$useState6 = _slicedToArray(_React$useState5, 2),
totalShiftedItemsState = _React$useState6[0],
setTotalShiftedItemsState = _React$useState6[1];
var _React$useState7 = React__namespace.useState(props.page),
_React$useState8 = _slicedToArray(_React$useState7, 2),
pageState = _React$useState8[0],
setPageState = _React$useState8[1];
var elementRef = React__namespace.useRef(null);
var itemsContainerRef = React__namespace.useRef(null);
var remainingItems = React__namespace.useRef(0);
var allowAutoplay = React__namespace.useRef(!!props.autoplayInterval);
var attributeSelector = React__namespace.useRef('');
var swipeThreshold = React__namespace.useRef(20);
var startPos = React__namespace.useRef(null);
var interval = React__namespace.useRef(null);
var carouselStyle = React__namespace.useRef(null);
var isRemainingItemsAdded = React__namespace.useRef(false);
var responsiveOptions = React__namespace.useRef(null);
var prevNumScroll = usePrevious(numScrollState);
var prevNumVisible = usePrevious(numVisibleState);
var prevValue = usePrevious(props.value);
var prevPage = usePrevious(props.page);
var isVertical = props.orientation === 'vertical';
var circular = props.circular || !!props.autoplayInterval;
var isCircular = circular && props.value && props.value.length >= numVisibleState;
var currentPage = props.onPageChange ? props.page : pageState;
var totalIndicators = props.value ? Math.max(Math.ceil((props.value.length - numVisibleState) / numScrollState) + 1, 0) : 0;
var isAutoplay = totalIndicators && props.autoplayInterval && allowAutoplay.current;
var _useResizeListener = useResizeListener({
listener: function listener() {
calculatePosition();
},
when: props.responsiveOptions
}),
_useResizeListener2 = _slicedToArray(_useResizeListener, 1),
bindWindowResizeListener = _useResizeListener2[0];
var step = function step(dir, page) {
var totalShiftedItems = totalShiftedItemsState;
if (page != null) {
totalShiftedItems = numScrollState * page * -1;
if (isCircular) {
totalShiftedItems -= numVisibleState;
}
isRemainingItemsAdded.current = false;
} else {
totalShiftedItems += numScrollState * dir;
if (isRemainingItemsAdded.current) {
totalShiftedItems += remainingItems.current - numScrollState * dir;
isRemainingItemsAdded.current = false;
}
var originalShiftedItems = isCircular ? totalShiftedItems + numVisibleState : totalShiftedItems;
page = Math.abs(Math.floor(originalShiftedItems / numScrollState));
}
if (isCircular && pageState === totalIndicators - 1 && dir === -1) {
totalShiftedItems = -1 * (props.value.length + numVisibleState);
page = 0;
} else if (isCircular && pageState === 0 && dir === 1) {
totalShiftedItems = 0;
page = totalIndicators - 1;
} else if (page === totalIndicators - 1 && remainingItems.current > 0) {
totalShiftedItems += remainingItems.current * -1 - numScrollState * dir;
isRemainingItemsAdded.current = true;
}
if (itemsContainerRef.current) {
DomHandler.removeClass(itemsContainerRef.current, 'p-items-hidden');
changePosition(totalShiftedItems);
itemsContainerRef.current.style.transition = 'transform 500ms ease 0s';
}
if (props.onPageChange) {
setTotalShiftedItemsState(totalShiftedItems);
props.onPageChange({
page: page
});
} else {
setPageState(page);
setTotalShiftedItemsState(totalShiftedItems);
}
};
var calculatePosition = function calculatePosition() {
if (itemsContainerRef.current && responsiveOptions.current) {
var windowWidth = window.innerWidth;
var matchedResponsiveData = {
numVisible: props.numVisible,
numScroll: props.numScroll
};
for (var i = 0; i < responsiveOptions.current.length; i++) {
var res = responsiveOptions.current[i];
if (parseInt(res.breakpoint, 10) >= windowWidth) {
matchedResponsiveData = res;
}
}
if (numScrollState !== matchedResponsiveData.numScroll) {
var page = Math.floor(currentPage * numScrollState / matchedResponsiveData.numScroll);
var totalShiftedItems = matchedResponsiveData.numScroll * page * -1;
if (isCircular) {
totalShiftedItems -= matchedResponsiveData.numVisible;
}
setTotalShiftedItemsState(totalShiftedItems);
setNumScrollState(matchedResponsiveData.numScroll);
if (props.onPageChange) {
props.onPageChange({
page: page
});
} else {
setPageState(page);
}
}
if (numVisibleState !== matchedResponsiveData.numVisible) {
setNumVisibleState(matchedResponsiveData.numVisible);
}
}
};
var navBackward = function navBackward(e, page) {
if (circular || currentPage !== 0) {
step(1, page);
}
allowAutoplay.current = false;
if (e.cancelable) {
e.preventDefault();
}
};
var navForward = function navForward(e, page) {
if (circular || currentPage < totalIndicators - 1) {
step(-1, page);
}
allowAutoplay.current = false;
if (e.cancelable) {
e.preventDefault();
}
};
var onDotClick = function onDotClick(e, page) {
if (page > currentPage) {
navForward(e, page);
} else if (page < currentPage) {
navBackward(e, page);
}
};
var onTransitionEnd = function onTransitionEnd(e) {
if (itemsContainerRef.current && e.propertyName === 'transform') {
DomHandler.addClass(itemsContainerRef.current, 'p-items-hidden');
itemsContainerRef.current.style.transition = '';
if ((pageState === 0 || pageState === totalIndicators - 1) && isCircular) {
changePosition(totalShiftedItemsState);
}
}
};
var onTouchStart = function onTouchStart(e) {
var touchobj = e.changedTouches[0];
startPos.current = {
x: touchobj.pageX,
y: touchobj.pageY
};
};
var onTouchMove = function onTouchMove(e) {
if (e.cancelable) {
e.preventDefault();
}
};
var onTouchEnd = function onTouchEnd(e) {
var touchobj = e.changedTouches[0];
if (isVertical) {
changePageOnTouch(e, touchobj.pageY - startPos.current.y);
} else {
changePageOnTouch(e, touchobj.pageX - startPos.current.x);
}
};
var changePageOnTouch = function changePageOnTouch(e, diff) {
if (Math.abs(diff) > swipeThreshold) {
if (diff < 0) {
// left
navForward(e);
} else {
// right
navBackward(e);
}
}
};
var startAutoplay = function startAutoplay() {
interval.current = setInterval(function () {
if (pageState === totalIndicators - 1) {
step(-1, 0);
} else {
step(-1, pageState + 1);
}
}, props.autoplayInterval);
};
var stopAutoplay = function stopAutoplay() {
if (interval.current) {
clearInterval(interval.current);
}
};
var createStyle = function createStyle() {
if (!carouselStyle.current) {
carouselStyle.current = DomHandler.createInlineStyle(PrimeReact.nonce);
}
var innerHTML = "\n .p-carousel[".concat(attributeSelector.current, "] .p-carousel-item {\n flex: 1 0 ").concat(100 / numVisibleState, "%\n }\n ");
if (props.responsiveOptions) {
responsiveOptions.current = _toConsumableArray(props.responsiveOptions);
responsiveOptions.current.sort(function (data1, data2) {
var value1 = data1.breakpoint;
var value2 = data2.breakpoint;
return ObjectUtils.sort(value1, value2, -1, PrimeReact.locale, PrimeReact.nullSortOrder);
});
for (var i = 0; i < responsiveOptions.current.length; i++) {
var res = responsiveOptions.current[i];
innerHTML += "\n @media screen and (max-width: ".concat(res.breakpoint, ") {\n .p-carousel[").concat(attributeSelector.current, "] .p-carousel-item {\n flex: 1 0 ").concat(100 / res.numVisible, "%\n }\n }\n ");
}
}
carouselStyle.current.innerHTML = innerHTML;
};
var changePosition = function changePosition(totalShiftedItems) {
if (itemsContainerRef.current) {
itemsContainerRef.current.style.transform = isVertical ? "translate3d(0, ".concat(totalShiftedItems * (100 / numVisibleState), "%, 0)") : "translate3d(".concat(totalShiftedItems * (100 / numVisibleState), "%, 0, 0)");
}
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
getElement: function getElement() {
return elementRef.current;
}
};
});
useMountEffect(function () {
if (elementRef.current) {
attributeSelector.current = UniqueComponentId();
elementRef.current.setAttribute(attributeSelector.current, '');
}
createStyle();
calculatePosition();
changePosition(totalShiftedItemsState);
bindWindowResizeListener();
});
useUpdateEffect(function () {
var stateChanged = false;
var totalShiftedItems = totalShiftedItemsState;
if (props.autoplayInterval) {
stopAutoplay();
}
if (prevNumScroll !== numScrollState || prevNumVisible !== numVisibleState || props.value && prevValue && prevValue.length !== props.value.length) {
remainingItems.current = (props.value.length - numVisibleState) % numScrollState;
var page = currentPage;
if (totalIndicators !== 0 && page >= totalIndicators) {
page = totalIndicators - 1;
if (props.onPageChange) {
props.onPageChange({
page: page
});
} else {
setPageState(page);
}
stateChanged = true;
}
totalShiftedItems = page * numScrollState * -1;
if (isCircular) {
totalShiftedItems -= numVisibleState;
}
if (page === totalIndicators - 1 && remainingItems.current > 0) {
totalShiftedItems += -1 * remainingItems.current + numScrollState;
isRemainingItemsAdded.current = true;
} else {
isRemainingItemsAdded.current = false;
}
if (totalShiftedItems !== totalShiftedItemsState) {
setTotalShiftedItemsState(totalShiftedItems);
stateChanged = true;
}
changePosition(totalShiftedItems);
}
if (isCircular) {
if (pageState === 0) {
totalShiftedItems = -1 * numVisibleState;
} else if (totalShiftedItems === 0) {
totalShiftedItems = -1 * props.value.length;
if (remainingItems.current > 0) {
isRemainingItemsAdded.current = true;
}
}
if (totalShiftedItems !== totalShiftedItemsState) {
setTotalShiftedItemsState(totalShiftedItems);
stateChanged = true;
}
}
if (prevPage !== props.page) {
if (props.page > prevPage && props.page <= totalIndicators - 1) {
step(-1, props.page);
} else if (props.page < prevPage) {
step(1, props.page);
}
}
if (!stateChanged && isAutoplay) {
startAutoplay();
}
});
useUnmountEffect(function () {
if (props.autoplayInterval) {
stopAutoplay();
}
});
var createItems = function createItems() {
if (props.value && props.value.length) {
var clonedItemsForStarting = null;
var clonedItemsForFinishing = null;
if (isCircular) {
var clonedElements = null;
clonedElements = props.value.slice(-1 * numVisibleState);
clonedItemsForStarting = clonedElements.map(function (item, index) {
var isActive = totalShiftedItemsState * -1 === props.value.length + numVisibleState;
var start = index === 0;
var end = index === clonedElements.length - 1;
var key = index + '_scloned';
return /*#__PURE__*/React__namespace.createElement(CarouselItem, {
key: key,
className: "p-carousel-item-cloned",
template: props.itemTemplate,
item: item,
active: isActive,
start: start,
end: end
});
});
clonedElements = props.value.slice(0, numVisibleState);
clonedItemsForFinishing = clonedElements.map(function (item, index) {
var isActive = totalShiftedItemsState === 0;
var start = index === 0;
var end = index === clonedElements.length - 1;
var key = index + '_fcloned';
return /*#__PURE__*/React__namespace.createElement(CarouselItem, {
key: key,
className: "p-carousel-item-cloned",
template: props.itemTemplate,
item: item,
active: isActive,
start: start,
end: end
});
});
}
var items = props.value.map(function (item, index) {
var firstIndex = isCircular ? -1 * (totalShiftedItemsState + numVisibleState) : totalShiftedItemsState * -1;
var lastIndex = firstIndex + numVisibleState - 1;
var isActive = firstIndex <= index && lastIndex >= index;
var start = firstIndex === index;
var end = lastIndex === index;
return /*#__PURE__*/React__namespace.createElement(CarouselItem, {
key: index,
template: props.itemTemplate,
item: item,
active: isActive,
start: start,
end: end
});
});
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, clonedItemsForStarting, items, clonedItemsForFinishing);
}
};
var createHeader = function createHeader() {
if (props.header) {
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-carousel-header"
}, props.header);
}
return null;
};
var createFooter = function createFooter() {
if (props.footer) {
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-carousel-footer"
}, props.footer);
}
return null;
};
var createContent = function createContent() {
var items = createItems();
var height = isVertical ? props.verticalViewPortHeight : 'auto';
var backwardNavigator = createBackwardNavigator();
var forwardNavigator = createForwardNavigator();
var className = classNames('p-carousel-container', props.containerClassName);
return /*#__PURE__*/React__namespace.createElement("div", {
className: className
}, backwardNavigator, /*#__PURE__*/React__namespace.createElement("div", {
className: "p-carousel-items-content",
style: {
height: height
},
onTouchStart: onTouchStart,
onTouchMove: onTouchMove,
onTouchEnd: onTouchEnd
}, /*#__PURE__*/React__namespace.createElement("div", {
ref: itemsContainerRef,
className: "p-carousel-items-container",
onTransitionEnd: onTransitionEnd
}, items)), forwardNavigator);
};
var createBackwardNavigator = function createBackwardNavigator() {
if (props.showNavigators) {
var isDisabled = (!circular || props.value && props.value.length < numVisibleState) && currentPage === 0;
var _className = classNames('p-carousel-prev p-link', {
'p-disabled': isDisabled
});
var iconClassName = classNames('p-carousel-prev-icon pi', {
'pi-chevron-left': !isVertical,
'pi-chevron-up': isVertical
});
return /*#__PURE__*/React__namespace.createElement("button", {
type: "button",
className: _className,
onClick: navBackward,
disabled: isDisabled,
"aria-label": ariaLabel('previousPageLabel')
}, /*#__PURE__*/React__namespace.createElement("span", {
className: iconClassName
}), /*#__PURE__*/React__namespace.createElement(Ripple, null));
}
return null;
};
var createForwardNavigator = function createForwardNavigator() {
if (props.showNavigators) {
var isDisabled = (!circular || props.value && props.value.length < numVisibleState) && (currentPage === totalIndicators - 1 || totalIndicators === 0);
var _className2 = classNames('p-carousel-next p-link', {
'p-disabled': isDisabled
});
var iconClassName = classNames('p-carousel-next-icon pi', {
'pi-chevron-right': !isVertical,
'pi-chevron-down': isVertical
});
return /*#__PURE__*/React__namespace.createElement("button", {
type: "button",
className: _className2,
onClick: navForward,
disabled: isDisabled,
"aria-label": ariaLabel('nextPageLabel')
}, /*#__PURE__*/React__namespace.createElement("span", {
className: iconClassName
}), /*#__PURE__*/React__namespace.createElement(Ripple, null));
}
return null;
};
var createIndicator = function createIndicator(index) {
var isActive = currentPage === index;
var key = 'carousel-indicator-' + index;
var className = classNames('p-carousel-indicator', {
'p-highlight': isActive
});
return /*#__PURE__*/React__namespace.createElement("li", {
key: key,
className: className
}, /*#__PURE__*/React__namespace.createElement("button", {
type: "button",
className: "p-link",
onClick: function onClick(e) {
return onDotClick(e, index);
},
"aria-label": "".concat(ariaLabel('pageLabel'), " ").concat(index + 1)
}, /*#__PURE__*/React__namespace.createElement(Ripple, null)));
};
var createIndicators = function createIndicators() {
if (props.showIndicators) {
var _className3 = classNames('p-carousel-indicators p-reset', props.indicatorsContentClassName);
var _indicators = [];
for (var i = 0; i < totalIndicators; i++) {
_indicators.push(createIndicator(i));
}
return /*#__PURE__*/React__namespace.createElement("ul", {
className: _className3
}, _indicators);
}
return null;
};
var otherProps = CarouselBase.getOtherProps(props);
var className = classNames('p-carousel p-component', {
'p-carousel-vertical': isVertical,
'p-carousel-horizontal': !isVertical
}, props.className);
var contentClassName = classNames('p-carousel-content', props.contentClassName);
var content = createContent();
var indicators = createIndicators();
var header = createHeader();
var footer = createFooter();
return /*#__PURE__*/React__namespace.createElement("div", _extends({
ref: elementRef,
id: props.id,
className: className,
style: props.style
}, otherProps), header, /*#__PURE__*/React__namespace.createElement("div", {
className: contentClassName
}, content, indicators), footer);
}));
CarouselItem.displayName = 'CarouselItem';
Carousel.displayName = 'Carousel';
var CascadeSelectBase = {
defaultProps: {
__TYPE: 'CascadeSelect',
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,
breakpoint: undefined,
inputId: null,
tabIndex: null,
ariaLabelledBy: null,
appendTo: null,
transitionOptions: null,
dropdownIcon: 'pi pi-chevron-down',
scrollHeight: '400px',
onChange: null,
onGroupChange: null,
onBeforeShow: null,
onBeforeHide: null,
onShow: null,
onHide: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, CascadeSelectBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, CascadeSelectBase.defaultProps);
}
};
var CascadeSelectSub = /*#__PURE__*/React__namespace.memo(function (props) {
var _React$useState = React__namespace.useState(null),
_React$useState2 = _slicedToArray(_React$useState, 2),
activeOptionState = _React$useState2[0],
setActiveOptionState = _React$useState2[1];
var elementRef = React__namespace.useRef(null);
var position = function position() {
var parentItem = elementRef.current.parentElement;
var containerOffset = DomHandler.getOffset(parentItem);
var viewport = DomHandler.getViewport();
var sublistWidth = elementRef.current.offsetParent ? elementRef.current.offsetWidth : DomHandler.getHiddenElementOuterWidth(element);
var itemOuterWidth = DomHandler.getOuterWidth(parentItem.children[0]);
if (parseInt(containerOffset.left, 10) + itemOuterWidth + sublistWidth > viewport.width - DomHandler.calculateScrollbarWidth()) {
elementRef.current.style.left = '-100%';
}
};
var onOptionSelect = function onOptionSelect(event) {
props.onOptionSelect && props.onOptionSelect(event);
};
var _onKeyDown = function onKeyDown(event, option) {
var listItem = event.currentTarget.parentElement;
switch (event.key) {
case 'Down':
case 'ArrowDown':
var nextItem = findNextItem(listItem);
if (nextItem) {
nextItem.children[0].focus();
}
break;
case 'Up':
case 'ArrowUp':
var prevItem = findPrevItem(listItem);
if (prevItem) {
prevItem.children[0].focus();
}
break;
case 'Right':
case 'ArrowRight':
if (isOptionGroup(option)) {
if (activeOptionState === option) {
listItem.children[1].children[0].children[0].focus();
} else {
setActiveOptionState(option);
}
}
break;
case 'Left':
case 'ArrowLeft':
setActiveOptionState(null);
var parentList = event.currentTarget.parentElement.parentElement.previousElementSibling;
if (parentList) {
parentList.focus();
}
break;
case 'Enter':
onOptionClick(event, option);
break;
case 'Tab':
case 'Escape':
if (props.onPanelHide) {
props.onPanelHide();
event.preventDefault();
}
break;
}
event.preventDefault();
};
var findNextItem = function findNextItem(item) {
var nextItem = item.nextElementSibling;
return nextItem ? DomHandler.hasClass(nextItem, 'p-disabled') || !DomHandler.hasClass(nextItem, 'p-cascadeselect-item') ? findNextItem(nextItem) : nextItem : null;
};
var findPrevItem = function findPrevItem(item) {
var prevItem = item.previousElementSibling;
return prevItem ? DomHandler.hasClass(prevItem, 'p-disabled') || !DomHandler.hasClass(prevItem, 'p-cascadeselect-item') ? findPrevItem(prevItem) : prevItem : null;
};
var onOptionClick = function onOptionClick(event, option) {
if (isOptionGroup(option)) {
setActiveOptionState(function (prevActiveOption) {
return prevActiveOption === option ? null : option;
});
if (props.onOptionGroupSelect) {
props.onOptionGroupSelect({
originalEvent: event,
value: option
});
}
} else {
if (props.onOptionSelect) {
props.onOptionSelect({
originalEvent: event,
value: getOptionValue(option)
});
}
}
};
var onOptionGroupSelect = function onOptionGroupSelect(event) {
props.onOptionGroupSelect && props.onOptionGroupSelect(event);
};
var getOptionLabel = function getOptionLabel(option) {
return props.optionLabel ? ObjectUtils.resolveFieldData(option, props.optionLabel) : option;
};
var getOptionValue = function getOptionValue(option) {
return props.optionValue ? ObjectUtils.resolveFieldData(option, props.optionValue) : option;
};
var getOptionGroupLabel = function getOptionGroupLabel(optionGroup) {
return props.optionGroupLabel ? ObjectUtils.resolveFieldData(optionGroup, props.optionGroupLabel) : null;
};
var getOptionGroupChildren = function getOptionGroupChildren(optionGroup) {
return ObjectUtils.resolveFieldData(optionGroup, props.optionGroupChildren[props.level]);
};
var isOptionGroup = function isOptionGroup(option) {
return Object.prototype.hasOwnProperty.call(option, props.optionGroupChildren[props.level]);
};
var getOptionLabelToRender = function getOptionLabelToRender(option) {
return isOptionGroup(option) ? getOptionGroupLabel(option) : getOptionLabel(option);
};
useMountEffect(function () {
if (props.selectionPath && props.options && !props.dirty) {
var activeOption = props.options.find(function (o) {
return props.selectionPath.includes(o);
});
activeOption && setActiveOptionState(activeOption);
}
if (!props.root) {
position();
}
});
useUpdateEffect(function () {
setActiveOptionState(null);
}, [props.parentActive]);
var createSubmenu = function createSubmenu(option) {
if (isOptionGroup(option) && activeOptionState === option) {
var options = getOptionGroupChildren(option);
var parentActive = activeOptionState === option;
var level = props.level + 1;
return /*#__PURE__*/React__namespace.createElement(CascadeSelectSub, {
options: options,
className: "p-cascadeselect-sublist",
selectionPath: props.selectionPath,
optionLabel: props.optionLabel,
optionValue: props.optionValue,
level: level,
onOptionSelect: onOptionSelect,
onOptionGroupSelect: onOptionGroupSelect,
parentActive: parentActive,
optionGroupLabel: props.optionGroupLabel,
optionGroupChildren: props.optionGroupChildren,
dirty: props.dirty,
template: props.template,
onPanelHide: props.onPanelHide
});
}
return null;
};
var createOption = function createOption(option, index) {
var className = classNames('p-cascadeselect-item', {
'p-cascadeselect-item-group': isOptionGroup(option),
'p-cascadeselect-item-active p-highlight': activeOptionState === option
}, option.className);
var submenu = createSubmenu(option);
var content = props.template ? ObjectUtils.getJSXElement(props.template, getOptionValue(option)) : /*#__PURE__*/React__namespace.createElement("span", {
className: "p-cascadeselect-item-text"
}, getOptionLabelToRender(option));
var optionGroup = isOptionGroup(option) && /*#__PURE__*/React__namespace.createElement("span", {
className: "p-cascadeselect-group-icon pi pi-angle-right"
});
var key = getOptionLabelToRender(option) + '_' + index;
return /*#__PURE__*/React__namespace.createElement("li", {
key: key,
className: className,
style: option.style,
role: "none"
}, /*#__PURE__*/React__namespace.createElement("div", {
className: "p-cascadeselect-item-content",
onClick: function onClick(event) {
return onOptionClick(event, option);
},
tabIndex: 0,
onKeyDown: function onKeyDown(event) {
return _onKeyDown(event, option);
}
}, content, optionGroup, /*#__PURE__*/React__namespace.createElement(Ripple, null)), submenu);
};
var createMenu = function createMenu() {
return props.options ? props.options.map(createOption) : null;
};
var className = classNames('p-cascadeselect-panel p-cascadeselect-items', props.className, {
'p-input-filled': PrimeReact.inputStyle === 'filled',
'p-ripple-disabled': PrimeReact.ripple === false
});
var submenu = createMenu();
return /*#__PURE__*/React__namespace.createElement("ul", {
ref: elementRef,
className: className,
role: "listbox",
"aria-orientation": "horizontal"
}, submenu);
});
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; }
var CascadeSelect = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = CascadeSelectBase.getProps(inProps);
var _React$useState = React__namespace.useState(false),
_React$useState2 = _slicedToArray(_React$useState, 2),
focusedState = _React$useState2[0],
setFocusedState = _React$useState2[1];
var _React$useState3 = React__namespace.useState(false),
_React$useState4 = _slicedToArray(_React$useState3, 2),
overlayVisibleState = _React$useState4[0],
setOverlayVisibleState = _React$useState4[1];
var _React$useState5 = React__namespace.useState(null),
_React$useState6 = _slicedToArray(_React$useState5, 2),
attributeSelectorState = _React$useState6[0],
setAttributeSelectorState = _React$useState6[1];
var elementRef = React__namespace.useRef(null);
var overlayRef = React__namespace.useRef(null);
var inputRef = React__namespace.useRef(null);
var labelRef = React__namespace.useRef(null);
var styleElementRef = React__namespace.useRef(null);
var dirty = React__namespace.useRef(false);
var selectionPath = React__namespace.useRef(null);
var _useOverlayListener = useOverlayListener({
target: elementRef,
overlay: overlayRef,
listener: function listener(event, _ref) {
var valid = _ref.valid;
valid && hide();
},
when: overlayVisibleState
}),
_useOverlayListener2 = _slicedToArray(_useOverlayListener, 2),
bindOverlayListener = _useOverlayListener2[0],
unbindOverlayListener = _useOverlayListener2[1];
var onOptionSelect = function onOptionSelect(event) {
if (props.onChange) {
props.onChange({
originalEvent: event,
value: event.value
});
}
updateSelectionPath();
hide();
DomHandler.focus(inputRef.current);
};
var onOptionGroupSelect = function onOptionGroupSelect(event) {
dirty.current = true;
props.onGroupChange && props.onGroupChange(event);
};
var getOptionLabel = function getOptionLabel(option) {
var label = props.optionLabel ? ObjectUtils.resolveFieldData(option, props.optionLabel) : option;
return label || option;
};
var getOptionValue = function getOptionValue(option) {
return props.optionValue ? ObjectUtils.resolveFieldData(option, props.optionValue) : option;
};
var getOptionGroupChildren = function getOptionGroupChildren(optionGroup, level) {
return ObjectUtils.resolveFieldData(optionGroup, props.optionGroupChildren[level]);
};
var isOptionGroup = function isOptionGroup(option, level) {
return Object.prototype.hasOwnProperty.call(option, props.optionGroupChildren[level]);
};
var updateSelectionPath = function updateSelectionPath() {
var path;
if (props.value != null && props.options) {
var _iterator = _createForOfIteratorHelper$b(props.options),
_step;
try {
for (_iterator.s(); !(_step = _iterator.n()).done;) {
var option = _step.value;
path = findModelOptionInGroup(option, 0);
if (path) {
break;
}
}
} catch (err) {
_iterator.e(err);
} finally {
_iterator.f();
}
}
selectionPath.current = path;
};
var findModelOptionInGroup = function findModelOptionInGroup(option, level) {
if (isOptionGroup(option, level)) {
var selectedOption;
var _iterator2 = _createForOfIteratorHelper$b(getOptionGroupChildren(option, level)),
_step2;
try {
for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
var childOption = _step2.value;
selectedOption = findModelOptionInGroup(childOption, level + 1);
if (selectedOption) {
selectedOption.unshift(option);
return selectedOption;
}
}
} catch (err) {
_iterator2.e(err);
} finally {
_iterator2.f();
}
} else if (ObjectUtils.equals(props.value, getOptionValue(option), props.dataKey)) {
return [option];
}
return null;
};
var onClick = function onClick(event) {
if (props.disabled) {
return;
}
if (!overlayRef.current || !overlayRef.current.contains(event.target)) {
DomHandler.focus(inputRef.current);
overlayVisibleState ? hide() : show();
}
};
var onInputFocus = function onInputFocus() {
setFocusedState(true);
};
var onInputBlur = function onInputBlur() {
setFocusedState(false);
};
var onInputKeyDown = function onInputKeyDown(event) {
switch (event.which) {
//down
case 40:
if (overlayVisibleState) {
DomHandler.findSingle(overlayRef.current, '.p-cascadeselect-item').children[0].focus();
} else if (event.altKey && props.options && props.options.length) {
show();
}
event.preventDefault();
break;
//space
case 32:
overlayVisibleState ? hide() : show();
event.preventDefault();
break;
//tab
case 9:
hide();
break;
}
};
var onPanelClick = function onPanelClick(event) {
OverlayService.emit('overlay-click', {
originalEvent: event,
target: elementRef.current
});
};
var show = function show() {
props.onBeforeShow && props.onBeforeShow();
setOverlayVisibleState(true);
};
var hide = function hide() {
props.onBeforeHide && props.onBeforeHide();
setOverlayVisibleState(false);
DomHandler.focus(inputRef.current);
};
var onOverlayEnter = function onOverlayEnter() {
ZIndexUtils.set('overlay', overlayRef.current, PrimeReact.autoZIndex, PrimeReact.zIndex['overlay']);
alignOverlay();
if (attributeSelectorState && props.breakpoint) {
overlayRef.current.setAttribute(attributeSelectorState + '_panel', '');
createStyle();
}
};
var onOverlayEntered = function onOverlayEntered() {
bindOverlayListener();
props.onShow && props.onShow();
};
var onOverlayExit = function onOverlayExit() {
unbindOverlayListener();
dirty.current = false;
};
var onOverlayExited = function onOverlayExited() {
ZIndexUtils.clear(overlayRef.current);
props.onHide && props.onHide();
destroyStyle();
};
var alignOverlay = function alignOverlay() {
DomHandler.alignOverlay(overlayRef.current, labelRef.current.parentElement, props.appendTo || PrimeReact.appendTo);
};
var createStyle = function createStyle() {
if (!styleElementRef.current) {
styleElementRef.current = DomHandler.createInlineStyle(PrimeReact.nonce);
var selector = "".concat(attributeSelectorState, "_panel");
var innerHTML = "\n@media screen and (max-width: ".concat(props.breakpoint, ") {\n .p-cascadeselect-panel[").concat(selector, "] .p-cascadeselect-items-wrapper > ul {\n max-height: ").concat(props.scrollHeight, ";\n overflow: ").concat(props.scrollHeight ? 'auto' : '', ";\n }\n\n .p-cascadeselect-panel[").concat(selector, "] .p-cascadeselect-sublist {\n position: relative;\n }\n\n .p-cascadeselect-panel[").concat(selector, "] .p-cascadeselect-item-active > .p-cascadeselect-sublist {\n left: 0 !important;\n box-shadow: none;\n border-radius: 0;\n padding: 0 0 0 calc(var(--inline-spacing) * 2); /* @todo */\n }\n\n .p-cascadeselect-panel[").concat(selector, "] .p-cascadeselect-group-icon:before {\n content: \"\\e930\";\n }\n}\n");
styleElementRef.current.innerHTML = innerHTML;
}
};
var destroyStyle = function destroyStyle() {
styleElementRef.current = DomHandler.removeInlineStyle(styleElementRef.current);
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
getElement: function getElement() {
return elementRef.current;
},
getOverlay: function getOverlay() {
return overlayRef.current;
},
getInput: function getInput() {
return inputRef.current;
},
getLabel: function getLabel() {
return labelRef.current;
},
focus: function focus() {
return DomHandler.focus(inputRef.current);
}
};
});
useMountEffect(function () {
if (props.breakpoint) {
!attributeSelectorState && setAttributeSelectorState(UniqueComponentId());
}
});
React__namespace.useEffect(function () {
ObjectUtils.combinedRefs(inputRef, props.inputRef);
}, [inputRef, props.inputRef]);
useUpdateEffect(function () {
updateSelectionPath();
}, [props.value]);
useUnmountEffect(function () {
ZIndexUtils.clear(overlayRef.current);
});
var createKeyboardHelper = function createKeyboardHelper() {
var value = props.value ? getOptionLabel(props.value) : undefined;
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-hidden-accessible"
}, /*#__PURE__*/React__namespace.createElement("input", _extends({
ref: inputRef,
type: "text",
id: props.inputId,
name: props.name,
defaultValue: value,
readOnly: true,
disabled: props.disabled,
onFocus: onInputFocus,
onBlur: onInputBlur,
onKeyDown: onInputKeyDown,
tabIndex: props.tabIndex,
"aria-haspopup": "listbox"
}, ariaProps)));
};
var createLabel = function createLabel() {
var label = props.value ? getOptionLabel(props.value) : props.placeholder || 'p-emptylabel';
var labelClassName = classNames('p-cascadeselect-label ', {
'p-placeholder': label === props.placeholder,
'p-cascadeselect-label-empty': !props.value && label === 'p-emptylabel'
});
return /*#__PURE__*/React__namespace.createElement("span", {
ref: labelRef,
className: labelClassName
}, label);
};
var createDropdownIcon = function createDropdownIcon() {
var iconClassName = classNames('p-cascadeselect-trigger-icon', props.dropdownIcon);
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-cascadeselect-trigger",
role: "button",
"aria-haspopup": "listbox",
"aria-expanded": overlayVisibleState
}, /*#__PURE__*/React__namespace.createElement("span", {
className: iconClassName
}));
};
var createOverlay = function createOverlay() {
var overlay = /*#__PURE__*/React__namespace.createElement(CSSTransition, {
nodeRef: overlayRef,
classNames: "p-connected-overlay",
"in": overlayVisibleState,
timeout: {
enter: 120,
exit: 100
},
options: props.transitionOptions,
unmountOnExit: true,
onEnter: onOverlayEnter,
onEntered: onOverlayEntered,
onExit: onOverlayExit,
onExited: onOverlayExited
}, /*#__PURE__*/React__namespace.createElement("div", {
ref: overlayRef,
className: "p-cascadeselect-panel p-component",
onClick: onPanelClick
}, /*#__PURE__*/React__namespace.createElement("div", {
className: "p-cascadeselect-items-wrapper"
}, /*#__PURE__*/React__namespace.createElement(CascadeSelectSub, {
options: props.options,
selectionPath: selectionPath.current,
className: 'p-cascadeselect-items',
optionLabel: props.optionLabel,
optionValue: props.optionValue,
level: 0,
optionGroupLabel: props.optionGroupLabel,
optionGroupChildren: props.optionGroupChildren,
onOptionSelect: onOptionSelect,
onOptionGroupSelect: onOptionGroupSelect,
root: true,
template: props.itemTemplate,
onPanelHide: hide
}))));
return /*#__PURE__*/React__namespace.createElement(Portal, {
element: overlay,
appendTo: props.appendTo
});
};
var createElement = function createElement() {
var className = classNames('p-cascadeselect p-component p-inputwrapper', {
'p-disabled': props.disabled,
'p-focus': focusedState,
'p-inputwrapper-filled': props.value,
'p-inputwrapper-focus': focusedState || overlayVisibleState
}, props.className);
var keyboardHelper = createKeyboardHelper();
var labelElement = createLabel();
var dropdownIcon = createDropdownIcon();
var overlay = createOverlay();
return /*#__PURE__*/React__namespace.createElement("div", _extends({
ref: elementRef,
id: props.id,
className: className,
style: props.style
}, otherProps, {
onClick: onClick
}), keyboardHelper, labelElement, dropdownIcon, overlay);
};
var otherProps = CascadeSelectBase.getOtherProps(props);
ObjectUtils.reduceKeys(otherProps, DomHandler.DATA_PROPS);
var ariaProps = ObjectUtils.reduceKeys(otherProps, DomHandler.ARIA_PROPS);
var element = createElement();
return element;
}));
CascadeSelect.displayName = 'CascadeSelect';
var ChartBase = {
defaultProps: {
__TYPE: 'Chart',
id: null,
type: null,
data: null,
options: null,
plugins: null,
width: null,
height: null,
style: null,
className: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, ChartBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, ChartBase.defaultProps);
}
};
// GitHub #3059 wrapper if loaded by script tag
var ChartJS = function () {
try {
return Chart;
} catch (_unused) {
return null;
}
}();
var PrimeReactChart = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = ChartBase.getProps(inProps);
var elementRef = React__namespace.useRef(null);
var chartRef = React__namespace.useRef(null);
var canvasRef = React__namespace.useRef(null);
var initChart = function initChart() {
destroyChart();
var configuration = {
type: props.type,
data: props.data,
options: props.options,
plugins: props.plugins
};
if (ChartJS) {
// GitHub #3059 loaded by script only
chartRef.current = new ChartJS(canvasRef.current, configuration);
} else {
import('chart.js/auto').then(function (module) {
destroyChart();
// In case that the Chart component has been unmounted during asynchronous loading of ChartJS,
// the canvasRef will not be available anymore, and no Chart should be created.
if (!canvasRef.current) {
return;
}
if (module) {
if (module["default"]) {
// WebPack
chartRef.current = new module["default"](canvasRef.current, configuration);
} else {
// ParcelJS
chartRef.current = new module(canvasRef.current, configuration);
}
}
});
}
};
var destroyChart = function destroyChart() {
if (chartRef.current) {
chartRef.current.destroy();
chartRef.current = null;
}
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
getCanvas: function getCanvas() {
return canvasRef.current;
},
getChart: function getChart() {
return chartRef.current;
},
getBase64Image: function getBase64Image() {
return chartRef.current.toBase64Image();
},
getElement: function getElement() {
return elementRef.current;
},
generateLegend: function generateLegend() {
return chartRef.current && chartRef.current.generateLegend();
},
refresh: function refresh() {
return chartRef.current && chartRef.current.update();
}
};
});
React__namespace.useEffect(function () {
initChart();
});
useUnmountEffect(function () {
destroyChart();
});
var otherProps = ChartBase.getOtherProps(props);
var className = classNames('p-chart', props.className);
var style = Object.assign({
width: props.width,
height: props.height
}, props.style);
return /*#__PURE__*/React__namespace.createElement("div", _extends({
id: props.id,
ref: elementRef,
style: style,
className: className
}, otherProps), /*#__PURE__*/React__namespace.createElement("canvas", {
ref: canvasRef,
width: props.width,
height: props.height
}));
}), function (prevProps, nextProps) {
return prevProps.data === nextProps.data && prevProps.options === nextProps.options && prevProps.type === nextProps.type;
});
PrimeReactChart.displayName = 'Chart';
var CheckboxBase = {
defaultProps: {
__TYPE: 'Checkbox',
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,
onChange: null,
onMouseDown: null,
onContextMenu: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, CheckboxBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, CheckboxBase.defaultProps);
}
};
var Checkbox = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = CheckboxBase.getProps(inProps);
var _React$useState = React__namespace.useState(false),
_React$useState2 = _slicedToArray(_React$useState, 2),
focusedState = _React$useState2[0],
setFocusedState = _React$useState2[1];
var elementRef = React__namespace.useRef(null);
var inputRef = React__namespace.useRef(props.inputRef);
var onClick = function onClick(event) {
if (!props.disabled && !props.readOnly && props.onChange) {
var _checked = isChecked();
var checkboxClicked = event.target instanceof HTMLDivElement || event.target instanceof HTMLSpanElement;
var isInputToggled = event.target === inputRef.current;
var isCheckboxToggled = checkboxClicked && event.target.checked !== _checked;
if (isInputToggled || isCheckboxToggled) {
var value = _checked ? props.falseValue : props.trueValue;
props.onChange({
originalEvent: event,
value: props.value,
checked: value,
stopPropagation: function stopPropagation() {},
preventDefault: function preventDefault() {},
target: {
type: 'checkbox',
name: props.name,
id: props.id,
value: props.value,
checked: value
}
});
}
DomHandler.focus(inputRef.current);
event.preventDefault();
}
};
var onFocus = function onFocus() {
setFocusedState(true);
};
var onBlur = function onBlur() {
setFocusedState(false);
};
var onKeyDown = function onKeyDown(event) {
if (event.code === 'Space' || event.key === ' ') {
// event.key is for Android support
onClick(event);
}
};
var isChecked = function isChecked() {
return props.checked === props.trueValue;
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
focus: function focus() {
return DomHandler.focus(inputRef.current);
},
getElement: function getElement() {
return elementRef.current;
},
getInput: function getInput() {
return inputRef.current;
}
};
});
React__namespace.useEffect(function () {
ObjectUtils.combinedRefs(inputRef, props.inputRef);
}, [inputRef, props.inputRef]);
useUpdateEffect(function () {
inputRef.current.checked = isChecked();
}, [props.checked, props.trueValue]);
var checked = isChecked();
var hasTooltip = ObjectUtils.isNotEmpty(props.tooltip);
var otherProps = CheckboxBase.getOtherProps(props);
var ariaProps = ObjectUtils.reduceKeys(otherProps, DomHandler.ARIA_PROPS);
var className = classNames('p-checkbox p-component', {
'p-checkbox-checked': checked,
'p-checkbox-disabled': props.disabled,
'p-checkbox-focused': focusedState
}, props.className);
var boxClass = classNames('p-checkbox-box', {
'p-highlight': checked,
'p-disabled': props.disabled,
'p-focus': focusedState
});
var icon = IconUtils.getJSXIcon(checked ? props.icon : '', {
className: 'p-checkbox-icon p-c'
}, {
props: props,
checked: checked
});
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement("div", _extends({
ref: elementRef,
id: props.id,
className: className,
style: props.style
}, otherProps, {
onClick: onClick,
onContextMenu: props.onContextMenu,
onMouseDown: props.onMouseDown
}), /*#__PURE__*/React__namespace.createElement("div", {
className: "p-hidden-accessible"
}, /*#__PURE__*/React__namespace.createElement("input", _extends({
ref: inputRef,
type: "checkbox",
id: props.inputId,
name: props.name,
tabIndex: props.tabIndex,
defaultChecked: checked,
onFocus: onFocus,
onBlur: onBlur,
onKeyDown: onKeyDown,
disabled: props.disabled,
readOnly: props.readOnly,
required: props.required
}, ariaProps))), /*#__PURE__*/React__namespace.createElement("div", {
className: boxClass
}, icon)), hasTooltip && /*#__PURE__*/React__namespace.createElement(Tooltip, _extends({
target: elementRef,
content: props.tooltip
}, props.tooltipOptions)));
}));
Checkbox.displayName = 'Checkbox';
var ChipBase = {
defaultProps: {
__TYPE: 'Chip',
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,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, ChipBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, ChipBase.defaultProps);
}
};
var Chip = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = ChipBase.getProps(inProps);
var elementRef = React__namespace.useRef(null);
var _React$useState = React__namespace.useState(true),
_React$useState2 = _slicedToArray(_React$useState, 2),
visibleState = _React$useState2[0],
setVisibleState = _React$useState2[1];
var onKeyDown = function onKeyDown(event) {
if (event.keyCode === 13) {
// enter
close(event);
}
};
var close = function close(event) {
setVisibleState(false);
if (props.onRemove) {
props.onRemove(event);
}
};
var createContent = function createContent() {
var content = [];
if (props.image) {
content.push( /*#__PURE__*/React__namespace.createElement("img", {
key: "image",
src: props.image,
alt: props.imageAlt,
onError: props.onImageError
}));
} else if (props.icon) {
content.push(IconUtils.getJSXIcon(props.icon, {
key: 'icon',
className: 'p-chip-icon'
}, {
props: props
}));
}
if (props.label) {
content.push( /*#__PURE__*/React__namespace.createElement("span", {
key: "label",
className: "p-chip-text"
}, props.label));
}
if (props.removable) {
content.push(IconUtils.getJSXIcon(props.removeIcon, {
key: 'removeIcon',
tabIndex: 0,
className: 'p-chip-remove-icon',
onClick: close,
onKeyDown: onKeyDown
}, {
props: props
}));
}
return content;
};
var createElement = function createElement() {
var otherProps = ChipBase.getOtherProps(props);
var className = classNames('p-chip p-component', {
'p-chip-image': props.image != null
}, props.className);
var content = props.template ? ObjectUtils.getJSXElement(props.template, props) : createContent();
return /*#__PURE__*/React__namespace.createElement("div", _extends({
ref: elementRef,
className: className,
style: props.style
}, otherProps), content);
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
getElement: function getElement() {
return elementRef.current;
}
};
});
return visibleState && createElement();
}));
Chip.displayName = 'Chip';
var ChipsBase = {
defaultProps: {
__TYPE: 'Chips',
id: null,
inputRef: null,
inputId: 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,
keyfilter: null,
addOnBlur: null,
onAdd: null,
onRemove: null,
onChange: null,
onFocus: null,
onBlur: null,
onKeyDown: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, ChipsBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, ChipsBase.defaultProps);
}
};
var Chips = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = ChipsBase.getProps(inProps);
var _React$useState = React__namespace.useState(false),
_React$useState2 = _slicedToArray(_React$useState, 2),
focusedState = _React$useState2[0],
setFocusedState = _React$useState2[1];
var elementRef = React__namespace.useRef(null);
var listRef = React__namespace.useRef(null);
var inputRef = React__namespace.useRef(props.inputRef);
var removeItem = function removeItem(event, index) {
if (props.disabled && props.readOnly) {
return;
}
var values = _toConsumableArray(props.value);
var removedItem = values.splice(index, 1);
if (!isRemovable(removedItem, index)) {
return;
}
if (props.onRemove) {
props.onRemove({
originalEvent: event,
value: removedItem
});
}
if (props.onChange) {
props.onChange({
originalEvent: event,
value: values,
stopPropagation: function stopPropagation() {},
preventDefault: function preventDefault() {},
target: {
name: props.name,
id: props.id,
value: values
}
});
}
};
var addItem = function addItem(event, item, preventDefault) {
if (item && item.trim().length) {
var values = props.value ? _toConsumableArray(props.value) : [];
if (props.allowDuplicate || values.indexOf(item) === -1) {
var allowAddition = true;
if (props.onAdd) {
allowAddition = props.onAdd({
originalEvent: event,
value: item
});
}
if (allowAddition !== false) {
values.push(item);
}
}
updateInput(event, values, preventDefault);
}
};
var onWrapperClick = function onWrapperClick() {
DomHandler.focus(inputRef.current);
};
var onKeyDown = function onKeyDown(event) {
var inputValue = event.target.value;
var values = props.value || [];
props.onKeyDown && props.onKeyDown(event);
// do not continue if the user defined keydown wants to prevent
if (event.defaultPrevented) {
return;
}
switch (event.key) {
case 'Backspace':
if (inputRef.current.value.length === 0 && values.length > 0) {
removeItem(event, values.length - 1);
}
break;
case 'Enter':
if (inputValue && inputValue.trim().length && (!props.max || props.max > values.length)) {
addItem(event, inputValue, true);
}
break;
default:
if (props.keyfilter) {
KeyFilter.onKeyPress(event, props.keyfilter);
}
if (isMaxedOut()) {
event.preventDefault();
} else if (props.separator === ',') {
// GitHub #3885 Android Opera gives strange code 229 for comma
if (event.key === props.separator || DomHandler.isAndroid() && event.which === 229) {
addItem(event, inputValue, true);
}
}
break;
}
};
var updateInput = function updateInput(event, items, preventDefault) {
if (props.onChange) {
props.onChange({
originalEvent: event,
value: items,
stopPropagation: function stopPropagation() {},
preventDefault: function preventDefault() {},
target: {
name: props.name,
id: props.id,
value: items
}
});
}
inputRef.current.value = '';
preventDefault && event.preventDefault();
};
var onPaste = function onPaste(event) {
if (props.separator) {
var pastedData = (event.clipboardData || window['clipboardData']).getData('Text');
if (props.keyfilter) {
KeyFilter.onPaste(event, props.keyfilter);
}
if (pastedData) {
var values = props.value || [];
var pastedValues = pastedData.split(props.separator);
pastedValues = pastedValues.filter(function (val) {
return (props.allowDuplicate || values.indexOf(val) === -1) && val.trim().length;
});
values = [].concat(_toConsumableArray(values), _toConsumableArray(pastedValues));
updateInput(event, values, true);
}
}
};
var onFocus = function onFocus(event) {
setFocusedState(true);
props.onFocus && props.onFocus(event);
};
var onBlur = function onBlur(event) {
if (props.addOnBlur) {
var inputValue = event.target.value;
var values = props.value || [];
if (inputValue && inputValue.trim().length && (!props.max || props.max > values.length)) {
addItem(event, inputValue, true);
}
}
setFocusedState(false);
props.onBlur && props.onBlur(event);
};
var isMaxedOut = function isMaxedOut() {
return props.max && props.value && props.max === props.value.length;
};
var currentValue = inputRef.current && inputRef.current.value;
var isFilled = React__namespace.useMemo(function () {
return ObjectUtils.isNotEmpty(props.value) || ObjectUtils.isNotEmpty(currentValue);
}, [props.value, currentValue]);
var isRemovable = function isRemovable(value, index) {
return ObjectUtils.getPropValue(props.removable, {
value: value,
index: index,
props: props
});
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
focus: function focus() {
return DomHandler.focus(inputRef.current);
},
getElement: function getElement() {
return elementRef.current;
},
getInput: function getInput() {
return inputRef.current;
}
};
});
React__namespace.useEffect(function () {
ObjectUtils.combinedRefs(inputRef, props.inputRef);
}, [inputRef, props.inputRef]);
var createRemoveIcon = function createRemoveIcon(value, index) {
if (!props.disabled && !props.readOnly && isRemovable(value, index)) {
return /*#__PURE__*/React__namespace.createElement("span", {
className: "p-chips-token-icon pi pi-times-circle",
onClick: function onClick(event) {
return removeItem(event, index);
}
});
}
return null;
};
var createItem = function createItem(value, index) {
var content = props.itemTemplate ? props.itemTemplate(value) : value;
var label = /*#__PURE__*/React__namespace.createElement("span", {
className: "p-chips-token-label"
}, content);
var icon = createRemoveIcon(value, index);
return /*#__PURE__*/React__namespace.createElement("li", {
key: index,
className: "p-chips-token p-highlight"
}, label, icon);
};
var createInput = function createInput() {
return /*#__PURE__*/React__namespace.createElement("li", {
className: "p-chips-input-token"
}, /*#__PURE__*/React__namespace.createElement("input", _extends({
ref: inputRef,
id: props.inputId,
placeholder: props.placeholder,
type: "text",
name: props.name,
disabled: props.disabled || isMaxedOut(),
onKeyDown: onKeyDown,
onPaste: onPaste,
onFocus: onFocus,
onBlur: onBlur,
readOnly: props.readOnly
}, ariaProps)));
};
var createItems = function createItems() {
return props.value ? props.value.map(createItem) : null;
};
var createList = function createList() {
var className = classNames('p-inputtext p-chips-multiple-container', {
'p-disabled': props.disabled,
'p-focus': focusedState
});
var items = createItems();
var input = createInput();
return /*#__PURE__*/React__namespace.createElement("ul", {
ref: listRef,
className: className,
onClick: onWrapperClick
}, items, input);
};
var hasTooltip = ObjectUtils.isNotEmpty(props.tooltip);
var otherProps = ChipsBase.getOtherProps(props);
var ariaProps = ObjectUtils.reduceKeys(otherProps, DomHandler.ARIA_PROPS);
var className = classNames('p-chips p-component p-inputwrapper', {
'p-inputwrapper-filled': isFilled,
'p-inputwrapper-focus': focusedState
}, props.className);
var list = createList();
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement("div", _extends({
ref: elementRef,
id: props.id,
className: className,
style: props.style
}, otherProps), list), hasTooltip && /*#__PURE__*/React__namespace.createElement(Tooltip, _extends({
target: inputRef,
content: props.tooltip
}, props.tooltipOptions)));
}));
Chips.displayName = 'Chips';
var ColorPickerBase = {
defaultProps: {
__TYPE: 'ColorPicker',
appendTo: null,
className: null,
defaultColor: 'ff0000',
disabled: false,
format: 'hex',
id: null,
inline: false,
inputId: null,
inputRef: null,
onChange: null,
onHide: null,
onShow: null,
panelClassName: null,
panelStyle: null,
style: null,
tabIndex: null,
tooltip: null,
tooltipOptions: null,
transitionOptions: null,
value: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, ColorPickerBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, ColorPickerBase.defaultProps);
}
};
var ColorPickerPanel = /*#__PURE__*/React__namespace.forwardRef(function (props, ref) {
var createElement = function createElement() {
var className = classNames('p-colorpicker-panel', props.panelClassName, {
'p-colorpicker-overlay-panel': !props.inline,
'p-disabled': props.disabled,
'p-input-filled': PrimeReact.inputStyle === 'filled',
'p-ripple-disabled': PrimeReact.ripple === false
});
return /*#__PURE__*/React__namespace.createElement(CSSTransition, {
nodeRef: ref,
classNames: "p-connected-overlay",
"in": props["in"],
timeout: {
enter: 120,
exit: 100
},
options: props.transitionOptions,
unmountOnExit: true,
onEnter: props.onEnter,
onEntered: props.onEntered,
onExit: props.onExit,
onExited: props.onExited
}, /*#__PURE__*/React__namespace.createElement("div", {
ref: ref,
className: className,
style: props.panelStyle,
onClick: props.onClick
}, props.children));
};
var element = createElement();
return props.inline ? element : /*#__PURE__*/React__namespace.createElement(Portal, {
element: element,
appendTo: props.appendTo
});
});
ColorPickerPanel.displayName = 'ColorPickerPanel';
var ColorPicker = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = ColorPickerBase.getProps(inProps);
var _React$useState = React__namespace.useState(false),
_React$useState2 = _slicedToArray(_React$useState, 2),
overlayVisibleState = _React$useState2[0],
setOverlayVisibleState = _React$useState2[1];
var elementRef = React__namespace.useRef(null);
var overlayRef = React__namespace.useRef(null);
var inputRef = React__namespace.useRef(props.inputRef);
var colorSelectorRef = React__namespace.useRef(null);
var colorHandleRef = React__namespace.useRef(null);
var hueHandleRef = React__namespace.useRef(null);
var hueViewRef = React__namespace.useRef(null);
var hueDragging = React__namespace.useRef(false);
var hsbValue = React__namespace.useRef(null);
var colorDragging = React__namespace.useRef(false);
var _useOverlayListener = useOverlayListener({
target: elementRef,
overlay: overlayRef,
listener: function listener(event, _ref) {
var valid = _ref.valid;
valid && hide();
},
when: overlayVisibleState
}),
_useOverlayListener2 = _slicedToArray(_useOverlayListener, 2),
bindOverlayListener = _useOverlayListener2[0],
unbindOverlayListener = _useOverlayListener2[1];
var _useEventListener = useEventListener({
type: 'mousemove',
listener: function listener(event) {
colorDragging.current && pickColor(event);
hueDragging.current && pickHue(event);
}
}),
_useEventListener2 = _slicedToArray(_useEventListener, 2),
bindDocumentMouseMoveListener = _useEventListener2[0],
unbindDocumentMouseMoveListener = _useEventListener2[1];
var _useEventListener3 = useEventListener({
type: 'mouseup',
listener: function listener() {
colorDragging.current = hueDragging.current = false;
DomHandler.removeClass(elementRef.current, 'p-colorpicker-dragging');
unbindDocumentMouseMoveListener();
unbindDocumentMouseUpListener();
}
}),
_useEventListener4 = _slicedToArray(_useEventListener3, 2),
bindDocumentMouseUpListener = _useEventListener4[0],
unbindDocumentMouseUpListener = _useEventListener4[1];
var onPanelClick = function onPanelClick(event) {
if (!props.inline) {
OverlayService.emit('overlay-click', {
originalEvent: event,
target: elementRef.current
});
}
};
var onHueMousedown = function onHueMousedown(event) {
if (props.disabled) {
return;
}
bindDragListeners();
onHueDragStart(event);
};
var onHueDragStart = function onHueDragStart(event) {
if (props.disabled) {
return;
}
hueDragging.current = true;
pickHue(event);
DomHandler.addClass(elementRef.current, 'p-colorpicker-dragging');
};
var pickHue = function pickHue(event) {
var top = hueViewRef.current.getBoundingClientRect().top + (window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0);
hsbValue.current = validateHSB({
h: Math.floor(360 * (150 - Math.max(0, Math.min(150, (event.pageY || event.changedTouches[0].pageY) - top))) / 150),
s: 100,
b: 100
});
updateColorSelector();
updateHue();
updateModel();
};
var onColorMousedown = function onColorMousedown(event) {
if (props.disabled) {
return;
}
bindDragListeners();
onColorDragStart(event);
};
var onColorDragStart = function onColorDragStart(event) {
if (props.disabled) {
return;
}
colorDragging.current = true;
pickColor(event);
DomHandler.addClass(elementRef.current, 'p-colorpicker-dragging');
event.preventDefault();
};
var onDrag = function onDrag(event) {
if (colorDragging.current) {
pickColor(event);
event.preventDefault();
}
if (hueDragging.current) {
pickHue(event);
event.preventDefault();
}
};
var onDragEnd = function onDragEnd() {
colorDragging.current = false;
hueDragging.current = false;
DomHandler.removeClass(elementRef.current, 'p-colorpicker-dragging');
unbindDragListeners();
};
var bindDragListeners = function bindDragListeners() {
bindDocumentMouseMoveListener();
bindDocumentMouseUpListener();
};
var unbindDragListeners = function unbindDragListeners() {
unbindDocumentMouseMoveListener();
unbindDocumentMouseUpListener();
};
var pickColor = function pickColor(event) {
var rect = colorSelectorRef.current.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);
hsbValue.current = validateHSB({
h: hsbValue.current.h,
s: saturation,
b: brightness
});
updateColorHandle();
updateInput();
updateModel();
};
var updateModel = function updateModel() {
switch (props.format) {
case 'hex':
onChange(HSBtoHEX(hsbValue.current));
break;
case 'rgb':
onChange(HSBtoRGB(hsbValue.current));
break;
case 'hsb':
onChange(hsbValue.current);
break;
}
};
var toHSB = function toHSB(value) {
var hsb;
if (value) {
switch (props.format) {
case 'hex':
hsb = HEXtoHSB(value);
break;
case 'rgb':
hsb = RGBtoHSB(value);
break;
case 'hsb':
hsb = value;
break;
}
} else {
hsb = HEXtoHSB(props.defaultColor);
}
return hsb;
};
var updateHSBValue = function updateHSBValue(value) {
hsbValue.current = toHSB(value);
};
var onChange = function onChange(value) {
if (props.onChange) {
props.onChange({
value: value,
stopPropagation: function stopPropagation() {},
preventDefault: function preventDefault() {},
target: {
name: props.name,
id: props.id,
value: value
}
});
}
};
var updateColorSelector = function updateColorSelector() {
if (colorSelectorRef.current) {
var newHsbValue = validateHSB({
h: hsbValue.current.h,
s: 100,
b: 100
});
colorSelectorRef.current.style.backgroundColor = '#' + HSBtoHEX(newHsbValue);
}
};
var updateColorHandle = function updateColorHandle() {
if (colorHandleRef.current) {
colorHandleRef.current.style.left = Math.floor(150 * hsbValue.current.s / 100) + 'px';
colorHandleRef.current.style.top = Math.floor(150 * (100 - hsbValue.current.b) / 100) + 'px';
}
};
var updateHue = function updateHue() {
if (hueHandleRef.current) {
hueHandleRef.current.style.top = Math.floor(150 - 150 * hsbValue.current.h / 360) + 'px';
}
};
var updateInput = function updateInput() {
if (inputRef.current) {
inputRef.current.style.backgroundColor = '#' + HSBtoHEX(hsbValue.current);
}
};
var show = function show() {
setOverlayVisibleState(true);
};
var hide = function hide() {
setOverlayVisibleState(false);
};
var onOverlayEnter = function onOverlayEnter() {
ZIndexUtils.set('overlay', overlayRef.current, PrimeReact.autoZIndex, PrimeReact.zIndex['overlay']);
alignOverlay();
};
var onOverlayEntered = function onOverlayEntered() {
bindOverlayListener();
props.onShow && props.onShow();
};
var onOverlayExit = function onOverlayExit() {
unbindOverlayListener();
};
var onOverlayExited = function onOverlayExited() {
ZIndexUtils.clear(overlayRef.current);
props.onHide && props.onHide();
};
var onInputClick = function onInputClick() {
togglePanel();
};
var togglePanel = function togglePanel() {
overlayVisibleState ? hide() : show();
};
var onInputKeydown = function onInputKeydown(event) {
switch (event.which) {
//space
case 32:
togglePanel();
event.preventDefault();
break;
//escape and tab
case 27:
case 9:
hide();
break;
}
};
var validateHSB = 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))
};
};
var HEXtoRGB = 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
};
};
var HEXtoHSB = function HEXtoHSB(hex) {
return RGBtoHSB(HEXtoRGB(hex));
};
var RGBtoHSB = 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;
};
var HSBtoRGB = 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)
};
};
var RGBtoHEX = 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('');
};
var HSBtoHEX = function HSBtoHEX(hsb) {
return RGBtoHEX(HSBtoRGB(hsb));
};
var updateUI = function updateUI() {
updateHue();
updateColorHandle();
updateInput();
updateColorSelector();
};
var alignOverlay = function alignOverlay() {
if (inputRef.current) {
DomHandler.alignOverlay(overlayRef.current, inputRef.current.parentElement, props.appendTo || PrimeReact.appendTo);
}
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
show: show,
hide: hide,
focus: function focus() {
return DomHandler.focus(inputRef.current);
},
getElement: function getElement() {
return elementRef.current;
},
getOverlay: function getOverlay() {
return overlayRef.current;
},
getInput: function getInput() {
return inputRef.current;
}
};
});
React__namespace.useEffect(function () {
ObjectUtils.combinedRefs(inputRef, props.inputRef);
}, [inputRef, props.inputRef]);
useMountEffect(function () {
updateHSBValue(props.value);
updateUI();
});
useUpdateEffect(function () {
if (!colorDragging.current && !hueDragging.current) {
updateHSBValue(props.value);
}
}, [props.value]);
useUpdateEffect(function () {
updateUI();
});
useUnmountEffect(function () {
ZIndexUtils.clear(overlayRef.current);
});
var createColorSelector = function createColorSelector() {
return /*#__PURE__*/React__namespace.createElement("div", {
ref: colorSelectorRef,
className: "p-colorpicker-color-selector",
onMouseDown: onColorMousedown,
onTouchStart: onColorDragStart,
onTouchMove: onDrag,
onTouchEnd: onDragEnd
}, /*#__PURE__*/React__namespace.createElement("div", {
className: "p-colorpicker-color"
}, /*#__PURE__*/React__namespace.createElement("div", {
ref: colorHandleRef,
className: "p-colorpicker-color-handle"
})));
};
var createHue = function createHue() {
return /*#__PURE__*/React__namespace.createElement("div", {
ref: hueViewRef,
className: "p-colorpicker-hue",
onMouseDown: onHueMousedown,
onTouchStart: onHueDragStart,
onTouchMove: onDrag,
onTouchEnd: onDragEnd
}, /*#__PURE__*/React__namespace.createElement("div", {
ref: hueHandleRef,
className: "p-colorpicker-hue-handle"
}));
};
var createContent = function createContent() {
var colorSelector = createColorSelector();
var hue = createHue();
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-colorpicker-content"
}, colorSelector, hue);
};
var createInput = function createInput() {
if (!props.inline) {
var inputClassName = classNames('p-colorpicker-preview p-inputtext', {
'p-disabled': props.disabled
});
var inputProps = ColorPickerBase.getOtherProps(props);
return /*#__PURE__*/React__namespace.createElement("input", _extends({
ref: inputRef,
type: "text",
className: inputClassName,
readOnly: true,
id: props.inputId,
tabIndex: props.tabIndex,
disabled: props.disabled,
onClick: onInputClick,
onKeyDown: onInputKeydown
}, inputProps));
}
return null;
};
var hasTooltip = ObjectUtils.isNotEmpty(props.tooltip);
var otherProps = ColorPickerBase.getOtherProps(props);
var className = classNames('p-colorpicker p-component', {
'p-colorpicker-overlay': !props.inline
}, props.className);
var content = createContent();
var input = createInput();
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement("div", _extends({
ref: elementRef,
id: props.id,
style: props.style,
className: className
}, otherProps), input, /*#__PURE__*/React__namespace.createElement(ColorPickerPanel, {
ref: overlayRef,
appendTo: props.appendTo,
inline: props.inline,
disabled: props.disabled,
panelStyle: props.panelStyle,
panelClassName: props.panelClassName,
onClick: onPanelClick,
"in": props.inline || overlayVisibleState,
onEnter: onOverlayEnter,
onEntered: onOverlayEntered,
onExit: onOverlayExit,
onExited: onOverlayExited,
transitionOptions: props.transitionOptions
}, content)), hasTooltip && /*#__PURE__*/React__namespace.createElement(Tooltip, _extends({
target: elementRef,
content: props.tooltip
}, props.tooltipOptions)));
}));
ColorPicker.displayName = 'ColorPicker';
var Column = function Column() {};
Column.displayName = 'Column';
var ColumnGroup = function ColumnGroup() {};
ColumnGroup.displayName = 'ColumnGroup';
var DialogBase = {
defaultProps: {
__TYPE: 'Dialog',
appendTo: null,
ariaCloseIconLabel: null,
baseZIndex: 0,
blockScroll: false,
breakpoints: null,
className: null,
closable: true,
closeOnEscape: true,
contentClassName: null,
contentStyle: null,
dismissableMask: false,
draggable: true,
focusOnShow: true,
footer: null,
header: null,
headerClassName: null,
headerStyle: null,
icons: null,
id: null,
keepInViewport: true,
maskClassName: null,
maskStyle: null,
maximizable: false,
maximized: false,
minX: 0,
minY: 0,
modal: true,
onClick: null,
onDrag: null,
onDragEnd: null,
onDragStart: null,
onHide: null,
onMaskClick: null,
onMaximize: null,
onResize: null,
onResizeEnd: null,
onResizeStart: null,
onShow: null,
position: 'center',
resizable: true,
rtl: false,
showHeader: true,
style: null,
transitionOptions: null,
visible: false,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, DialogBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, DialogBase.defaultProps);
}
};
var Dialog = /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = DialogBase.getProps(inProps);
var uniqueId = props.id ? props.id : UniqueComponentId();
var _React$useState = React__namespace.useState(uniqueId),
_React$useState2 = _slicedToArray(_React$useState, 2),
idState = _React$useState2[0];
_React$useState2[1];
var _React$useState3 = React__namespace.useState(false),
_React$useState4 = _slicedToArray(_React$useState3, 2),
maskVisibleState = _React$useState4[0],
setMaskVisibleState = _React$useState4[1];
var _React$useState5 = React__namespace.useState(false),
_React$useState6 = _slicedToArray(_React$useState5, 2),
visibleState = _React$useState6[0],
setVisibleState = _React$useState6[1];
var _React$useState7 = React__namespace.useState(props.maximized),
_React$useState8 = _slicedToArray(_React$useState7, 2),
maximizedState = _React$useState8[0],
setMaximizedState = _React$useState8[1];
var dialogRef = React__namespace.useRef(null);
var maskRef = React__namespace.useRef(null);
var contentRef = React__namespace.useRef(null);
var headerRef = React__namespace.useRef(null);
var footerRef = React__namespace.useRef(null);
var closeRef = React__namespace.useRef(null);
var dragging = React__namespace.useRef(false);
var resizing = React__namespace.useRef(false);
var lastPageX = React__namespace.useRef(null);
var lastPageY = React__namespace.useRef(null);
var styleElement = React__namespace.useRef(null);
var attributeSelector = React__namespace.useRef(uniqueId);
var maximized = props.onMaximize ? props.maximized : maximizedState;
var _useEventListener = useEventListener({
type: 'keydown',
listener: function listener(event) {
return onKeyDown(event);
}
}),
_useEventListener2 = _slicedToArray(_useEventListener, 2),
bindDocumentKeyDownListener = _useEventListener2[0],
unbindDocumentKeyDownListener = _useEventListener2[1];
var _useEventListener3 = useEventListener({
type: 'mousemove',
target: function target() {
return window.document;
},
listener: function listener(event) {
return onResize(event);
}
}),
_useEventListener4 = _slicedToArray(_useEventListener3, 2),
bindDocumentResizeListener = _useEventListener4[0],
unbindDocumentResizeListener = _useEventListener4[1];
var _useEventListener5 = useEventListener({
type: 'mouseup',
target: function target() {
return window.document;
},
listener: function listener(event) {
return onResizeEnd(event);
}
}),
_useEventListener6 = _slicedToArray(_useEventListener5, 2),
bindDocumentResizeEndListener = _useEventListener6[0],
unbindDocumentResizEndListener = _useEventListener6[1];
var _useEventListener7 = useEventListener({
type: 'mousemove',
target: function target() {
return window.document;
},
listener: function listener(event) {
return onDrag(event);
}
}),
_useEventListener8 = _slicedToArray(_useEventListener7, 2),
bindDocumentDragListener = _useEventListener8[0],
unbindDocumentDragListener = _useEventListener8[1];
var _useEventListener9 = useEventListener({
type: 'mouseup',
target: function target() {
return window.document;
},
listener: function listener(event) {
return onDragEnd(event);
}
}),
_useEventListener10 = _slicedToArray(_useEventListener9, 2),
bindDocumentDragEndListener = _useEventListener10[0],
unbindDocumentDragEndListener = _useEventListener10[1];
var onClose = function onClose(event) {
props.onHide();
event.preventDefault();
};
var focus = function focus() {
var activeElement = document.activeElement;
var isActiveElementInDialog = activeElement && dialogRef.current && dialogRef.current.contains(activeElement);
if (!isActiveElementInDialog && props.closable && props.showHeader) {
closeRef.current.focus();
}
};
var onMaskClick = function onMaskClick(event) {
if (props.dismissableMask && props.modal && maskRef.current === event.target) {
onClose(event);
}
props.onMaskClick && props.onMaskClick(event);
};
var toggleMaximize = function toggleMaximize(event) {
if (props.onMaximize) {
props.onMaximize({
originalEvent: event,
maximized: !maximized
});
} else {
setMaximizedState(function (prevMaximized) {
return !prevMaximized;
});
}
event.preventDefault();
};
var onKeyDown = function onKeyDown(event) {
var currentTarget = event.currentTarget;
if (!currentTarget || !currentTarget.primeDialogParams) {
return;
}
var params = currentTarget.primeDialogParams;
var paramLength = params.length;
var dialogId = params[paramLength - 1] ? params[paramLength - 1].id : undefined;
if (dialogId !== idState) {
return;
}
var dialog = document.getElementById(dialogId);
if (props.closable && props.closeOnEscape && event.key === 'Escape') {
onClose(event);
event.stopImmediatePropagation();
params.splice(paramLength - 1, 1);
} else if (event.key === 'Tab') {
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 onDragStart = function onDragStart(event) {
if (DomHandler.hasClass(event.target, 'p-dialog-header-icon') || DomHandler.hasClass(event.target.parentElement, 'p-dialog-header-icon')) {
return;
}
if (props.draggable) {
dragging.current = true;
lastPageX.current = event.pageX;
lastPageY.current = event.pageY;
dialogRef.current.style.margin = '0';
DomHandler.addClass(document.body, 'p-unselectable-text');
props.onDragStart && props.onDragStart(event);
}
};
var onDrag = function onDrag(event) {
if (dragging.current) {
var width = DomHandler.getOuterWidth(dialogRef.current);
var height = DomHandler.getOuterHeight(dialogRef.current);
var deltaX = event.pageX - lastPageX.current;
var deltaY = event.pageY - lastPageY.current;
var offset = dialogRef.current.getBoundingClientRect();
var leftPos = offset.left + deltaX;
var topPos = offset.top + deltaY;
var viewport = DomHandler.getViewport();
dialogRef.current.style.position = 'fixed';
if (props.keepInViewport) {
if (leftPos >= props.minX && leftPos + width < viewport.width) {
lastPageX.current = event.pageX;
dialogRef.current.style.left = leftPos + 'px';
}
if (topPos >= props.minY && topPos + height < viewport.height) {
lastPageY.current = event.pageY;
dialogRef.current.style.top = topPos + 'px';
}
} else {
lastPageX.current = event.pageX;
dialogRef.current.style.left = leftPos + 'px';
lastPageY.current = event.pageY;
dialogRef.current.style.top = topPos + 'px';
}
props.onDrag && props.onDrag(event);
}
};
var onDragEnd = function onDragEnd(event) {
if (dragging.current) {
dragging.current = false;
DomHandler.removeClass(document.body, 'p-unselectable-text');
props.onDragEnd && props.onDragEnd(event);
}
};
var onResizeStart = function onResizeStart(event) {
if (props.resizable) {
resizing.current = true;
lastPageX.current = event.pageX;
lastPageY.current = event.pageY;
DomHandler.addClass(document.body, 'p-unselectable-text');
props.onResizeStart && props.onResizeStart(event);
}
};
var convertToPx = 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;
};
var onResize = function onResize(event) {
if (resizing.current) {
var deltaX = event.pageX - lastPageX.current;
var deltaY = event.pageY - lastPageY.current;
var width = DomHandler.getOuterWidth(dialogRef.current);
var height = DomHandler.getOuterHeight(dialogRef.current);
var offset = dialogRef.current.getBoundingClientRect();
var viewport = DomHandler.getViewport();
var hasBeenDragged = !parseInt(dialogRef.current.style.top) || !parseInt(dialogRef.current.style.left);
var minWidth = convertToPx(dialogRef.current.style.minWidth, 'width', viewport);
var minHeight = convertToPx(dialogRef.current.style.minHeight, 'height', viewport);
var newWidth = width + deltaX;
var newHeight = height + deltaY;
if (hasBeenDragged) {
newWidth += deltaX;
newHeight += deltaY;
}
if ((!minWidth || newWidth > minWidth) && offset.left + newWidth < viewport.width) {
dialogRef.current.style.width = newWidth + 'px';
}
if ((!minHeight || newHeight > minHeight) && offset.top + newHeight < viewport.height) {
dialogRef.current.style.height = newHeight + 'px';
}
lastPageX.current = event.pageX;
lastPageY.current = event.pageY;
props.onResize && props.onResize(event);
}
};
var onResizeEnd = function onResizeEnd(event) {
if (resizing.current) {
resizing.current = false;
DomHandler.removeClass(document.body, 'p-unselectable-text');
props.onResizeEnd && props.onResizeEnd(event);
}
};
var resetPosition = function resetPosition() {
dialogRef.current.style.position = '';
dialogRef.current.style.left = '';
dialogRef.current.style.top = '';
dialogRef.current.style.margin = '';
};
var getPositionClass = function getPositionClass() {
var positions = ['center', 'left', 'right', 'top', 'top-left', 'top-right', 'bottom', 'bottom-left', 'bottom-right'];
var pos = positions.find(function (item) {
return item === props.position || item.replace('-', '') === props.position;
});
return pos ? "p-dialog-".concat(pos) : '';
};
var onEnter = function onEnter() {
dialogRef.current.setAttribute(attributeSelector.current, '');
};
var onEntered = function onEntered() {
props.onShow && props.onShow();
if (props.focusOnShow) {
focus();
}
enableDocumentSettings();
};
var onExiting = function onExiting() {
if (props.modal) {
DomHandler.addClass(maskRef.current, 'p-component-overlay-leave');
}
if (props.blockScroll) {
DomHandler.removeClass(document.body, 'p-overflow-hidden');
}
};
var onExited = function onExited() {
dragging.current = false;
ZIndexUtils.clear(maskRef.current);
setMaskVisibleState(false);
disableDocumentSettings();
};
var enableDocumentSettings = function enableDocumentSettings() {
bindGlobalListeners();
if (props.blockScroll || props.maximizable && maximized) {
DomHandler.addClass(document.body, 'p-overflow-hidden');
}
};
var disableDocumentSettings = function disableDocumentSettings() {
unbindGlobalListeners();
var isMaximized = props.maximizable && maximized;
if (props.modal) {
var hasBlockScroll = document.primeDialogParams && document.primeDialogParams.some(function (param) {
return param.hasBlockScroll;
});
if (hasBlockScroll || isMaximized) {
DomHandler.removeClass(document.body, 'p-overflow-hidden');
}
} else if (props.blockScroll || isMaximized) {
DomHandler.removeClass(document.body, 'p-overflow-hidden');
}
};
var bindGlobalListeners = function bindGlobalListeners() {
if (props.draggable) {
bindDocumentDragListener();
bindDocumentDragEndListener();
}
if (props.resizable) {
bindDocumentResizeListener();
bindDocumentResizeEndListener();
}
bindDocumentKeyDownListener();
var newParam = {
id: idState,
hasBlockScroll: props.blockScroll
};
document.primeDialogParams = document.primeDialogParams ? [].concat(_toConsumableArray(document.primeDialogParams), [newParam]) : [newParam];
};
var unbindGlobalListeners = function unbindGlobalListeners() {
unbindDocumentDragListener();
unbindDocumentDragEndListener();
unbindDocumentResizeListener();
unbindDocumentResizEndListener();
unbindDocumentKeyDownListener();
document.primeDialogParams = document.primeDialogParams && document.primeDialogParams.filter(function (param) {
return param.id !== idState;
});
};
var createStyle = function createStyle() {
styleElement.current = DomHandler.createInlineStyle(PrimeReact.nonce);
var innerHTML = '';
for (var breakpoint in props.breakpoints) {
innerHTML += "\n @media screen and (max-width: ".concat(breakpoint, ") {\n .p-dialog[").concat(attributeSelector.current, "] {\n width: ").concat(props.breakpoints[breakpoint], " !important;\n }\n }\n ");
}
styleElement.current.innerHTML = innerHTML;
};
var changeScrollOnMaximizable = function changeScrollOnMaximizable() {
if (!props.blockScroll) {
var funcName = maximized ? 'addClass' : 'removeClass';
DomHandler[funcName](document.body, 'p-overflow-hidden');
}
};
useMountEffect(function () {
if (props.visible) {
setMaskVisibleState(true);
}
if (props.breakpoints) {
createStyle();
}
});
useUpdateEffect(function () {
if (props.visible && !maskVisibleState) {
setMaskVisibleState(true);
}
if (props.visible !== visibleState && maskVisibleState) {
setVisibleState(props.visible);
}
});
useUpdateEffect(function () {
if (maskVisibleState) {
ZIndexUtils.set('modal', maskRef.current, PrimeReact.autoZIndex, props.baseZIndex || PrimeReact.zIndex['modal']);
setVisibleState(true);
}
}, [maskVisibleState]);
useUpdateEffect(function () {
changeScrollOnMaximizable();
}, [props.maximized, maximizedState]);
useUnmountEffect(function () {
disableDocumentSettings();
DomHandler.removeInlineStyle(styleElement.current);
ZIndexUtils.clear(maskRef.current);
});
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
resetPosition: resetPosition,
getElement: function getElement() {
return dialogRef.current;
},
getMask: function getMask() {
return maskRef.current;
},
getContent: function getContent() {
return contentRef.current;
},
getHeader: function getHeader() {
return headerRef.current;
},
getFooter: function getFooter() {
return footerRef.current;
},
getCloseButton: function getCloseButton() {
return closeRef.current;
}
};
});
var createCloseIcon = function createCloseIcon() {
if (props.closable) {
var ariaLabel = props.ariaCloseIconLabel || localeOption('close');
return /*#__PURE__*/React__namespace.createElement("button", {
ref: closeRef,
type: "button",
className: "p-dialog-header-icon p-dialog-header-close p-link",
"aria-label": ariaLabel,
onClick: onClose
}, /*#__PURE__*/React__namespace.createElement("span", {
className: "p-dialog-header-close-icon pi pi-times",
"aria-hidden": "true"
}), /*#__PURE__*/React__namespace.createElement(Ripple, null));
}
return null;
};
var createMaximizeIcon = function createMaximizeIcon() {
var iconClassName = classNames('p-dialog-header-maximize-icon pi', {
'pi-window-maximize': !maximized,
'pi-window-minimize': maximized
});
if (props.maximizable) {
return /*#__PURE__*/React__namespace.createElement("button", {
type: "button",
className: "p-dialog-header-icon p-dialog-header-maximize p-link",
onClick: toggleMaximize
}, /*#__PURE__*/React__namespace.createElement("span", {
className: iconClassName
}), /*#__PURE__*/React__namespace.createElement(Ripple, null));
}
return null;
};
var createHeader = function createHeader() {
if (props.showHeader) {
var closeIcon = createCloseIcon();
var maximizeIcon = createMaximizeIcon();
var icons = ObjectUtils.getJSXElement(props.icons, props);
var header = ObjectUtils.getJSXElement(props.header, props);
var headerId = idState + '_header';
var headerClassName = classNames('p-dialog-header', props.headerClassName);
return /*#__PURE__*/React__namespace.createElement("div", {
ref: headerRef,
style: props.headerStyle,
className: headerClassName,
onMouseDown: onDragStart
}, /*#__PURE__*/React__namespace.createElement("div", {
id: headerId,
className: "p-dialog-title"
}, header), /*#__PURE__*/React__namespace.createElement("div", {
className: "p-dialog-header-icons"
}, icons, maximizeIcon, closeIcon));
}
return null;
};
var createContent = function createContent() {
var className = classNames('p-dialog-content', props.contentClassName);
var contentId = idState + '_content';
return /*#__PURE__*/React__namespace.createElement("div", {
id: contentId,
ref: contentRef,
className: className,
style: props.contentStyle
}, props.children);
};
var createFooter = function createFooter() {
var footer = ObjectUtils.getJSXElement(props.footer, props);
return footer && /*#__PURE__*/React__namespace.createElement("div", {
ref: footerRef,
className: "p-dialog-footer"
}, footer);
};
var createResizer = function createResizer() {
if (props.resizable) {
return /*#__PURE__*/React__namespace.createElement("span", {
className: "p-resizable-handle",
style: {
zIndex: 90
},
onMouseDown: onResizeStart
});
}
return null;
};
var createElement = function createElement() {
var otherProps = DialogBase.getOtherProps(props);
var className = classNames('p-dialog p-component', props.className, {
'p-dialog-rtl': props.rtl,
'p-dialog-maximized': maximized,
'p-dialog-default': !maximized,
'p-input-filled': PrimeReact.inputStyle === 'filled',
'p-ripple-disabled': PrimeReact.ripple === false
});
var maskClassName = classNames('p-dialog-mask', getPositionClass(), {
'p-component-overlay p-component-overlay-enter': props.modal,
'p-dialog-visible': maskVisibleState,
'p-dialog-draggable': props.draggable,
'p-dialog-resizable': props.resizable
}, props.maskClassName);
var header = createHeader();
var content = createContent();
var footer = createFooter();
var resizer = createResizer();
var headerId = idState + '_header';
var contentId = idState + '_content';
var transitionTimeout = {
enter: props.position === 'center' ? 150 : 300,
exit: props.position === 'center' ? 150 : 300
};
return /*#__PURE__*/React__namespace.createElement("div", {
ref: maskRef,
style: props.maskStyle,
className: maskClassName,
onClick: onMaskClick
}, /*#__PURE__*/React__namespace.createElement(CSSTransition, {
nodeRef: dialogRef,
classNames: "p-dialog",
timeout: transitionTimeout,
"in": visibleState,
options: props.transitionOptions,
unmountOnExit: true,
onEnter: onEnter,
onEntered: onEntered,
onExiting: onExiting,
onExited: onExited
}, /*#__PURE__*/React__namespace.createElement("div", _extends({
ref: dialogRef,
id: idState,
className: className,
style: props.style,
onClick: props.onClick,
role: "dialog"
}, otherProps, {
"aria-labelledby": headerId,
"aria-describedby": contentId,
"aria-modal": props.modal
}), header, content, footer, resizer)));
};
var createDialog = function createDialog() {
var element = createElement();
return /*#__PURE__*/React__namespace.createElement(Portal, {
element: element,
appendTo: props.appendTo,
visible: true
});
};
return maskVisibleState && createDialog();
});
Dialog.displayName = 'Dialog';
var ConfirmDialogBase = {
defaultProps: {
__TYPE: 'ConfirmDialog',
tagKey: undefined,
visible: undefined,
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,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, ConfirmDialogBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, ConfirmDialogBase.defaultProps);
}
};
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 confirmDialog = function confirmDialog() {
var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
props = _objectSpread$t(_objectSpread$t({}, props), {
visible: props.visible === undefined ? true : props.visible
});
props.visible && OverlayService.emit('confirm-dialog', props);
var show = function show() {
var updatedProps = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
OverlayService.emit('confirm-dialog', _objectSpread$t(_objectSpread$t(_objectSpread$t({}, props), updatedProps), {
visible: true
}));
};
var hide = function hide() {
OverlayService.emit('confirm-dialog', {
visible: false
});
};
return {
show: show,
hide: hide
};
};
var ConfirmDialog = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = ConfirmDialogBase.getProps(inProps);
var _React$useState = React__namespace.useState(props.visible),
_React$useState2 = _slicedToArray(_React$useState, 2),
visibleState = _React$useState2[0],
setVisibleState = _React$useState2[1];
var _React$useState3 = React__namespace.useState(false),
_React$useState4 = _slicedToArray(_React$useState3, 2),
reshowState = _React$useState4[0],
setReshowState = _React$useState4[1];
var confirmProps = React__namespace.useRef(null);
var getCurrentProps = function getCurrentProps() {
return confirmProps.current || props;
};
var getPropValue = function getPropValue(key) {
return (confirmProps.current || props)[key];
};
var callbackFromProp = function callbackFromProp(key) {
for (var _len = arguments.length, param = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
param[_key - 1] = arguments[_key];
}
return ObjectUtils.getPropValue(getPropValue(key), param);
};
var acceptLabel = getPropValue('acceptLabel') || localeOption('accept');
var rejectLabel = getPropValue('rejectLabel') || localeOption('reject');
var accept = function accept() {
callbackFromProp('accept');
hide('accept');
};
var reject = function reject() {
callbackFromProp('reject');
hide('reject');
};
var show = function show() {
setVisibleState(true);
};
var hide = function hide() {
var result = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'cancel';
setVisibleState(false);
callbackFromProp('onHide', result);
};
var confirm = function confirm(updatedProps) {
if (updatedProps.tagKey === props.tagKey) {
var isVisibleChanged = visibleState !== updatedProps.visible;
var targetChanged = getPropValue('target') !== updatedProps.target;
if (targetChanged && !props.target) {
hide();
confirmProps.current = updatedProps;
setReshowState(true);
} else if (isVisibleChanged) {
confirmProps.current = updatedProps;
updatedProps.visible ? show() : hide();
}
}
};
React__namespace.useEffect(function () {
props.visible ? show() : hide();
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [props.visible]);
React__namespace.useEffect(function () {
if (!props.target && !props.message) {
OverlayService.on('confirm-dialog', confirm);
}
return function () {
OverlayService.off('confirm-dialog', confirm);
};
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [props.target]);
useUpdateEffect(function () {
reshowState && show();
}, [reshowState]);
useUnmountEffect(function () {
OverlayService.off('confirm-dialog', confirm);
});
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
confirm: confirm
};
});
var createFooter = function createFooter() {
var acceptClassName = classNames('p-confirm-dialog-accept', getPropValue('acceptClassName'));
var rejectClassName = classNames('p-confirm-dialog-reject', {
'p-button-text': !getPropValue('rejectClassName')
}, getPropValue('rejectClassName'));
var content = /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement(Button, {
label: rejectLabel,
icon: getPropValue('rejectIcon'),
className: rejectClassName,
onClick: reject
}), /*#__PURE__*/React__namespace.createElement(Button, {
label: acceptLabel,
icon: getPropValue('acceptIcon'),
className: acceptClassName,
onClick: accept,
autoFocus: true
}));
if (getPropValue('footer')) {
var defaultContentOptions = {
accept: accept,
reject: reject,
acceptClassName: acceptClassName,
rejectClassName: rejectClassName,
acceptLabel: acceptLabel,
rejectLabel: rejectLabel,
element: content,
props: getCurrentProps()
};
return ObjectUtils.getJSXElement(getPropValue('footer'), defaultContentOptions);
}
return content;
};
var createElement = function createElement() {
var currentProps = getCurrentProps();
var className = classNames('p-confirm-dialog', getPropValue('className'));
var otherProps = ConfirmDialogBase.getOtherProps(currentProps);
var message = ObjectUtils.getJSXElement(getPropValue('message'), currentProps);
var icon = IconUtils.getJSXIcon(getPropValue('icon'), {
className: 'p-confirm-dialog-icon'
}, {
props: currentProps
});
var footer = createFooter();
return /*#__PURE__*/React__namespace.createElement(Dialog, _extends({
visible: visibleState
}, otherProps, {
className: className,
footer: footer,
onHide: hide,
breakpoints: getPropValue('breakpoints')
}), icon, /*#__PURE__*/React__namespace.createElement("span", {
className: "p-confirm-dialog-message"
}, message));
};
var element = createElement();
return /*#__PURE__*/React__namespace.createElement(Portal, {
element: element,
appendTo: getPropValue('appendTo')
});
}));
ConfirmDialog.displayName = 'ConfirmDialog';
var ConfirmPopupBase = {
defaultProps: {
__TYPE: 'ConfirmPopup',
tagKey: undefined,
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,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, ConfirmPopupBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, ConfirmPopupBase.defaultProps);
}
};
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; }
var confirmPopup = function confirmPopup() {
var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
props = _objectSpread$s(_objectSpread$s({}, props), {
visible: props.visible === undefined ? true : props.visible
});
props.visible && OverlayService.emit('confirm-popup', props);
var show = function show() {
var updatedProps = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
OverlayService.emit('confirm-popup', _objectSpread$s(_objectSpread$s(_objectSpread$s({}, props), updatedProps), {
visible: true
}));
};
var hide = function hide() {
OverlayService.emit('confirm-popup', {
visible: false
});
};
return {
show: show,
hide: hide
};
};
var ConfirmPopup = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = ConfirmPopupBase.getProps(inProps);
var _React$useState = React__namespace.useState(props.visible),
_React$useState2 = _slicedToArray(_React$useState, 2),
visibleState = _React$useState2[0],
setVisibleState = _React$useState2[1];
var _React$useState3 = React__namespace.useState(false),
_React$useState4 = _slicedToArray(_React$useState3, 2),
reshowState = _React$useState4[0],
setReshowState = _React$useState4[1];
var overlayRef = React__namespace.useRef(null);
var acceptBtnRef = React__namespace.useRef(null);
var isPanelClicked = React__namespace.useRef(false);
var overlayEventListener = React__namespace.useRef(null);
var confirmProps = React__namespace.useRef(null);
var getCurrentProps = function getCurrentProps() {
return confirmProps.current || props;
};
var getPropValue = function getPropValue(key) {
return (confirmProps.current || props)[key];
};
var callbackFromProp = function callbackFromProp(key) {
for (var _len = arguments.length, param = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
param[_key - 1] = arguments[_key];
}
return ObjectUtils.getPropValue(getPropValue(key), param);
};
var acceptLabel = getPropValue('acceptLabel') || localeOption('accept');
var rejectLabel = getPropValue('rejectLabel') || localeOption('reject');
var _useOverlayListener = useOverlayListener({
target: getPropValue('target'),
overlay: overlayRef,
listener: function listener(event, _ref) {
var type = _ref.type,
valid = _ref.valid;
if (valid) {
type === 'outside' ? props.dismissable && !isPanelClicked.current && hide('hide') : hide('hide');
}
isPanelClicked.current = false;
},
when: visibleState
}),
_useOverlayListener2 = _slicedToArray(_useOverlayListener, 2),
bindOverlayListener = _useOverlayListener2[0],
unbindOverlayListener = _useOverlayListener2[1];
var onPanelClick = function onPanelClick(event) {
isPanelClicked.current = true;
OverlayService.emit('overlay-click', {
originalEvent: event,
target: getPropValue('target')
});
};
var accept = function accept() {
callbackFromProp('accept');
hide('accept');
};
var reject = function reject() {
callbackFromProp('reject');
hide('reject');
};
var show = function show() {
setVisibleState(true);
setReshowState(false);
overlayEventListener.current = function (e) {
!isOutsideClicked(e.target) && (isPanelClicked.current = true);
};
OverlayService.on('overlay-click', overlayEventListener.current);
};
var hide = function hide(result) {
setVisibleState(false);
OverlayService.off('overlay-click', overlayEventListener.current);
overlayEventListener.current = null;
if (result) {
callbackFromProp('onHide', result);
}
};
var onEnter = function onEnter() {
ZIndexUtils.set('overlay', overlayRef.current, PrimeReact.autoZIndex, PrimeReact.zIndex['overlay']);
align();
};
var onEntered = function onEntered() {
bindOverlayListener();
if (acceptBtnRef.current) {
acceptBtnRef.current.focus();
}
callbackFromProp('onShow');
};
var onExit = function onExit() {
unbindOverlayListener();
};
var onExited = function onExited() {
ZIndexUtils.clear(overlayRef.current);
isPanelClicked.current = false;
};
var align = function align() {
if (getPropValue('target')) {
DomHandler.absolutePosition(overlayRef.current, getPropValue('target'));
var containerOffset = DomHandler.getOffset(overlayRef.current);
var targetOffset = DomHandler.getOffset(getPropValue('target'));
var arrowLeft = 0;
if (containerOffset.left < targetOffset.left) {
arrowLeft = targetOffset.left - containerOffset.left;
}
overlayRef.current.style.setProperty('--overlayArrowLeft', "".concat(arrowLeft, "px"));
if (containerOffset.top < targetOffset.top) {
DomHandler.addClass(overlayRef.current, 'p-confirm-popup-flipped');
}
}
};
var isOutsideClicked = function isOutsideClicked(target) {
return overlayRef && overlayRef.current && !(overlayRef.current.isSameNode(target) || overlayRef.current.contains(target));
};
var confirm = function confirm(updatedProps) {
if (updatedProps.tagKey === props.tagKey) {
var isVisibleChanged = visibleState !== updatedProps.visible;
var targetChanged = getPropValue('target') !== updatedProps.target;
if (targetChanged && !props.target) {
hide();
confirmProps.current = updatedProps;
setReshowState(true);
} else if (isVisibleChanged) {
confirmProps.current = updatedProps;
updatedProps.visible ? show() : hide();
}
}
};
React__namespace.useEffect(function () {
props.visible ? show() : hide();
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [props.visible]);
React__namespace.useEffect(function () {
if (!props.target && !props.message) {
OverlayService.on('confirm-popup', confirm);
}
return function () {
OverlayService.off('confirm-popup', confirm);
};
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [props.target]);
useUpdateEffect(function () {
reshowState && show();
}, [reshowState]);
useUnmountEffect(function () {
if (overlayEventListener.current) {
OverlayService.off('overlay-click', overlayEventListener.current);
overlayEventListener.current = null;
}
OverlayService.off('confirm-popup', confirm);
ZIndexUtils.clear(overlayRef.current);
});
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
confirm: confirm
};
});
var createContent = function createContent() {
var currentProps = getCurrentProps();
var message = ObjectUtils.getJSXElement(getPropValue('message'), currentProps);
var icon = IconUtils.getJSXIcon(getPropValue('icon'), {
className: 'p-confirm-popup-icon'
}, {
props: currentProps
});
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-confirm-popup-content"
}, icon, /*#__PURE__*/React__namespace.createElement("span", {
className: "p-confirm-popup-message"
}, message));
};
var createFooter = function createFooter() {
var acceptClassName = classNames('p-confirm-popup-accept p-button-sm', getPropValue('acceptClassName'));
var rejectClassName = classNames('p-confirm-popup-reject p-button-sm', {
'p-button-text': !getPropValue('rejectClassName')
}, getPropValue('rejectClassName'));
var content = /*#__PURE__*/React__namespace.createElement("div", {
className: "p-confirm-popup-footer"
}, /*#__PURE__*/React__namespace.createElement(Button, {
label: rejectLabel,
icon: getPropValue('rejectIcon'),
className: rejectClassName,
onClick: reject
}), /*#__PURE__*/React__namespace.createElement(Button, {
ref: acceptBtnRef,
label: acceptLabel,
icon: getPropValue('acceptIcon'),
className: acceptClassName,
onClick: accept
}));
if (getPropValue('footer')) {
var defaultContentOptions = {
accept: accept,
reject: reject,
className: 'p-confirm-popup-footer',
acceptClassName: acceptClassName,
rejectClassName: rejectClassName,
acceptLabel: acceptLabel,
rejectLabel: rejectLabel,
element: content,
props: getCurrentProps()
};
return ObjectUtils.getJSXElement(getPropValue('footer'), defaultContentOptions);
}
return content;
};
var createElement = function createElement() {
var otherProps = ConfirmPopupBase.getOtherProps(props);
var className = classNames('p-confirm-popup p-component', getPropValue('className'), {
'p-input-filled': PrimeReact.inputStyle === 'filled',
'p-ripple-disabled': PrimeReact.ripple === false
});
var content = createContent();
var footer = createFooter();
return /*#__PURE__*/React__namespace.createElement(CSSTransition, {
nodeRef: overlayRef,
classNames: "p-connected-overlay",
"in": visibleState,
timeout: {
enter: 120,
exit: 100
},
options: getPropValue('transitionOptions'),
unmountOnExit: true,
onEnter: onEnter,
onEntered: onEntered,
onExit: onExit,
onExited: onExited
}, /*#__PURE__*/React__namespace.createElement("div", _extends({
ref: overlayRef,
id: getPropValue('id'),
className: className,
style: getPropValue('style')
}, otherProps, {
onClick: onPanelClick
}), content, footer));
};
var element = createElement();
return /*#__PURE__*/React__namespace.createElement(Portal, {
element: element,
appendTo: getPropValue('appendTo'),
visible: getPropValue('visible')
});
}));
ConfirmPopup.displayName = 'ConfirmPopup';
var ContextMenuBase = {
defaultProps: {
__TYPE: 'ContextMenu',
id: null,
model: null,
style: null,
className: null,
global: false,
autoZIndex: true,
baseZIndex: 0,
breakpoint: undefined,
scrollHeight: '400px',
appendTo: null,
transitionOptions: null,
onShow: null,
onHide: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, ContextMenuBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, ContextMenuBase.defaultProps);
}
};
var ContextMenuSub = /*#__PURE__*/React__namespace.memo(function (props) {
var _React$useState = React__namespace.useState(null),
_React$useState2 = _slicedToArray(_React$useState, 2),
activeItemState = _React$useState2[0],
setActiveItemState = _React$useState2[1];
var submenuRef = React__namespace.useRef(null);
var active = props.root || !props.resetMenu;
if (props.resetMenu === true && activeItemState !== null) {
setActiveItemState(null);
}
var onItemMouseEnter = function onItemMouseEnter(event, item) {
if (item.disabled || props.isMobileMode) {
event.preventDefault();
return;
}
setActiveItemState(item);
};
var onItemClick = 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 (props.isMobileMode && item.items) {
if (activeItemState && item === activeItemState) setActiveItemState(null);else setActiveItemState(item);
}
if (!item.items) {
props.onLeafClick(event);
}
};
var position = function position() {
if (!props.isMobileMode) {
var parentItem = submenuRef.current.parentElement;
var containerOffset = DomHandler.getOffset(parentItem);
var viewport = DomHandler.getViewport();
var sublistWidth = submenuRef.current.offsetParent ? submenuRef.current.offsetWidth : DomHandler.getHiddenElementOuterWidth(submenuRef.current);
var itemOuterWidth = DomHandler.getOuterWidth(parentItem.children[0]);
var top = parseInt(containerOffset.top, 10) + submenuRef.current.offsetHeight - DomHandler.getWindowScrollTop();
if (top > viewport.height) {
submenuRef.current.style.top = viewport.height - top + 'px';
} else {
submenuRef.current.style.top = '0px';
}
if (parseInt(containerOffset.left, 10) + itemOuterWidth + sublistWidth > viewport.width - DomHandler.calculateScrollbarWidth()) {
submenuRef.current.style.left = -1 * sublistWidth + 'px';
} else {
submenuRef.current.style.left = itemOuterWidth + 'px';
}
}
};
var onEnter = function onEnter() {
position();
};
useUpdateEffect(function () {
active && position();
});
var createSeparator = function createSeparator(index) {
return /*#__PURE__*/React__namespace.createElement("li", {
key: 'separator_' + index,
className: "p-menu-separator",
role: "separator"
});
};
var createSubmenu = function createSubmenu(item) {
if (item.items) {
return /*#__PURE__*/React__namespace.createElement(ContextMenuSub, {
menuProps: props.menuProps,
model: item.items,
resetMenu: item !== activeItemState,
onLeafClick: props.onLeafClick,
isMobileMode: props.isMobileMode
});
}
return null;
};
var createMenuItem = function createMenuItem(item, index) {
if (item.visible === false) {
return null;
}
var active = activeItemState === item;
var key = item.label + '_' + index;
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 = IconUtils.getJSXIcon(item.icon, {
className: 'p-menuitem-icon'
}, {
props: props.menuProps
});
var label = item.label && /*#__PURE__*/React__namespace.createElement("span", {
className: "p-menuitem-text"
}, item.label);
var submenuIcon = item.items && /*#__PURE__*/React__namespace.createElement("span", {
className: submenuIconClassName
});
var submenu = createSubmenu(item);
var content = /*#__PURE__*/React__namespace.createElement("a", {
href: item.url || '#',
className: linkClassName,
target: item.target,
onClick: function onClick(event) {
return onItemClick(event, item);
},
role: "menuitem",
"aria-haspopup": item.items != null,
"aria-disabled": item.disabled
}, icon, label, submenuIcon, /*#__PURE__*/React__namespace.createElement(Ripple, null));
if (item.template) {
var defaultContentOptions = {
onClick: function onClick(event) {
return onItemClick(event, item);
},
className: linkClassName,
labelClassName: 'p-menuitem-text',
iconClassName: iconClassName,
submenuIconClassName: submenuIconClassName,
element: content,
props: props,
active: active
};
content = ObjectUtils.getJSXElement(item.template, item, defaultContentOptions);
}
return /*#__PURE__*/React__namespace.createElement("li", {
key: key,
role: "none",
id: item.id,
className: className,
style: item.style,
onMouseEnter: function onMouseEnter(event) {
return onItemMouseEnter(event, item);
}
}, content, submenu);
};
var createItem = function createItem(item, index) {
return item.separator ? createSeparator(index) : createMenuItem(item, index);
};
var createMenu = function createMenu() {
return props.model ? props.model.map(createItem) : null;
};
var className = classNames({
'p-submenu-list': !props.root
});
var submenu = createMenu();
return /*#__PURE__*/React__namespace.createElement(CSSTransition, {
nodeRef: submenuRef,
classNames: "p-contextmenusub",
"in": active,
timeout: {
enter: 0,
exit: 0
},
unmountOnExit: true,
onEnter: onEnter
}, /*#__PURE__*/React__namespace.createElement("ul", {
ref: submenuRef,
className: className
}, submenu));
});
ContextMenuSub.displayName = 'ContextMenuSub';
var ContextMenu = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = ContextMenuBase.getProps(inProps);
var _React$useState = React__namespace.useState(false),
_React$useState2 = _slicedToArray(_React$useState, 2),
visibleState = _React$useState2[0],
setVisibleState = _React$useState2[1];
var _React$useState3 = React__namespace.useState(false),
_React$useState4 = _slicedToArray(_React$useState3, 2),
reshowState = _React$useState4[0],
setReshowState = _React$useState4[1];
var _React$useState5 = React__namespace.useState(false),
_React$useState6 = _slicedToArray(_React$useState5, 2),
resetMenuState = _React$useState6[0],
setResetMenuState = _React$useState6[1];
var _React$useState7 = React__namespace.useState(null),
_React$useState8 = _slicedToArray(_React$useState7, 2),
attributeSelectorState = _React$useState8[0],
setAttributeSelectorState = _React$useState8[1];
var menuRef = React__namespace.useRef(null);
var currentEvent = React__namespace.useRef(null);
var styleElementRef = React__namespace.useRef(null);
var isMobileMode = useMatchMedia("screen and (max-width: ".concat(props.breakpoint, ")"), !!props.breakpoint);
var _useEventListener = useEventListener({
type: 'click',
listener: function listener(event) {
if (isOutsideClicked(event) && event.button !== 2) {
hide(event);
setResetMenuState(true);
}
}
}),
_useEventListener2 = _slicedToArray(_useEventListener, 2),
bindDocumentClickListener = _useEventListener2[0],
unbindDocumentClickListener = _useEventListener2[1];
var _useEventListener3 = useEventListener({
type: 'contextmenu',
listener: function listener(event) {
show(event);
}
}),
_useEventListener4 = _slicedToArray(_useEventListener3, 1),
bindDocumentContextMenuListener = _useEventListener4[0];
var _useResizeListener = useResizeListener({
listener: function listener(event) {
if (visibleState && !DomHandler.isTouchDevice()) {
hide(event);
}
}
}),
_useResizeListener2 = _slicedToArray(_useResizeListener, 2),
bindDocumentResizeListener = _useResizeListener2[0],
unbindDocumentResizeListener = _useResizeListener2[1];
var createStyle = function createStyle() {
if (!styleElementRef.current) {
styleElementRef.current = DomHandler.createInlineStyle(PrimeReact.nonce);
var selector = "".concat(attributeSelectorState);
var innerHTML = "\n@media screen and (max-width: ".concat(props.breakpoint, ") {\n .p-contextmenu[").concat(selector, "] > ul {\n max-height: ").concat(props.scrollHeight, ";\n overflow: ").concat(props.scrollHeight ? 'auto' : '', ";\n }\n\n .p-contextmenu[").concat(selector, "] .p-submenu-list {\n position: relative;\n }\n\n .p-contextmenu[").concat(selector, "] .p-menuitem-active > .p-submenu-list {\n left: 0 !important;\n box-shadow: none;\n border-radius: 0;\n padding: 0 0 0 calc(var(--inline-spacing) * 2); /* @todo */\n }\n\n .p-contextmenu[").concat(selector, "] .p-menuitem-active > .p-menuitem-link > .p-submenu-icon {\n transform: rotate(-180deg);\n }\n\n .p-contextmenu[").concat(selector, "] .p-submenu-icon:before {\n content: \"\\e930\";\n }\n}\n");
styleElementRef.current.innerHTML = innerHTML;
}
};
var destroyStyle = function destroyStyle() {
styleElementRef.current = DomHandler.removeInlineStyle(styleElementRef.current);
};
var onMenuClick = function onMenuClick() {
setResetMenuState(false);
};
var onMenuMouseEnter = function onMenuMouseEnter() {
setResetMenuState(false);
};
var show = function show(event) {
event.stopPropagation();
event.preventDefault();
currentEvent.current = event;
if (visibleState) {
setReshowState(true);
} else {
setVisibleState(true);
props.onShow && props.onShow(currentEvent.current);
}
};
var hide = function hide(event) {
currentEvent.current = event;
setVisibleState(false);
setReshowState(false);
props.onHide && props.onHide(currentEvent.current);
};
var onEnter = function onEnter() {
if (props.autoZIndex) {
ZIndexUtils.set('menu', menuRef.current, PrimeReact.autoZIndex, props.baseZIndex || PrimeReact.zIndex['menu']);
}
position(currentEvent.current);
if (attributeSelectorState && props.breakpoint) {
menuRef.current.setAttribute(attributeSelectorState, '');
createStyle();
}
};
var onEntered = function onEntered() {
bindDocumentListeners();
};
var onExit = function onExit() {
unbindDocumentListeners();
ZIndexUtils.clear(menuRef.current);
};
var onExited = function onExited() {
ZIndexUtils.clear(menuRef.current);
destroyStyle();
};
var position = function position(event) {
if (event) {
var left = event.pageX + 1;
var top = event.pageY + 1;
var width = menuRef.current.offsetParent ? menuRef.current.offsetWidth : DomHandler.getHiddenElementOuterWidth(menuRef.current);
var height = menuRef.current.offsetParent ? menuRef.current.offsetHeight : DomHandler.getHiddenElementOuterHeight(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;
}
menuRef.current.style.left = left + 'px';
menuRef.current.style.top = top + 'px';
}
};
var onLeafClick = function onLeafClick(event) {
setResetMenuState(true);
hide(event);
event.stopPropagation();
};
var isOutsideClicked = function isOutsideClicked(event) {
return menuRef && menuRef.current && !(menuRef.current.isSameNode(event.target) || menuRef.current.contains(event.target));
};
var bindDocumentListeners = function bindDocumentListeners() {
bindDocumentResizeListener();
bindDocumentClickListener();
};
var unbindDocumentListeners = function unbindDocumentListeners() {
unbindDocumentResizeListener();
unbindDocumentClickListener();
};
useMountEffect(function () {
if (props.global) {
bindDocumentContextMenuListener();
}
if (props.breakpoint) {
!attributeSelectorState && setAttributeSelectorState(UniqueComponentId());
}
});
useUpdateEffect(function () {
if (attributeSelectorState && menuRef.current) {
menuRef.current.setAttribute(attributeSelectorState, '');
createStyle();
}
return function () {
destroyStyle();
};
}, [attributeSelectorState, props.breakpoint]);
useUpdateEffect(function () {
if (visibleState) {
setVisibleState(false);
setReshowState(false);
setResetMenuState(true);
} else if (!reshowState && !visibleState && resetMenuState) {
show(currentEvent.current);
}
}, [reshowState]);
useUnmountEffect(function () {
ZIndexUtils.clear(menuRef.current);
});
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
show: show,
hide: hide,
getElement: function getElement() {
return menuRef.current;
}
};
});
var createContextMenu = function createContextMenu() {
var otherProps = ContextMenuBase.getOtherProps(props);
var className = classNames('p-contextmenu p-component', props.className, {
'p-input-filled': PrimeReact.inputStyle === 'filled',
'p-ripple-disabled': PrimeReact.ripple === false
});
return /*#__PURE__*/React__namespace.createElement(CSSTransition, {
nodeRef: menuRef,
classNames: "p-contextmenu",
"in": visibleState,
timeout: {
enter: 250,
exit: 0
},
options: props.transitionOptions,
unmountOnExit: true,
onEnter: onEnter,
onEntered: onEntered,
onExit: onExit,
onExited: onExited
}, /*#__PURE__*/React__namespace.createElement("div", _extends({
ref: menuRef,
id: props.id,
className: className,
style: props.style
}, otherProps, {
onClick: onMenuClick,
onMouseEnter: onMenuMouseEnter
}), /*#__PURE__*/React__namespace.createElement(ContextMenuSub, {
menuProps: props,
model: props.model,
root: true,
resetMenu: resetMenuState,
onLeafClick: onLeafClick,
isMobileMode: isMobileMode
})));
};
var element = createContextMenu();
return /*#__PURE__*/React__namespace.createElement(Portal, {
element: element,
appendTo: props.appendTo
});
}));
ContextMenu.displayName = 'ContextMenu';
var DataScrollerBase = {
defaultProps: {
__TYPE: 'DataScroller',
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,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, DataScrollerBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, DataScrollerBase.defaultProps);
}
};
var DataScroller = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = DataScrollerBase.getProps(inProps);
var _React$useState = React__namespace.useState([]),
_React$useState2 = _slicedToArray(_React$useState, 2),
dataToRenderState = _React$useState2[0],
setDataToRenderState = _React$useState2[1];
var elementRef = React__namespace.useRef(null);
var contentRef = React__namespace.useRef(null);
var value = React__namespace.useRef(props.value);
var dataToRender = React__namespace.useRef([]);
var first = React__namespace.useRef(0);
var scrollFunction = React__namespace.useRef(null);
var handleDataChange = function handleDataChange() {
if (props.lazy) {
dataToRender.current = value.current;
setDataToRenderState(_toConsumableArray(dataToRender.current));
} else {
load();
}
};
var load = function load() {
if (props.lazy) {
if (props.onLazyLoad) {
props.onLazyLoad(createLazyLoadMetadata());
}
first.current += props.rows;
} else {
if (value.current) {
for (var i = first.current; i < first.current + props.rows; i++) {
if (i >= value.current.length) {
break;
}
dataToRender.current.push(value.current[i]);
}
if (value.current.length !== 0) {
first.current += props.rows;
}
setDataToRenderState(_toConsumableArray(dataToRender.current));
}
}
};
var reset = function reset() {
first.current = 0;
dataToRender.current = [];
setDataToRenderState(_toConsumableArray(dataToRender.current));
load();
};
var createLazyLoadMetadata = function createLazyLoadMetadata() {
return {
first: first.current,
rows: props.rows
};
};
var bindScrollListener = function bindScrollListener() {
if (props.inline) {
scrollFunction.current = function () {
var scrollTop = contentRef.current.scrollTop,
scrollHeight = contentRef.current.scrollHeight,
viewportHeight = contentRef.current.clientHeight;
if (scrollTop >= scrollHeight * props.buffer - viewportHeight) {
load();
}
};
contentRef.current.addEventListener('scroll', scrollFunction.current);
} else {
scrollFunction.current = 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 * props.buffer - winHeight) {
load();
}
};
window.addEventListener('scroll', scrollFunction.current);
}
};
var unbindScrollListener = function unbindScrollListener() {
if (scrollFunction.current) {
if (props.inline && contentRef.current) {
contentRef.current.removeEventListener('scroll', scrollFunction.current);
} else if (!props.loader) {
window.removeEventListener('scroll', scrollFunction.current);
}
}
scrollFunction.current = null;
};
useMountEffect(function () {
load();
if (!props.loader) {
bindScrollListener();
}
});
useUpdateEffect(function () {
if (props.value) {
value.current = props.value;
if (!props.lazy) {
first.current = 0;
}
dataToRender.current = [];
handleDataChange();
}
}, [props.value]);
useUpdateEffect(function () {
if (props.loader) {
unbindScrollListener();
}
}, [props.loader]);
useUnmountEffect(function () {
if (scrollFunction.current) {
unbindScrollListener();
}
});
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
load: load,
reset: reset,
getElement: function getElement() {
return elementRef.current;
},
getContent: function getContent() {
return contentRef.current;
}
};
});
var createHeader = function createHeader() {
if (props.header) {
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-datascroller-header"
}, props.header);
}
return null;
};
var createFooter = function createFooter() {
if (props.footer) {
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-datascroller-footer"
}, props.footer);
}
return null;
};
var createItem = function createItem(_value, index) {
var content = props.itemTemplate ? props.itemTemplate(_value) : _value;
return /*#__PURE__*/React__namespace.createElement("li", {
key: index + '_datascrollitem'
}, content);
};
var createEmptyMessage = function createEmptyMessage() {
var content = ObjectUtils.getJSXElement(props.emptyMessage, props) || localeOption('emptyMessage');
return /*#__PURE__*/React__namespace.createElement("li", null, content);
};
var createContent = function createContent() {
var content = ObjectUtils.isNotEmpty(dataToRenderState) ? dataToRenderState.map(createItem) : createEmptyMessage();
return /*#__PURE__*/React__namespace.createElement("div", {
ref: contentRef,
className: "p-datascroller-content",
style: {
maxHeight: props.scrollHeight
}
}, /*#__PURE__*/React__namespace.createElement("ul", {
className: "p-datascroller-list"
}, content));
};
var otherProps = DataScrollerBase.getOtherProps(props);
var className = classNames('p-datascroller p-component', props.className, {
'p-datascroller-inline': props.inline
});
var header = createHeader();
var footer = createFooter();
var content = createContent();
return /*#__PURE__*/React__namespace.createElement("div", _extends({
id: props.id,
ref: elementRef,
className: className
}, otherProps), header, content, footer);
}));
DataScroller.displayName = 'DataScroller';
var ColumnBase = {
defaultProps: {
__TYPE: 'Column',
align: null,
alignFrozen: 'left',
alignHeader: null,
body: null,
bodyClassName: null,
bodyStyle: null,
cellEditValidator: null,
cellEditValidatorEvent: 'click',
className: null,
colSpan: null,
columnKey: null,
dataType: 'text',
editor: null,
excludeGlobalFilter: false,
expander: false,
exportField: null,
exportable: true,
field: null,
filter: false,
filterApply: null,
filterClear: null,
filterElement: null,
filterField: null,
filterFooter: null,
filterFunction: null,
filterHeader: null,
filterHeaderClassName: null,
filterHeaderStyle: null,
filterMatchMode: null,
filterMatchModeOptions: null,
filterMaxLength: null,
filterMenuClassName: null,
filterMenuStyle: null,
filterPlaceholder: null,
filterType: 'text',
footer: null,
footerClassName: null,
footerStyle: null,
frozen: false,
header: null,
headerClassName: null,
headerStyle: null,
headerTooltip: null,
headerTooltipOptions: null,
hidden: false,
maxConstraints: 2,
onBeforeCellEditHide: null,
onBeforeCellEditShow: null,
onCellEditCancel: null,
onCellEditComplete: null,
onCellEditInit: null,
onFilterApplyClick: null,
onFilterClear: null,
onFilterConstraintAdd: null,
onFilterConstraintRemove: null,
onFilterMatchModeChange: null,
onFilterOperatorChange: null,
reorderable: true,
resizeable: true,
rowEditor: false,
rowReorder: false,
rowReorderIcon: 'pi pi-bars',
rowSpan: null,
selectionMode: null,
showAddButton: true,
showApplyButton: true,
showClearButton: true,
showFilterMatchModes: true,
showFilterMenu: true,
showFilterMenuOptions: true,
showFilterOperator: true,
sortField: null,
sortFunction: null,
sortable: false,
sortableDisabled: false,
style: null,
children: undefined
},
getCProp: function getCProp(column, name) {
return ObjectUtils.getComponentProp(column, name, ColumnBase.defaultProps);
},
getCProps: function getCProps(column) {
return ObjectUtils.getComponentProps(column, ColumnBase.defaultProps);
},
getCOtherProps: function getCOtherProps(column) {
return ObjectUtils.getComponentDiffProps(column, ColumnBase.defaultProps);
}
};
var PaginatorBase = {
defaultProps: {
__TYPE: 'Paginator',
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})',
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, PaginatorBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, PaginatorBase.defaultProps);
}
};
var CurrentPageReportBase = {
defaultProps: {
__TYPE: 'CurrentPageReport',
pageCount: null,
page: null,
first: null,
rows: null,
totalRecords: null,
reportTemplate: '({currentPage} of {totalPages})',
template: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, CurrentPageReportBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, CurrentPageReportBase.defaultProps);
}
};
var FirstPageLinkBase = {
defaultProps: {
__TYPE: 'FirstPageLink',
disabled: false,
onClick: null,
template: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, FirstPageLinkBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, FirstPageLinkBase.defaultProps);
}
};
var JumpToPageInputBase = {
defaultProps: {
__TYPE: 'JumpToPageInput',
page: null,
rows: null,
pageCount: null,
disabled: false,
template: null,
onChange: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, JumpToPageInputBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, JumpToPageInputBase.defaultProps);
}
};
var LastPageLinkBase = {
defaultProps: {
__TYPE: 'LastPageLink',
disabled: false,
onClick: null,
template: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, LastPageLinkBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, LastPageLinkBase.defaultProps);
}
};
var NextPageLinkBase = {
defaultProps: {
__TYPE: 'NextPageLink',
disabled: false,
onClick: null,
template: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, NextPageLinkBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, NextPageLinkBase.defaultProps);
}
};
var PageLinksBase = {
defaultProps: {
__TYPE: 'PageLinks',
value: null,
page: null,
rows: null,
pageCount: null,
links: null,
template: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, PageLinksBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, PageLinksBase.defaultProps);
}
};
var PrevPageLinkBase = {
defaultProps: {
__TYPE: 'PrevPageLink',
disabled: false,
onClick: null,
template: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, PrevPageLinkBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, PrevPageLinkBase.defaultProps);
}
};
var RowsPerPageDropdownBase = {
defaultProps: {
__TYPE: 'RowsPerPageDropdown',
options: null,
value: null,
page: null,
pageCount: null,
totalRecords: 0,
appendTo: null,
onChange: null,
template: null,
disabled: false,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, RowsPerPageDropdownBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, RowsPerPageDropdownBase.defaultProps);
}
};
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; }
var CurrentPageReport = /*#__PURE__*/React__namespace.memo(function (inProps) {
var props = CurrentPageReportBase.getProps(inProps);
var report = {
currentPage: props.page + 1,
totalPages: props.pageCount,
first: Math.min(props.first + 1, props.totalRecords),
last: Math.min(props.first + props.rows, props.totalRecords),
rows: props.rows,
totalRecords: props.totalRecords
};
var text = 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__namespace.createElement("span", {
className: "p-paginator-current"
}, text);
if (props.template) {
var defaultOptions = _objectSpread$r(_objectSpread$r({}, report), {
className: 'p-paginator-current',
element: element,
props: props
});
return ObjectUtils.getJSXElement(props.template, defaultOptions);
}
return element;
});
CurrentPageReport.displayName = 'CurrentPageReport';
var FirstPageLink = /*#__PURE__*/React__namespace.memo(function (inProps) {
var props = FirstPageLinkBase.getProps(inProps);
var className = classNames('p-paginator-first p-paginator-element p-link', {
'p-disabled': props.disabled
});
var iconClassName = 'p-paginator-icon pi pi-angle-double-left';
var element = /*#__PURE__*/React__namespace.createElement("button", {
type: "button",
className: className,
onClick: props.onClick,
disabled: props.disabled,
"aria-label": ariaLabel('firstPageLabel')
}, /*#__PURE__*/React__namespace.createElement("span", {
className: iconClassName
}), /*#__PURE__*/React__namespace.createElement(Ripple, null));
if (props.template) {
var defaultOptions = {
onClick: props.onClick,
className: className,
iconClassName: iconClassName,
disabled: props.disabled,
element: element,
props: props
};
return ObjectUtils.getJSXElement(props.template, defaultOptions);
}
return element;
});
FirstPageLink.displayName = 'FirstPageLink';
var InputNumberBase = {
defaultProps: {
__TYPE: 'InputNumber',
allowEmpty: true,
ariaLabelledBy: null,
autoFocus: false,
buttonLayout: 'stacked',
className: null,
currency: undefined,
currencyDisplay: undefined,
decrementButtonClassName: null,
decrementButtonIcon: 'pi pi-angle-down',
disabled: false,
format: true,
id: null,
incrementButtonClassName: null,
incrementButtonIcon: 'pi pi-angle-up',
inputClassName: null,
inputId: null,
inputMode: null,
inputRef: null,
inputStyle: null,
locale: undefined,
localeMatcher: undefined,
max: null,
maxFractionDigits: undefined,
maxLength: null,
min: null,
minFractionDigits: undefined,
mode: 'decimal',
name: null,
onBlur: null,
onChange: null,
onFocus: null,
onKeyDown: null,
onValueChange: null,
pattern: null,
placeholder: null,
prefix: null,
readOnly: false,
required: false,
showButtons: false,
size: null,
step: 1,
style: null,
suffix: null,
tabIndex: null,
tooltip: null,
tooltipOptions: null,
type: 'text',
useGrouping: true,
value: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, InputNumberBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, InputNumberBase.defaultProps);
}
};
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; }
var InputNumber = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = InputNumberBase.getProps(inProps);
var _React$useState = React__namespace.useState(false),
_React$useState2 = _slicedToArray(_React$useState, 2),
focusedState = _React$useState2[0],
setFocusedState = _React$useState2[1];
var elementRef = React__namespace.useRef(null);
var inputRef = React__namespace.useRef(null);
var timer = React__namespace.useRef(null);
var lastValue = React__namespace.useRef(null);
var numberFormat = React__namespace.useRef(null);
var groupChar = React__namespace.useRef(null);
var prefixChar = React__namespace.useRef(null);
var suffixChar = React__namespace.useRef(null);
var isSpecialChar = React__namespace.useRef(null);
var _numeral = React__namespace.useRef(null);
var _group = React__namespace.useRef(null);
var _minusSign = React__namespace.useRef(null);
var _currency = React__namespace.useRef(null);
var _decimal = React__namespace.useRef(null);
var _suffix = React__namespace.useRef(null);
var _prefix = React__namespace.useRef(null);
var _index = React__namespace.useRef(null);
var stacked = props.showButtons && props.buttonLayout === 'stacked';
var horizontal = props.showButtons && props.buttonLayout === 'horizontal';
var vertical = props.showButtons && props.buttonLayout === 'vertical';
var inputMode = props.inputMode || (props.mode === 'decimal' && !props.minFractionDigits ? 'numeric' : 'decimal');
var getOptions = function getOptions() {
return {
localeMatcher: props.localeMatcher,
style: props.mode,
currency: props.currency,
currencyDisplay: props.currencyDisplay,
useGrouping: props.useGrouping,
minimumFractionDigits: props.minFractionDigits,
maximumFractionDigits: props.maxFractionDigits
};
};
var constructParser = function constructParser() {
numberFormat.current = new Intl.NumberFormat(props.locale, getOptions());
var numerals = _toConsumableArray(new Intl.NumberFormat(props.locale, {
useGrouping: false
}).format(9876543210)).reverse();
var index = new Map(numerals.map(function (d, i) {
return [d, i];
}));
_numeral.current = new RegExp("[".concat(numerals.join(''), "]"), 'g');
_group.current = getGroupingExpression();
_minusSign.current = getMinusSignExpression();
_currency.current = getCurrencyExpression();
_decimal.current = getDecimalExpression();
_suffix.current = getSuffixExpression();
_prefix.current = getPrefixExpression();
_index.current = function (d) {
return index.get(d);
};
};
var escapeRegExp = function escapeRegExp(text) {
return text.replace(/[-[\]{}()*+?.,\\^$|#\s]/g, '\\$&');
};
var getDecimalExpression = function getDecimalExpression() {
var formatter = new Intl.NumberFormat(props.locale, _objectSpread$q(_objectSpread$q({}, getOptions()), {}, {
useGrouping: false
}));
return new RegExp("[".concat(formatter.format(1.1).replace(_currency.current, '').trim().replace(_numeral.current, ''), "]"), 'g');
};
var getGroupingExpression = function getGroupingExpression() {
var formatter = new Intl.NumberFormat(props.locale, {
useGrouping: true
});
groupChar.current = formatter.format(1000000).trim().replace(_numeral.current, '').charAt(0);
return new RegExp("[".concat(groupChar.current, "]"), 'g');
};
var getMinusSignExpression = function getMinusSignExpression() {
var formatter = new Intl.NumberFormat(props.locale, {
useGrouping: false
});
return new RegExp("[".concat(formatter.format(-1).trim().replace(_numeral.current, ''), "]"), 'g');
};
var getCurrencyExpression = function getCurrencyExpression() {
if (props.currency) {
var formatter = new Intl.NumberFormat(props.locale, {
style: 'currency',
currency: props.currency,
currencyDisplay: props.currencyDisplay,
minimumFractionDigits: 0,
maximumFractionDigits: 0
});
return new RegExp("[".concat(formatter.format(1).replace(/\s/g, '').replace(_numeral.current, '').replace(_group.current, ''), "]"), 'g');
}
return new RegExp("[]", 'g');
};
var getPrefixExpression = function getPrefixExpression() {
if (props.prefix) {
prefixChar.current = props.prefix;
} else {
var formatter = new Intl.NumberFormat(props.locale, {
style: props.mode,
currency: props.currency,
currencyDisplay: props.currencyDisplay
});
prefixChar.current = formatter.format(1).split('1')[0];
}
return new RegExp("".concat(escapeRegExp(prefixChar.current || '')), 'g');
};
var getSuffixExpression = function getSuffixExpression() {
if (props.suffix) {
suffixChar.current = props.suffix;
} else {
var formatter = new Intl.NumberFormat(props.locale, {
style: props.mode,
currency: props.currency,
currencyDisplay: props.currencyDisplay,
minimumFractionDigits: 0,
maximumFractionDigits: 0
});
suffixChar.current = formatter.format(1).split('1')[1];
}
return new RegExp("".concat(escapeRegExp(suffixChar.current || '')), 'g');
};
var formatValue = function formatValue(value) {
if (value != null) {
if (value === '-') {
// Minus sign
return value;
}
if (props.format) {
var formatter = new Intl.NumberFormat(props.locale, getOptions());
var _formattedValue = formatter.format(value);
if (props.prefix) {
_formattedValue = props.prefix + _formattedValue;
}
if (props.suffix) {
_formattedValue = _formattedValue + props.suffix;
}
return _formattedValue;
}
return value.toString();
}
return '';
};
var parseValue = function parseValue(text) {
var filteredText = text.replace(_suffix.current, '').replace(_prefix.current, '').trim().replace(/\s/g, '').replace(_currency.current, '').replace(_group.current, '').replace(_minusSign.current, '-').replace(_decimal.current, '.').replace(_numeral.current, _index.current);
if (filteredText) {
if (filteredText === '-')
// Minus sign
return filteredText;
var parsedValue = +filteredText;
return isNaN(parsedValue) ? null : parsedValue;
}
return null;
};
var repeat = function repeat(event, interval, dir) {
var i = interval || 500;
clearTimer();
timer.current = setTimeout(function () {
repeat(event, 40, dir);
}, i);
spin(event, dir);
};
var spin = function spin(event, dir) {
if (inputRef.current) {
var step = props.step * dir;
var currentValue = parseValue(inputRef.current.value) || 0;
var newValue = validateValue(currentValue + step);
if (props.maxLength && props.maxLength < formatValue(newValue).length) {
return;
}
// #3913 onChange should be called before onValueChange
handleOnChange(event, currentValue, newValue);
// touch devices trigger the keyboard to display because of setSelectionRange
!DomHandler.isTouchDevice() && updateInput(newValue, null, 'spin');
updateModel(event, newValue);
}
};
var onUpButtonMouseDown = function onUpButtonMouseDown(event) {
if (!props.disabled && !props.readOnly) {
props.autoFocus && DomHandler.focus(inputRef.current, props.autoFocus);
repeat(event, null, 1);
event.preventDefault();
}
};
var onUpButtonMouseUp = function onUpButtonMouseUp() {
if (!props.disabled && !props.readOnly) {
clearTimer();
}
};
var onUpButtonMouseLeave = function onUpButtonMouseLeave() {
if (!props.disabled && !props.readOnly) {
clearTimer();
}
};
var onUpButtonKeyUp = function onUpButtonKeyUp() {
if (!props.disabled && !props.readOnly) {
clearTimer();
}
};
var onUpButtonKeyDown = function onUpButtonKeyDown(event) {
if (!props.disabled && !props.readOnly && (event.keyCode === 32 || event.keyCode === 13)) {
repeat(event, null, 1);
}
};
var onDownButtonMouseDown = function onDownButtonMouseDown(event) {
if (!props.disabled && !props.readOnly) {
props.autoFocus && DomHandler.focus(inputRef.current, props.autoFocus);
repeat(event, null, -1);
event.preventDefault();
}
};
var onDownButtonMouseUp = function onDownButtonMouseUp() {
if (!props.disabled && !props.readOnly) {
clearTimer();
}
};
var onDownButtonMouseLeave = function onDownButtonMouseLeave() {
if (!props.disabled && !props.readOnly) {
clearTimer();
}
};
var onDownButtonKeyUp = function onDownButtonKeyUp() {
if (!props.disabled && !props.readOnly) {
clearTimer();
}
};
var onDownButtonKeyDown = function onDownButtonKeyDown(event) {
if (!props.disabled && !props.readOnly && (event.keyCode === 32 || event.keyCode === 13)) {
repeat(event, null, -1);
}
};
var onInput = function onInput(event) {
if (props.disabled || props.readOnly) {
return;
}
if (isSpecialChar.current) {
event.target.value = lastValue.current;
}
isSpecialChar.current = false;
};
var onInputKeyDown = function onInputKeyDown(event) {
if (props.disabled || props.readOnly) {
return;
}
lastValue.current = event.target.value;
if (event.shiftKey || event.altKey) {
isSpecialChar.current = 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:
spin(event, 1);
event.preventDefault();
break;
//down
case 40:
spin(event, -1);
event.preventDefault();
break;
//left
case 37:
if (!isNumeralChar(inputValue.charAt(selectionStart - 1))) {
event.preventDefault();
}
break;
//right
case 39:
if (!isNumeralChar(inputValue.charAt(selectionStart))) {
event.preventDefault();
}
break;
//enter and tab
case 13:
case 9:
newValueStr = validateValue(parseValue(inputValue));
inputRef.current.value = formatValue(newValueStr);
inputRef.current.setAttribute('aria-valuenow', newValueStr);
updateModel(event, newValueStr);
break;
//backspace
case 8:
event.preventDefault();
if (selectionStart === selectionEnd) {
var deleteChar = inputValue.charAt(selectionStart - 1);
var _getDecimalCharIndexe = getDecimalCharIndexes(inputValue),
decimalCharIndex = _getDecimalCharIndexe.decimalCharIndex,
decimalCharIndexWithoutPrefix = _getDecimalCharIndexe.decimalCharIndexWithoutPrefix;
if (isNumeralChar(deleteChar)) {
var decimalLength = getDecimalLength(inputValue);
if (_group.current.test(deleteChar)) {
_group.current.lastIndex = 0;
newValueStr = inputValue.slice(0, selectionStart - 2) + inputValue.slice(selectionStart - 1);
} else if (_decimal.current.test(deleteChar)) {
_decimal.current.lastIndex = 0;
if (decimalLength) {
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 = isDecimalMode() && (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 = parseValue(newValueStr) > 0 ? newValueStr : '';
} else {
newValueStr = inputValue.slice(0, selectionStart - 1) + inputValue.slice(selectionStart);
}
}
updateValue(event, newValueStr, null, 'delete-single');
} else {
newValueStr = deleteRange(inputValue, selectionStart, selectionEnd);
updateValue(event, newValueStr, null, 'delete-range');
}
break;
// del
case 46:
event.preventDefault();
if (selectionStart === selectionEnd) {
var _deleteChar = inputValue.charAt(selectionStart);
var _getDecimalCharIndexe2 = getDecimalCharIndexes(inputValue),
_decimalCharIndex = _getDecimalCharIndexe2.decimalCharIndex,
_decimalCharIndexWithoutPrefix = _getDecimalCharIndexe2.decimalCharIndexWithoutPrefix;
if (isNumeralChar(_deleteChar)) {
var _decimalLength = getDecimalLength(inputValue);
if (_group.current.test(_deleteChar)) {
_group.current.lastIndex = 0;
newValueStr = inputValue.slice(0, selectionStart) + inputValue.slice(selectionStart + 2);
} else if (_decimal.current.test(_deleteChar)) {
_decimal.current.lastIndex = 0;
if (_decimalLength) {
inputRef.current.setSelectionRange(selectionStart + 1, selectionStart + 1);
} else {
newValueStr = inputValue.slice(0, selectionStart) + inputValue.slice(selectionStart + 1);
}
} else if (_decimalCharIndex > 0 && selectionStart > _decimalCharIndex) {
var _insertedText = isDecimalMode() && (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 = parseValue(newValueStr) > 0 ? newValueStr : '';
} else {
newValueStr = inputValue.slice(0, selectionStart) + inputValue.slice(selectionStart + 1);
}
}
updateValue(event, newValueStr, null, 'delete-back-single');
} else {
newValueStr = deleteRange(inputValue, selectionStart, selectionEnd);
updateValue(event, newValueStr, null, 'delete-range');
}
break;
}
if (props.onKeyDown) {
props.onKeyDown(event);
}
};
var onInputKeyPress = function onInputKeyPress(event) {
if (props.disabled || props.readOnly) {
return;
}
var code = event.which || event.keyCode;
if (code !== 13) {
// to submit a form
event.preventDefault();
}
var _char = String.fromCharCode(code);
var _isDecimalSign = isDecimalSign(_char);
var _isMinusSign = isMinusSign(_char);
if (48 <= code && code <= 57 || _isMinusSign || _isDecimalSign) {
insert(event, _char, {
isDecimalSign: _isDecimalSign,
isMinusSign: _isMinusSign
});
}
};
var onPaste = function onPaste(event) {
event.preventDefault();
if (props.disabled || props.readOnly) {
return;
}
var data = (event.clipboardData || window['clipboardData']).getData('Text');
if (data) {
var filteredData = parseValue(data);
if (filteredData != null) {
insert(event, filteredData.toString());
}
}
};
var allowMinusSign = function allowMinusSign() {
return props.min === null || props.min < 0;
};
var isMinusSign = function isMinusSign(_char2) {
if (_minusSign.current.test(_char2) || _char2 === '-') {
_minusSign.current.lastIndex = 0;
return true;
}
return false;
};
var isDecimalSign = function isDecimalSign(_char3) {
if (_decimal.current.test(_char3)) {
_decimal.current.lastIndex = 0;
return true;
}
return false;
};
var isDecimalMode = function isDecimalMode() {
return props.mode === 'decimal';
};
var getDecimalCharIndexes = function getDecimalCharIndexes(val) {
var decimalCharIndex = val.search(_decimal.current);
_decimal.current.lastIndex = 0;
var filteredVal = val.replace(_prefix.current, '').trim().replace(/\s/g, '').replace(_currency.current, '');
var decimalCharIndexWithoutPrefix = filteredVal.search(_decimal.current);
_decimal.current.lastIndex = 0;
return {
decimalCharIndex: decimalCharIndex,
decimalCharIndexWithoutPrefix: decimalCharIndexWithoutPrefix
};
};
var getCharIndexes = function getCharIndexes(val) {
var decimalCharIndex = val.search(_decimal.current);
_decimal.current.lastIndex = 0;
var minusCharIndex = val.search(_minusSign.current);
_minusSign.current.lastIndex = 0;
var suffixCharIndex = val.search(_suffix.current);
_suffix.current.lastIndex = 0;
var currencyCharIndex = val.search(_currency.current);
_currency.current.lastIndex = 0;
return {
decimalCharIndex: decimalCharIndex,
minusCharIndex: minusCharIndex,
suffixCharIndex: suffixCharIndex,
currencyCharIndex: currencyCharIndex
};
};
var insert = function insert(event, text) {
var sign = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {
isDecimalSign: false,
isMinusSign: false
};
var minusCharIndexOnText = text.search(_minusSign.current);
_minusSign.current.lastIndex = 0;
if (!allowMinusSign() && minusCharIndexOnText !== -1) {
return;
}
var selectionStart = inputRef.current.selectionStart;
var selectionEnd = inputRef.current.selectionEnd;
var inputValue = inputRef.current.value.trim();
var _getCharIndexes = getCharIndexes(inputValue),
decimalCharIndex = _getCharIndexes.decimalCharIndex,
minusCharIndex = _getCharIndexes.minusCharIndex,
suffixCharIndex = _getCharIndexes.suffixCharIndex,
currencyCharIndex = _getCharIndexes.currencyCharIndex;
var newValueStr;
if (sign.isMinusSign) {
if (selectionStart === 0) {
newValueStr = inputValue;
if (minusCharIndex === -1 || selectionEnd !== 0) {
newValueStr = insertText(inputValue, text, 0, selectionEnd);
}
updateValue(event, newValueStr, text, 'insert');
}
} else if (sign.isDecimalSign) {
if (decimalCharIndex > 0 && selectionStart === decimalCharIndex) {
updateValue(event, inputValue, text, 'insert');
} else if (decimalCharIndex > selectionStart && decimalCharIndex < selectionEnd) {
newValueStr = insertText(inputValue, text, selectionStart, selectionEnd);
updateValue(event, newValueStr, text, 'insert');
} else if (decimalCharIndex === -1 && props.maxFractionDigits) {
newValueStr = insertText(inputValue, text, selectionStart, selectionEnd);
updateValue(event, newValueStr, text, 'insert');
}
} else {
var maxFractionDigits = numberFormat.current.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);
updateValue(event, newValueStr, text, operation);
}
} else {
newValueStr = insertText(inputValue, text, selectionStart, selectionEnd);
updateValue(event, newValueStr, text, operation);
}
}
};
var insertText = function insertText(value, text, start, end) {
var textSplit = text === '.' ? text : text.split('.');
if (textSplit.length === 2) {
var decimalCharIndex = value.slice(start, end).search(_decimal.current);
_decimal.current.lastIndex = 0;
return decimalCharIndex > 0 ? value.slice(0, start) + formatValue(text) + value.slice(end) : value || formatValue(text);
} else if (end - start === value.length) {
return formatValue(text);
} else if (start === 0) {
var suffix = ObjectUtils.isLetter(value[end]) ? end - 1 : end;
return text + value.slice(suffix);
} else if (end === value.length) {
return value.slice(0, start) + text;
} else {
return value.slice(0, start) + text + value.slice(end);
}
};
var deleteRange = 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;
};
var initCursor = function initCursor() {
var selectionStart = inputRef.current.selectionStart;
var inputValue = inputRef.current.value;
var valueLength = inputValue.length;
var index = null;
// remove prefix
var prefixLength = (prefixChar.current || '').length;
inputValue = inputValue.replace(_prefix.current, '');
selectionStart = selectionStart - prefixLength;
var _char4 = inputValue.charAt(selectionStart);
if (isNumeralChar(_char4)) {
return selectionStart + prefixLength;
}
//left
var i = selectionStart - 1;
while (i >= 0) {
_char4 = inputValue.charAt(i);
if (isNumeralChar(_char4)) {
index = i + prefixLength;
break;
} else {
i--;
}
}
if (index !== null) {
inputRef.current.setSelectionRange(index + 1, index + 1);
} else {
i = selectionStart;
while (i < valueLength) {
_char4 = inputValue.charAt(i);
if (isNumeralChar(_char4)) {
index = i + prefixLength;
break;
} else {
i++;
}
}
if (index !== null) {
inputRef.current.setSelectionRange(index, index);
}
}
return index || 0;
};
var onInputClick = function onInputClick() {
initCursor();
};
var isNumeralChar = function isNumeralChar(_char5) {
if (_char5.length === 1 && (_numeral.current.test(_char5) || _decimal.current.test(_char5) || _group.current.test(_char5) || _minusSign.current.test(_char5))) {
resetRegex();
return true;
} else {
return false;
}
};
var resetRegex = function resetRegex() {
_numeral.current.lastIndex = 0;
_decimal.current.lastIndex = 0;
_group.current.lastIndex = 0;
_minusSign.current.lastIndex = 0;
};
var updateValue = function updateValue(event, valueStr, insertedValueStr, operation) {
var currentValue = inputRef.current.value;
var newValue = null;
if (valueStr != null) {
newValue = evaluateEmpty(parseValue(valueStr));
updateInput(newValue, insertedValueStr, operation, valueStr);
handleOnChange(event, currentValue, newValue);
}
};
var evaluateEmpty = function evaluateEmpty(newValue) {
return !newValue && !props.allowEmpty ? props.min || 0 : newValue;
};
var handleOnChange = function handleOnChange(event, currentValue, newValue) {
if (props.onChange && isValueChanged(currentValue, newValue)) {
props.onChange({
originalEvent: event,
value: newValue
});
}
};
var isValueChanged = function isValueChanged(currentValue, newValue) {
if (newValue === null && currentValue !== null) {
return true;
}
if (newValue != null) {
var parsedCurrentValue = typeof currentValue === 'string' ? parseValue(currentValue) : currentValue;
return newValue !== parsedCurrentValue;
}
return false;
};
var validateValue = function validateValue(value) {
if (value === '-') {
return null;
}
return validateValueByLimit(value);
};
var validateValueByLimit = function validateValueByLimit(value) {
if (ObjectUtils.isEmpty(value)) {
return null;
}
if (props.min !== null && value < props.min) {
return props.min;
}
if (props.max !== null && value > props.max) {
return props.max;
}
return value;
};
var updateInput = function updateInput(value, insertedValueStr, operation, valueStr) {
insertedValueStr = insertedValueStr || '';
var inputEl = inputRef.current;
var inputValue = inputEl.value;
var newValue = formatValue(value);
var currentLength = inputValue.length;
if (newValue !== valueStr) {
newValue = concatValues(newValue, valueStr);
}
if (currentLength === 0) {
inputEl.value = newValue;
inputEl.setSelectionRange(0, 0);
var index = initCursor();
var selectionEnd = index + insertedValueStr.length;
inputEl.setSelectionRange(selectionEnd, selectionEnd);
} else {
var selectionStart = inputEl.selectionStart;
var _selectionEnd = inputEl.selectionEnd;
if (props.maxLength && props.maxLength < newValue.length) {
return;
}
inputEl.value = newValue;
var newLength = newValue.length;
if (operation === 'range-insert') {
var startValue = parseValue((inputValue || '').slice(0, selectionStart));
var startValueStr = startValue !== null ? startValue.toString() : '';
var startExpr = startValueStr.split('').join("(".concat(groupChar.current, ")?"));
var sRegex = new RegExp(startExpr, 'g');
sRegex.test(newValue);
var tExpr = insertedValueStr.split('').join("(".concat(groupChar.current, ")?"));
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 = _group.current.test(nextChar);
if (isGroupChar && diff === 1) {
_selectionEnd += 1;
} else if (!isGroupChar && isNumeralChar(prevChar)) {
_selectionEnd += -1 * diff + 1;
}
_group.current.lastIndex = 0;
inputEl.setSelectionRange(_selectionEnd, _selectionEnd);
} else if (inputValue === '-' && operation === 'insert') {
inputEl.setSelectionRange(0, 0);
var _index2 = initCursor();
var _selectionEnd2 = _index2 + insertedValueStr.length + 1;
inputEl.setSelectionRange(_selectionEnd2, _selectionEnd2);
} else {
_selectionEnd = _selectionEnd + (newLength - currentLength);
inputEl.setSelectionRange(_selectionEnd, _selectionEnd);
}
}
inputEl.setAttribute('aria-valuenow', value);
};
var updateInputValue = function updateInputValue(newValue) {
newValue = evaluateEmpty(newValue);
var inputEl = inputRef.current;
var value = inputEl.value;
var _formattedValue = formattedValue(newValue);
if (value !== _formattedValue) {
inputEl.value = _formattedValue;
inputEl.setAttribute('aria-valuenow', newValue);
}
};
var formattedValue = function formattedValue(val) {
return formatValue(evaluateEmpty(val));
};
var concatValues = function concatValues(val1, val2) {
if (val1 && val2) {
var decimalCharIndex = val2.search(_decimal.current);
_decimal.current.lastIndex = 0;
return decimalCharIndex !== -1 ? val1.split(_decimal.current)[0] + val2.slice(decimalCharIndex) : val1;
}
return val1;
};
var getDecimalLength = function getDecimalLength(value) {
if (value) {
var valueSplit = value.split(_decimal.current);
if (valueSplit.length === 2) {
return valueSplit[1].replace(_suffix.current, '').trim().replace(/\s/g, '').replace(_currency.current, '').length;
}
}
return 0;
};
var updateModel = function updateModel(event, value) {
if (props.onValueChange) {
props.onValueChange({
originalEvent: event,
value: value,
stopPropagation: function stopPropagation() {},
preventDefault: function preventDefault() {},
target: {
name: props.name,
id: props.id,
value: value
}
});
}
};
var onInputFocus = function onInputFocus(event) {
setFocusedState(true);
props.onFocus && props.onFocus(event);
if ((props.suffix || props.currency || props.prefix) && inputRef.current) {
// GitHub #1866 Cursor must be placed before/after symbol or arrow keys don't work
var selectionEnd = initCursor();
inputRef.current.setSelectionRange(selectionEnd, selectionEnd);
}
};
var onInputBlur = function onInputBlur(event) {
setFocusedState(false);
if (inputRef.current) {
var currentValue = inputRef.current.value;
if (isValueChanged(currentValue, props.value)) {
var newValue = validateValue(parseValue(currentValue));
updateInputValue(newValue);
updateModel(event, newValue);
}
}
props.onBlur && props.onBlur(event);
};
var clearTimer = function clearTimer() {
if (timer.current) {
clearInterval(timer.current);
}
};
var changeValue = function changeValue() {
updateInputValue(validateValueByLimit(props.value));
var newValue = validateValue(props.value);
if (props.value !== null && props.value !== newValue) {
updateModel(null, newValue);
}
};
var getFormatter = function getFormatter() {
return numberFormat.current;
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
focus: function focus() {
return DomHandler.focus(inputRef.current);
},
getFormatter: getFormatter,
getElement: function getElement() {
return elementRef.current;
},
getInput: function getInput() {
return inputRef.current;
}
};
});
React__namespace.useEffect(function () {
ObjectUtils.combinedRefs(inputRef, props.inputRef);
}, [inputRef, props.inputRef]);
useMountEffect(function () {
constructParser();
var newValue = validateValue(props.value);
if (props.value !== null && props.value !== newValue) {
updateModel(null, newValue);
}
});
useUpdateEffect(function () {
constructParser();
changeValue();
}, [props.locale, props.localeMatcher, props.mode, props.currency, props.currencyDisplay, props.useGrouping, props.minFractionDigits, props.maxFractionDigits, props.suffix, props.prefix]);
useUpdateEffect(function () {
changeValue();
}, [props.value]);
var createInputElement = function createInputElement() {
var className = classNames('p-inputnumber-input', props.inputClassName);
var valueToRender = formattedValue(props.value);
return /*#__PURE__*/React__namespace.createElement(InputText, _extends({
ref: inputRef,
id: props.inputId,
style: props.inputStyle,
role: "spinbutton",
className: className,
defaultValue: valueToRender,
type: props.type,
size: props.size,
tabIndex: props.tabIndex,
inputMode: inputMode,
maxLength: props.maxLength,
disabled: props.disabled,
required: props.required,
pattern: props.pattern,
placeholder: props.placeholder,
readOnly: props.readOnly,
name: props.name,
autoFocus: props.autoFocus,
onKeyDown: onInputKeyDown,
onKeyPress: onInputKeyPress,
onInput: onInput,
onClick: onInputClick,
onBlur: onInputBlur,
onFocus: onInputFocus,
onPaste: onPaste,
min: props.min,
max: props.max,
"aria-valuemin": props.min,
"aria-valuemax": props.max,
"aria-valuenow": props.value
}, ariaProps, dataProps));
};
var createUpButton = function createUpButton() {
var className = classNames('p-inputnumber-button p-inputnumber-button-up p-button p-button-icon-only p-component', {
'p-disabled': props.disabled
}, props.incrementButtonClassName);
var icon = classNames('p-button-icon', props.incrementButtonIcon);
return /*#__PURE__*/React__namespace.createElement("button", {
type: "button",
className: className,
onPointerLeave: onUpButtonMouseLeave,
onPointerDown: onUpButtonMouseDown,
onPointerUp: onUpButtonMouseUp,
onKeyDown: onUpButtonKeyDown,
onKeyUp: onUpButtonKeyUp,
disabled: props.disabled,
tabIndex: -1
}, /*#__PURE__*/React__namespace.createElement("span", {
className: icon
}), /*#__PURE__*/React__namespace.createElement(Ripple, null));
};
var createDownButton = function createDownButton() {
var className = classNames('p-inputnumber-button p-inputnumber-button-down p-button p-button-icon-only p-component', {
'p-disabled': props.disabled
}, props.decrementButtonClassName);
var icon = classNames('p-button-icon', props.decrementButtonIcon);
return /*#__PURE__*/React__namespace.createElement("button", {
type: "button",
className: className,
onPointerLeave: onDownButtonMouseLeave,
onPointerDown: onDownButtonMouseDown,
onPointerUp: onDownButtonMouseUp,
onKeyDown: onDownButtonKeyDown,
onKeyUp: onDownButtonKeyUp,
disabled: props.disabled,
tabIndex: -1
}, /*#__PURE__*/React__namespace.createElement("span", {
className: icon
}), /*#__PURE__*/React__namespace.createElement(Ripple, null));
};
var createButtonGroup = function createButtonGroup() {
var upButton = props.showButtons && createUpButton();
var downButton = props.showButtons && createDownButton();
if (stacked) {
return /*#__PURE__*/React__namespace.createElement("span", {
className: "p-inputnumber-button-group"
}, upButton, downButton);
}
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, upButton, downButton);
};
var hasTooltip = ObjectUtils.isNotEmpty(props.tooltip);
var otherProps = InputNumberBase.getOtherProps(props);
var dataProps = ObjectUtils.reduceKeys(otherProps, DomHandler.DATA_PROPS);
var ariaProps = ObjectUtils.reduceKeys(otherProps, DomHandler.ARIA_PROPS);
var className = classNames('p-inputnumber p-component p-inputwrapper', {
'p-inputwrapper-filled': props.value != null && props.value.toString().length > 0,
'p-inputwrapper-focus': focusedState,
'p-inputnumber-buttons-stacked': stacked,
'p-inputnumber-buttons-horizontal': horizontal,
'p-inputnumber-buttons-vertical': vertical
}, props.className);
var inputElement = createInputElement();
var buttonGroup = createButtonGroup();
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement("span", _extends({
ref: elementRef,
id: props.id,
className: className,
style: props.style
}, otherProps), inputElement, buttonGroup), hasTooltip && /*#__PURE__*/React__namespace.createElement(Tooltip, _extends({
target: elementRef,
content: props.tooltip
}, props.tooltipOptions)));
}));
InputNumber.displayName = 'InputNumber';
var JumpToPageInput = /*#__PURE__*/React__namespace.memo(function (inProps) {
var props = JumpToPageInputBase.getProps(inProps);
var onChange = function onChange(event) {
if (props.onChange) {
props.onChange(props.rows * (event.value - 1), props.rows);
}
};
var value = props.pageCount > 0 ? props.page + 1 : 0;
var element = /*#__PURE__*/React__namespace.createElement(InputNumber, {
value: value,
onChange: onChange,
className: "p-paginator-page-input",
disabled: props.disabled
});
if (props.template) {
var defaultOptions = {
value: value,
onChange: onChange,
disabled: props.disabled,
className: 'p-paginator-page-input',
element: element,
props: props
};
return ObjectUtils.getJSXElement(props.template, defaultOptions);
}
return element;
});
JumpToPageInput.displayName = 'JumpToPageInput';
var LastPageLink = /*#__PURE__*/React__namespace.memo(function (inProps) {
var props = LastPageLinkBase.getProps(inProps);
var className = classNames('p-paginator-last p-paginator-element p-link', {
'p-disabled': props.disabled
});
var iconClassName = 'p-paginator-icon pi pi-angle-double-right';
var element = /*#__PURE__*/React__namespace.createElement("button", {
type: "button",
className: className,
onClick: props.onClick,
disabled: props.disabled,
"aria-label": ariaLabel('lastPageLabel')
}, /*#__PURE__*/React__namespace.createElement("span", {
className: iconClassName
}), /*#__PURE__*/React__namespace.createElement(Ripple, null));
if (props.template) {
var defaultOptions = {
onClick: props.onClick,
className: className,
iconClassName: iconClassName,
disabled: props.disabled,
element: element,
props: props
};
return ObjectUtils.getJSXElement(props.template, defaultOptions);
}
return element;
});
LastPageLink.displayName = 'LastPageLink';
var NextPageLink = /*#__PURE__*/React__namespace.memo(function (inProps) {
var props = NextPageLinkBase.getProps(inProps);
var className = classNames('p-paginator-next p-paginator-element p-link', {
'p-disabled': props.disabled
});
var iconClassName = 'p-paginator-icon pi pi-angle-right';
var element = /*#__PURE__*/React__namespace.createElement("button", {
type: "button",
className: className,
onClick: props.onClick,
disabled: props.disabled,
"aria-label": ariaLabel('nextPageLabel')
}, /*#__PURE__*/React__namespace.createElement("span", {
className: iconClassName
}), /*#__PURE__*/React__namespace.createElement(Ripple, null));
if (props.template) {
var defaultOptions = {
onClick: props.onClick,
className: className,
iconClassName: iconClassName,
disabled: props.disabled,
element: element,
props: props
};
return ObjectUtils.getJSXElement(props.template, defaultOptions);
}
return element;
});
NextPageLink.displayName = 'NextPageLink';
var PageLinks = /*#__PURE__*/React__namespace.memo(function (inProps) {
var props = PageLinksBase.getProps(inProps);
var onPageLinkClick = function onPageLinkClick(event, pageLink) {
if (props.onClick) {
props.onClick({
originalEvent: event,
value: pageLink
});
}
event.preventDefault();
};
var elements;
if (props.value) {
var startPageInView = props.value[0];
var endPageInView = props.value[props.value.length - 1];
elements = props.value.map(function (pageLink) {
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 === props.page
});
var element = /*#__PURE__*/React__namespace.createElement("button", {
type: "button",
className: className,
onClick: function onClick(e) {
return onPageLinkClick(e, pageLink);
},
"aria-label": "".concat(ariaLabel('pageLabel'), " ").concat(pageLink + 1)
}, pageLink, /*#__PURE__*/React__namespace.createElement(Ripple, null));
if (props.template) {
var defaultOptions = {
onClick: function onClick(e) {
return onPageLinkClick(e, pageLink);
},
className: className,
view: {
startPage: startPageInView - 1,
endPage: endPageInView - 1
},
page: pageLink - 1,
currentPage: props.page,
totalPages: props.pageCount,
element: element,
props: props
};
element = ObjectUtils.getJSXElement(props.template, defaultOptions);
}
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, {
key: pageLink
}, element);
});
}
return /*#__PURE__*/React__namespace.createElement("span", {
className: "p-paginator-pages"
}, elements);
});
PageLinks.displayName = 'PageLinks';
var PrevPageLink = /*#__PURE__*/React__namespace.memo(function (inProps) {
var props = PrevPageLinkBase.getProps(inProps);
var className = classNames('p-paginator-prev p-paginator-element p-link', {
'p-disabled': props.disabled
});
var iconClassName = 'p-paginator-icon pi pi-angle-left';
var element = /*#__PURE__*/React__namespace.createElement("button", {
type: "button",
className: className,
onClick: props.onClick,
disabled: props.disabled,
"aria-label": ariaLabel('previousPageLabel')
}, /*#__PURE__*/React__namespace.createElement("span", {
className: iconClassName
}), /*#__PURE__*/React__namespace.createElement(Ripple, null));
if (props.template) {
var defaultOptions = {
onClick: props.onClick,
className: className,
iconClassName: iconClassName,
disabled: props.disabled,
element: element,
props: props
};
return ObjectUtils.getJSXElement(props.template, defaultOptions);
}
return element;
});
PrevPageLink.displayName = 'PrevPageLink';
var DropdownBase = {
defaultProps: {
__TYPE: 'Dropdown',
appendTo: null,
ariaLabel: null,
ariaLabelledBy: null,
autoFocus: false,
className: null,
clearIcon: 'pi pi-times',
dataKey: null,
disabled: false,
dropdownIcon: 'pi pi-chevron-down',
editable: false,
emptyFilterMessage: null,
emptyMessage: null,
filter: false,
filterBy: null,
filterInputAutoFocus: true,
filterLocale: undefined,
filterMatchMode: 'contains',
filterPlaceholder: null,
filterTemplate: null,
focusInputRef: null,
id: null,
inputId: null,
inputRef: null,
itemTemplate: null,
maxLength: null,
name: null,
onBlur: null,
onChange: null,
onContextMenu: null,
onFilter: null,
onFocus: null,
onHide: null,
onMouseDown: null,
onShow: null,
optionDisabled: null,
optionGroupChildren: null,
optionGroupLabel: null,
optionGroupTemplate: null,
optionLabel: null,
optionValue: null,
options: null,
panelClassName: null,
panelStyle: null,
placeholder: null,
required: false,
resetFilterOnHide: false,
scrollHeight: '200px',
showClear: false,
showFilterClear: false,
showOnFocus: false,
style: null,
tabIndex: null,
tooltip: null,
tooltipOptions: null,
transitionOptions: null,
value: null,
valueTemplate: null,
virtualScrollerOptions: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, DropdownBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, DropdownBase.defaultProps);
}
};
var DropdownItem = /*#__PURE__*/React__namespace.memo(function (props) {
var onClick = function onClick(event) {
if (props.onClick) {
props.onClick({
originalEvent: event,
option: props.option
});
}
};
var className = classNames('p-dropdown-item', {
'p-highlight': props.selected,
'p-disabled': props.disabled,
'p-dropdown-item-empty': !props.label || props.label.length === 0
}, props.option && props.option.className);
var content = props.template ? ObjectUtils.getJSXElement(props.template, props.option) : props.label;
return /*#__PURE__*/React__namespace.createElement("li", {
className: className,
style: props.style,
onClick: onClick,
"aria-label": props.label,
key: props.label,
role: "option",
"aria-selected": props.selected
}, content, /*#__PURE__*/React__namespace.createElement(Ripple, null));
});
DropdownItem.displayName = 'DropdownItem';
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; }
var DropdownPanel = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (props, ref) {
var virtualScrollerRef = React__namespace.useRef(null);
var filterInputRef = React__namespace.useRef(null);
var isEmptyFilter = !(props.visibleOptions && props.visibleOptions.length) && props.hasFilter;
var filterOptions = {
filter: function filter(e) {
return onFilterInputChange(e);
},
reset: function reset() {
return props.resetFilter();
}
};
var onEnter = function onEnter() {
props.onEnter(function () {
if (virtualScrollerRef.current) {
var selectedIndex = props.getSelectedOptionIndex();
if (selectedIndex !== -1) {
setTimeout(function () {
return virtualScrollerRef.current.scrollToIndex(selectedIndex);
}, 0);
}
}
});
};
var onEntered = function onEntered() {
props.onEntered(function () {
if (props.filter && props.filterInputAutoFocus) {
DomHandler.focus(filterInputRef.current, false);
}
});
};
var onFilterInputChange = function onFilterInputChange(event) {
virtualScrollerRef.current && virtualScrollerRef.current.scrollToIndex(0);
props.onFilterInputChange && props.onFilterInputChange(event);
};
var createGroupChildren = function createGroupChildren(optionGroup, style) {
var groupChildren = props.getOptionGroupChildren(optionGroup);
return groupChildren.map(function (option, j) {
var optionLabel = props.getOptionLabel(option);
var optionKey = j + '_' + props.getOptionRenderKey(option);
var disabled = props.isOptionDisabled(option);
return /*#__PURE__*/React__namespace.createElement(DropdownItem, {
key: optionKey,
label: optionLabel,
option: option,
style: style,
template: props.itemTemplate,
selected: props.isSelected(option),
disabled: disabled,
onClick: props.onOptionClick
});
});
};
var createEmptyMessage = function createEmptyMessage(emptyMessage, isFilter) {
var message = ObjectUtils.getJSXElement(emptyMessage, props) || localeOption(isFilter ? 'emptyFilterMessage' : 'emptyMessage');
return /*#__PURE__*/React__namespace.createElement("li", {
className: "p-dropdown-empty-message"
}, message);
};
var createItem = function createItem(option, index) {
var scrollerOptions = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
var style = {
height: scrollerOptions.props ? scrollerOptions.props.itemSize : undefined
};
if (props.optionGroupLabel) {
var groupContent = props.optionGroupTemplate ? ObjectUtils.getJSXElement(props.optionGroupTemplate, option, index) : props.getOptionGroupLabel(option);
var groupChildrenContent = createGroupChildren(option, style);
var key = index + '_' + props.getOptionGroupRenderKey(option);
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, {
key: key
}, /*#__PURE__*/React__namespace.createElement("li", {
className: "p-dropdown-item-group",
style: style
}, groupContent), groupChildrenContent);
} else {
var optionLabel = props.getOptionLabel(option);
var optionKey = index + '_' + props.getOptionRenderKey(option);
var disabled = props.isOptionDisabled(option);
return /*#__PURE__*/React__namespace.createElement(DropdownItem, {
key: optionKey,
label: optionLabel,
option: option,
style: style,
template: props.itemTemplate,
selected: props.isSelected(option),
disabled: disabled,
onClick: props.onOptionClick
});
}
};
var createItems = function createItems() {
if (ObjectUtils.isNotEmpty(props.visibleOptions)) {
return props.visibleOptions.map(createItem);
} else if (props.hasFilter) {
return createEmptyMessage(props.emptyFilterMessage, true);
}
return createEmptyMessage(props.emptyMessage);
};
var createFilterClearIcon = function createFilterClearIcon() {
if (props.showFilterClear && props.filterValue) {
var ariaLabel = localeOption('clear');
return /*#__PURE__*/React__namespace.createElement("i", {
className: "p-dropdown-filter-clear-icon pi pi-times",
"aria-label": ariaLabel,
onClick: function onClick() {
return props.onFilterClearIconClick(function () {
return DomHandler.focus(filterInputRef.current);
});
}
});
}
return null;
};
var createFilter = function createFilter() {
if (props.filter) {
var clearIcon = createFilterClearIcon();
var containerClassName = classNames('p-dropdown-filter-container', {
'p-dropdown-clearable-filter': !!clearIcon
});
var content = /*#__PURE__*/React__namespace.createElement("div", {
className: containerClassName
}, /*#__PURE__*/React__namespace.createElement("input", {
ref: filterInputRef,
type: "text",
autoComplete: "off",
className: "p-dropdown-filter p-inputtext p-component",
placeholder: props.filterPlaceholder,
onKeyDown: props.onFilterInputKeyDown,
onChange: onFilterInputChange,
value: props.filterValue
}), clearIcon, /*#__PURE__*/React__namespace.createElement("i", {
className: "p-dropdown-filter-icon pi pi-search"
}));
if (props.filterTemplate) {
var defaultContentOptions = {
className: containerClassName,
element: content,
filterOptions: filterOptions,
filterInputKeyDown: props.onFilterInputKeyDown,
filterInputChange: onFilterInputChange,
filterIconClassName: 'p-dropdown-filter-icon pi pi-search',
clearIcon: clearIcon,
props: props
};
content = ObjectUtils.getJSXElement(props.filterTemplate, defaultContentOptions);
}
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-dropdown-header"
}, content);
}
return null;
};
var createContent = function createContent() {
if (props.virtualScrollerOptions) {
var virtualScrollerProps = _objectSpread$p(_objectSpread$p({}, props.virtualScrollerOptions), {
style: _objectSpread$p(_objectSpread$p({}, props.virtualScrollerOptions.style), {
height: props.scrollHeight
}),
className: classNames('p-dropdown-items-wrapper', props.virtualScrollerOptions.className),
items: props.visibleOptions,
autoSize: true,
onLazyLoad: function onLazyLoad(event) {
return props.virtualScrollerOptions.onLazyLoad(_objectSpread$p(_objectSpread$p({}, event), {
filter: props.filterValue
}));
},
itemTemplate: function itemTemplate(item, options) {
return item && createItem(item, options.index, options);
},
contentTemplate: function contentTemplate(options) {
var className = classNames('p-dropdown-items', options.className);
var content = isEmptyFilter ? createEmptyMessage() : options.children;
return /*#__PURE__*/React__namespace.createElement("ul", {
ref: options.contentRef,
style: options.style,
className: className,
role: "listbox"
}, content);
}
});
return /*#__PURE__*/React__namespace.createElement(VirtualScroller, _extends({
ref: virtualScrollerRef
}, virtualScrollerProps));
} else {
var items = createItems();
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-dropdown-items-wrapper",
style: {
maxHeight: props.scrollHeight || 'auto'
}
}, /*#__PURE__*/React__namespace.createElement("ul", {
className: "p-dropdown-items",
role: "listbox"
}, items));
}
};
var createElement = function createElement() {
var className = classNames('p-dropdown-panel p-component', props.panelClassName, {
'p-input-filled': PrimeReact.inputStyle === 'filled',
'p-ripple-disabled': PrimeReact.ripple === false
});
var filter = createFilter();
var content = createContent();
return /*#__PURE__*/React__namespace.createElement(CSSTransition, {
nodeRef: ref,
classNames: "p-connected-overlay",
"in": props["in"],
timeout: {
enter: 120,
exit: 100
},
options: props.transitionOptions,
unmountOnExit: true,
onEnter: onEnter,
onEntering: props.onEntering,
onEntered: onEntered,
onExit: props.onExit,
onExited: props.onExited
}, /*#__PURE__*/React__namespace.createElement("div", {
ref: ref,
className: className,
style: props.panelStyle,
onClick: props.onClick
}, filter, content));
};
var element = createElement();
return /*#__PURE__*/React__namespace.createElement(Portal, {
element: element,
appendTo: props.appendTo
});
}));
DropdownPanel.displayName = 'DropdownPanel';
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 _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; }
var Dropdown = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = DropdownBase.getProps(inProps);
var _React$useState = React__namespace.useState(''),
_React$useState2 = _slicedToArray(_React$useState, 2),
filterState = _React$useState2[0],
setFilterState = _React$useState2[1];
var _React$useState3 = React__namespace.useState(false),
_React$useState4 = _slicedToArray(_React$useState3, 2),
focusedState = _React$useState4[0],
setFocusedState = _React$useState4[1];
var _React$useState5 = React__namespace.useState(false),
_React$useState6 = _slicedToArray(_React$useState5, 2),
overlayVisibleState = _React$useState6[0],
setOverlayVisibleState = _React$useState6[1];
var elementRef = React__namespace.useRef(null);
var overlayRef = React__namespace.useRef(null);
var inputRef = React__namespace.useRef(props.inputRef);
var focusInputRef = React__namespace.useRef(props.focusInputRef);
var searchTimeout = React__namespace.useRef(null);
var searchValue = React__namespace.useRef(null);
var currentSearchChar = React__namespace.useRef(null);
var isLazy = props.virtualScrollerOptions && props.virtualScrollerOptions.lazy;
var hasFilter = ObjectUtils.isNotEmpty(filterState);
var appendTo = props.appendTo || PrimeReact.appendTo;
var _useOverlayListener = useOverlayListener({
target: elementRef,
overlay: overlayRef,
listener: function listener(event, _ref) {
var type = _ref.type,
valid = _ref.valid;
if (valid) {
type === 'outside' ? !isClearClicked(event) && hide() : hide();
}
},
when: overlayVisibleState
}),
_useOverlayListener2 = _slicedToArray(_useOverlayListener, 2),
bindOverlayListener = _useOverlayListener2[0],
unbindOverlayListener = _useOverlayListener2[1];
var getVisibleOptions = function getVisibleOptions() {
if (hasFilter && !isLazy) {
var filterValue = filterState.trim().toLocaleLowerCase(props.filterLocale);
var searchFields = props.filterBy ? props.filterBy.split(',') : [props.optionLabel || 'label'];
if (props.optionGroupLabel) {
var filteredGroups = [];
var _iterator = _createForOfIteratorHelper$a(props.options),
_step;
try {
for (_iterator.s(); !(_step = _iterator.n()).done;) {
var optgroup = _step.value;
var filteredSubOptions = FilterService.filter(getOptionGroupChildren(optgroup), searchFields, filterValue, props.filterMatchMode, props.filterLocale);
if (filteredSubOptions && filteredSubOptions.length) {
filteredGroups.push(_objectSpread$o(_objectSpread$o({}, optgroup), {
items: filteredSubOptions
}));
}
}
} catch (err) {
_iterator.e(err);
} finally {
_iterator.f();
}
return filteredGroups;
} else {
return FilterService.filter(props.options, searchFields, filterValue, props.filterMatchMode, props.filterLocale);
}
} else {
return props.options;
}
};
var isClearClicked = function isClearClicked(event) {
return DomHandler.hasClass(event.target, 'p-dropdown-clear-icon') || DomHandler.hasClass(event.target, 'p-dropdown-filter-clear-icon');
};
var onClick = function onClick(event) {
if (props.disabled) {
return;
}
props.onClick && props.onClick(event);
// do not continue if the user defined click wants to prevent it
if (event.defaultPrevented) {
return;
}
if (DomHandler.hasClass(event.target, 'p-dropdown-clear-icon') || event.target.tagName === 'INPUT') {
return;
} else if (!overlayRef.current || !(overlayRef.current && overlayRef.current.contains(event.target))) {
DomHandler.focus(focusInputRef.current);
overlayVisibleState ? hide() : show();
}
};
var onInputFocus = function onInputFocus(event) {
if (props.showOnFocus && !overlayVisibleState) {
show();
}
setFocusedState(true);
props.onFocus && props.onFocus(event);
};
var onInputBlur = function onInputBlur(event) {
setFocusedState(false);
if (props.onBlur) {
setTimeout(function () {
var currentValue = inputRef.current ? inputRef.current.value : undefined;
props.onBlur({
originalEvent: event.originalEvent,
value: currentValue,
stopPropagation: function stopPropagation() {},
preventDefault: function preventDefault() {},
target: {
name: props.name,
id: props.id,
value: currentValue
}
});
}, 200);
}
};
var onPanelClick = function onPanelClick(event) {
OverlayService.emit('overlay-click', {
originalEvent: event,
target: elementRef.current
});
};
var onInputKeyDown = function onInputKeyDown(event) {
switch (event.which) {
//down
case 40:
onDownKey(event);
break;
//up
case 38:
onUpKey(event);
break;
//space and enter
case 32:
case 13:
overlayVisibleState ? hide() : show();
event.preventDefault();
break;
//escape and tab
case 27:
case 9:
hide();
break;
default:
search(event);
break;
}
};
var onFilterInputKeyDown = function onFilterInputKeyDown(event) {
switch (event.which) {
//down
case 40:
onDownKey(event);
break;
//up
case 38:
onUpKey(event);
break;
//enter and escape
case 13:
case 27:
hide();
event.preventDefault();
break;
}
};
var onUpKey = function onUpKey(event) {
if (visibleOptions) {
var prevOption = findPrevOption(getSelectedOptionIndex());
if (prevOption) {
selectItem({
originalEvent: event,
option: prevOption
});
}
}
event.preventDefault();
};
var onDownKey = function onDownKey(event) {
if (visibleOptions) {
if (!overlayVisibleState && event.altKey) {
show();
} else {
var nextOption = findNextOption(getSelectedOptionIndex());
if (nextOption) {
selectItem({
originalEvent: event,
option: nextOption
});
}
}
}
event.preventDefault();
};
var findNextOption = function findNextOption(index) {
if (props.optionGroupLabel) {
var groupIndex = index === -1 ? 0 : index.group;
var optionIndex = index === -1 ? -1 : index.option;
var option = findNextOptionInList(getOptionGroupChildren(visibleOptions[groupIndex]), optionIndex);
if (option) return option;else if (groupIndex + 1 !== visibleOptions.length) return findNextOption({
group: groupIndex + 1,
option: -1
});else return null;
}
return findNextOptionInList(visibleOptions, index);
};
var findNextOptionInList = function findNextOptionInList(list, index) {
var i = index + 1;
if (i === list.length) {
return null;
}
var option = list[i];
return isOptionDisabled(option) ? findNextOptionInList(i) : option;
};
var findPrevOption = function findPrevOption(index) {
if (index === -1) {
return null;
}
if (props.optionGroupLabel) {
var groupIndex = index.group;
var optionIndex = index.option;
var option = findPrevOptionInList(getOptionGroupChildren(visibleOptions[groupIndex]), optionIndex);
if (option) return option;else if (groupIndex > 0) return findPrevOption({
group: groupIndex - 1,
option: getOptionGroupChildren(visibleOptions[groupIndex - 1]).length
});else return null;
}
return findPrevOptionInList(visibleOptions, index);
};
var findPrevOptionInList = function findPrevOptionInList(list, index) {
var i = index - 1;
if (i < 0) {
return null;
}
var option = list[i];
return isOptionDisabled(option) ? findPrevOption(i) : option;
};
var search = function search(event) {
if (searchTimeout.current) {
clearTimeout(searchTimeout.current);
}
var _char = event.key;
if (_char === 'Shift' || _char === 'Control' || _char === 'Alt') {
return;
}
if (currentSearchChar.current === _char) searchValue.current = _char;else searchValue.current = searchValue.current ? searchValue.current + _char : _char;
currentSearchChar.current = _char;
if (searchValue.current) {
var searchIndex = getSelectedOptionIndex();
var newOption = props.optionGroupLabel ? searchOptionInGroup(searchIndex) : searchOption(searchIndex + 1);
if (newOption) {
selectItem({
originalEvent: event,
option: newOption
});
}
}
searchTimeout.current = setTimeout(function () {
searchValue.current = null;
}, 250);
};
var searchOption = function searchOption(index) {
if (searchValue.current) {
return searchOptionInRange(index, visibleOptions.length) || searchOptionInRange(0, index);
}
return null;
};
var searchOptionInRange = function searchOptionInRange(start, end) {
for (var i = start; i < end; i++) {
var opt = visibleOptions[i];
if (matchesSearchValue(opt)) {
return opt;
}
}
return null;
};
var searchOptionInGroup = function searchOptionInGroup(index) {
var searchIndex = index === -1 ? {
group: 0,
option: -1
} : index;
for (var i = searchIndex.group; i < visibleOptions.length; i++) {
var groupOptions = getOptionGroupChildren(visibleOptions[i]);
for (var j = searchIndex.group === i ? searchIndex.option + 1 : 0; j < groupOptions.length; j++) {
if (matchesSearchValue(groupOptions[j])) {
return groupOptions[j];
}
}
}
for (var _i = 0; _i <= searchIndex.group; _i++) {
var _groupOptions = getOptionGroupChildren(visibleOptions[_i]);
for (var _j = 0; _j < (searchIndex.group === _i ? searchIndex.option : _groupOptions.length); _j++) {
if (matchesSearchValue(_groupOptions[_j])) {
return _groupOptions[_j];
}
}
}
return null;
};
var matchesSearchValue = function matchesSearchValue(option) {
var label = getOptionLabel(option);
if (!label) {
return false;
}
label = label.toLocaleLowerCase(props.filterLocale);
return label.startsWith(searchValue.current.toLocaleLowerCase(props.filterLocale));
};
var onEditableInputChange = function onEditableInputChange(event) {
if (props.onChange) {
props.onChange({
originalEvent: event.originalEvent,
value: event.target.value,
stopPropagation: function stopPropagation() {},
preventDefault: function preventDefault() {},
target: {
name: props.name,
id: props.id,
value: event.target.value
}
});
}
};
var onEditableInputFocus = function onEditableInputFocus(event) {
setFocusedState(true);
hide();
props.onFocus && props.onFocus(event);
};
var onOptionClick = function onOptionClick(event) {
var option = event.option;
if (!option.disabled) {
selectItem(event);
DomHandler.focus(focusInputRef.current);
}
hide();
};
var onFilterInputChange = function onFilterInputChange(event) {
var filter = event.target.value;
setFilterState(filter);
if (props.onFilter) {
props.onFilter({
originalEvent: event,
filter: filter
});
}
};
var onFilterClearIconClick = function onFilterClearIconClick(callback) {
resetFilter(callback);
};
var resetFilter = function resetFilter(callback) {
setFilterState('');
props.onFilter && props.onFilter({
filter: ''
});
callback && callback();
};
var clear = function clear(event) {
if (props.onChange) {
props.onChange({
originalEvent: event,
value: undefined,
stopPropagation: function stopPropagation() {},
preventDefault: function preventDefault() {},
target: {
name: props.name,
id: props.id,
value: undefined
}
});
}
updateEditableLabel();
};
var selectItem = function selectItem(event) {
if (selectedOption !== event.option) {
updateEditableLabel(event.option);
var optionValue = getOptionValue(event.option);
if (props.onChange) {
props.onChange({
originalEvent: event.originalEvent,
value: optionValue,
stopPropagation: function stopPropagation() {},
preventDefault: function preventDefault() {},
target: {
name: props.name,
id: props.id,
value: optionValue
}
});
}
}
};
var getSelectedOptionIndex = function getSelectedOptionIndex(options) {
options = options || visibleOptions;
if (props.value != null && options) {
if (props.optionGroupLabel) {
for (var i = 0; i < options.length; i++) {
var selectedOptionIndex = findOptionIndexInList(props.value, getOptionGroupChildren(options[i]));
if (selectedOptionIndex !== -1) {
return {
group: i,
option: selectedOptionIndex
};
}
}
} else {
return findOptionIndexInList(props.value, options);
}
}
return -1;
};
var equalityKey = function equalityKey() {
return props.optionValue ? null : props.dataKey;
};
var findOptionIndexInList = function findOptionIndexInList(value, list) {
var key = equalityKey();
return list.findIndex(function (item) {
return ObjectUtils.equals(value, getOptionValue(item), key);
});
};
var isSelected = function isSelected(option) {
return ObjectUtils.equals(props.value, getOptionValue(option), equalityKey());
};
var show = function show() {
setOverlayVisibleState(true);
};
var hide = function hide() {
setOverlayVisibleState(false);
};
var onOverlayEnter = function onOverlayEnter(callback) {
ZIndexUtils.set('overlay', overlayRef.current, PrimeReact.autoZIndex, PrimeReact.zIndex['overlay']);
alignOverlay();
callback && callback();
};
var onOverlayEntered = function onOverlayEntered(callback) {
callback && callback();
bindOverlayListener();
props.onShow && props.onShow();
};
var onOverlayExit = function onOverlayExit() {
unbindOverlayListener();
};
var onOverlayExited = function onOverlayExited() {
if (props.filter && props.resetFilterOnHide) {
resetFilter();
}
ZIndexUtils.clear(overlayRef.current);
props.onHide && props.onHide();
};
var alignOverlay = function alignOverlay() {
DomHandler.alignOverlay(overlayRef.current, inputRef.current.parentElement, props.appendTo || PrimeReact.appendTo);
};
var scrollInView = function scrollInView() {
var highlightItem = DomHandler.findSingle(overlayRef.current, 'li.p-highlight');
if (highlightItem && highlightItem.scrollIntoView) {
highlightItem.scrollIntoView({
block: 'nearest',
inline: 'nearest'
});
}
};
var updateEditableLabel = function updateEditableLabel(option) {
if (inputRef.current) {
inputRef.current.value = option ? getOptionLabel(option) : props.value || '';
}
};
var getOptionLabel = function getOptionLabel(option) {
return props.optionLabel ? ObjectUtils.resolveFieldData(option, props.optionLabel) : option && option['label'] !== undefined ? option['label'] : option;
};
var getOptionValue = function getOptionValue(option) {
return props.optionValue ? ObjectUtils.resolveFieldData(option, props.optionValue) : option && option['value'] !== undefined ? option['value'] : option;
};
var getOptionRenderKey = function getOptionRenderKey(option) {
return props.dataKey ? ObjectUtils.resolveFieldData(option, props.dataKey) : getOptionLabel(option);
};
var isOptionDisabled = function isOptionDisabled(option) {
if (props.optionDisabled) {
return ObjectUtils.isFunction(props.optionDisabled) ? props.optionDisabled(option) : ObjectUtils.resolveFieldData(option, props.optionDisabled);
}
return option && option['disabled'] !== undefined ? option['disabled'] : false;
};
var getOptionGroupRenderKey = function getOptionGroupRenderKey(optionGroup) {
return ObjectUtils.resolveFieldData(optionGroup, props.optionGroupLabel);
};
var getOptionGroupLabel = function getOptionGroupLabel(optionGroup) {
return ObjectUtils.resolveFieldData(optionGroup, props.optionGroupLabel);
};
var getOptionGroupChildren = function getOptionGroupChildren(optionGroup) {
return ObjectUtils.resolveFieldData(optionGroup, props.optionGroupChildren);
};
var updateInputField = function updateInputField() {
if (props.editable && inputRef.current) {
var label = selectedOption ? getOptionLabel(selectedOption) : null;
var value = label || props.value || '';
inputRef.current.value = value;
}
};
var getSelectedOption = function getSelectedOption() {
var index = getSelectedOptionIndex(props.options);
return index !== -1 ? props.optionGroupLabel ? getOptionGroupChildren(props.options[index.group])[index.option] : props.options[index] : null;
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
show: show,
hide: hide,
focus: function focus() {
return DomHandler.focus(focusInputRef.current);
},
getElement: function getElement() {
return elementRef.current;
},
getOverlay: function getOverlay() {
return overlayRef.current;
},
getInput: function getInput() {
return inputRef.current;
},
getFocusInput: function getFocusInput() {
return focusInputRef.current;
}
};
});
React__namespace.useEffect(function () {
ObjectUtils.combinedRefs(inputRef, props.inputRef);
ObjectUtils.combinedRefs(focusInputRef, props.focusInputRef);
}, [inputRef, props.inputRef, focusInputRef, props.focusInputRef]);
useMountEffect(function () {
if (props.autoFocus) {
DomHandler.focus(focusInputRef.current, props.autoFocus);
}
});
useUpdateEffect(function () {
if (overlayVisibleState && props.value) {
scrollInView();
}
}, [overlayVisibleState, props.value]);
useUpdateEffect(function () {
if (overlayVisibleState && filterState && props.filter) {
alignOverlay();
}
}, [overlayVisibleState, filterState, props.filter]);
useUpdateEffect(function () {
if (filterState && (!props.options || props.options.length === 0)) {
setFilterState('');
}
updateInputField();
if (inputRef.current) {
inputRef.current.selectedIndex = 1;
}
});
useUnmountEffect(function () {
ZIndexUtils.clear(overlayRef.current);
});
var createHiddenSelect = function createHiddenSelect() {
var option = {
value: '',
label: props.placeholder
};
if (selectedOption) {
var optionValue = getOptionValue(selectedOption);
option = {
value: _typeof(optionValue) === 'object' ? props.options.findIndex(function (o) {
return o === optionValue;
}) : optionValue,
label: getOptionLabel(selectedOption)
};
}
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-hidden-accessible p-dropdown-hidden-select"
}, /*#__PURE__*/React__namespace.createElement("select", {
ref: inputRef,
required: props.required,
defaultValue: option.value,
name: props.name,
tabIndex: -1,
"aria-hidden": "true"
}, /*#__PURE__*/React__namespace.createElement("option", {
value: option.value
}, option.label)));
};
var createKeyboardHelper = function createKeyboardHelper() {
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-hidden-accessible"
}, /*#__PURE__*/React__namespace.createElement("input", _extends({
ref: focusInputRef,
id: props.inputId,
type: "text",
readOnly: true,
"aria-haspopup": "listbox",
onFocus: onInputFocus,
onBlur: onInputBlur,
onKeyDown: onInputKeyDown,
disabled: props.disabled,
tabIndex: props.tabIndex
}, ariaProps)));
};
var createLabel = function createLabel() {
var label = ObjectUtils.isNotEmpty(selectedOption) ? getOptionLabel(selectedOption) : null;
if (props.editable) {
var value = label || props.value || '';
return /*#__PURE__*/React__namespace.createElement("input", _extends({
ref: inputRef,
type: "text",
defaultValue: value,
className: "p-dropdown-label p-inputtext",
disabled: props.disabled,
placeholder: props.placeholder,
maxLength: props.maxLength,
onInput: onEditableInputChange,
onFocus: onEditableInputFocus,
onBlur: onInputBlur,
"aria-haspopup": "listbox"
}, ariaProps));
} else {
var _className = classNames('p-dropdown-label p-inputtext', {
'p-placeholder': label === null && props.placeholder,
'p-dropdown-label-empty': label === null && !props.placeholder
});
var content = props.valueTemplate ? ObjectUtils.getJSXElement(props.valueTemplate, selectedOption, props) : label || props.placeholder || 'empty';
return /*#__PURE__*/React__namespace.createElement("span", {
ref: inputRef,
className: _className
}, content);
}
};
var createClearIcon = function createClearIcon() {
if (props.value != null && props.showClear && !props.disabled) {
var iconClassName = classNames('p-dropdown-clear-icon p-clickable');
var iconProps = {
className: iconClassName,
onPointerUp: clear
};
return IconUtils.getJSXIcon(props.clearIcon, iconProps);
}
return null;
};
var createDropdownIcon = function createDropdownIcon() {
var iconClassName = classNames('p-dropdown-trigger-icon p-clickable');
var icon = IconUtils.getJSXIcon(props.dropdownIcon, {
className: iconClassName
});
var ariaLabel = props.placeholder || props.ariaLabel;
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-dropdown-trigger",
role: "button",
"aria-haspopup": "listbox",
"aria-expanded": overlayVisibleState,
"aria-label": ariaLabel
}, icon);
};
var visibleOptions = getVisibleOptions();
var selectedOption = getSelectedOption();
var hasTooltip = ObjectUtils.isNotEmpty(props.tooltip);
var otherProps = DropdownBase.getOtherProps(props);
var ariaProps = ObjectUtils.reduceKeys(otherProps, DomHandler.ARIA_PROPS);
var className = classNames('p-dropdown p-component p-inputwrapper', {
'p-disabled': props.disabled,
'p-focus': focusedState,
'p-dropdown-clearable': props.showClear && !props.disabled,
'p-inputwrapper-filled': ObjectUtils.isNotEmpty(props.value),
'p-inputwrapper-focus': focusedState || overlayVisibleState
}, props.className);
var hiddenSelect = createHiddenSelect();
var keyboardHelper = createKeyboardHelper();
var labelElement = createLabel();
var dropdownIcon = createDropdownIcon();
var clearIcon = createClearIcon();
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement("div", _extends({
ref: elementRef,
id: props.id,
className: className,
style: props.style
}, otherProps, {
onClick: onClick,
onMouseDown: props.onMouseDown,
onContextMenu: props.onContextMenu
}), keyboardHelper, hiddenSelect, labelElement, clearIcon, dropdownIcon, /*#__PURE__*/React__namespace.createElement(DropdownPanel, _extends({
ref: overlayRef,
visibleOptions: visibleOptions
}, props, {
appendTo: appendTo,
onClick: onPanelClick,
onOptionClick: onOptionClick,
filterValue: filterState,
hasFilter: hasFilter,
onFilterClearIconClick: onFilterClearIconClick,
resetFilter: resetFilter,
onFilterInputKeyDown: onFilterInputKeyDown,
onFilterInputChange: onFilterInputChange,
getOptionLabel: getOptionLabel,
getOptionRenderKey: getOptionRenderKey,
isOptionDisabled: isOptionDisabled,
getOptionGroupChildren: getOptionGroupChildren,
getOptionGroupLabel: getOptionGroupLabel,
getOptionGroupRenderKey: getOptionGroupRenderKey,
isSelected: isSelected,
getSelectedOptionIndex: getSelectedOptionIndex,
"in": overlayVisibleState,
onEnter: onOverlayEnter,
onEntered: onOverlayEntered,
onExit: onOverlayExit,
onExited: onOverlayExited
}))), hasTooltip && /*#__PURE__*/React__namespace.createElement(Tooltip, _extends({
target: elementRef,
content: props.tooltip
}, props.tooltipOptions)));
}));
Dropdown.displayName = 'Dropdown';
var RowsPerPageDropdown = /*#__PURE__*/React__namespace.memo(function (inProps) {
var props = RowsPerPageDropdownBase.getProps(inProps);
var hasOptions = props.options && props.options.length > 0;
var options = hasOptions ? props.options.map(function (opt) {
return {
label: String(opt),
value: opt
};
}) : [];
var ariaLabel = localeOption('choose');
var element = hasOptions ? /*#__PURE__*/React__namespace.createElement(Dropdown, {
value: props.value,
options: options,
onChange: props.onChange,
appendTo: props.appendTo,
disabled: props.disabled,
placeholder: ariaLabel,
"aria-label": ariaLabel
}) : null;
if (props.template) {
var defaultOptions = {
value: props.value,
options: options,
onChange: props.onChange,
appendTo: props.appendTo,
currentPage: props.page,
totalPages: props.pageCount,
totalRecords: props.totalRecords,
disabled: props.disabled,
element: element,
props: props
};
return ObjectUtils.getJSXElement(props.template, defaultOptions);
}
return element;
});
RowsPerPageDropdown.displayName = 'RowsPerPageDropdown';
var Paginator = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = PaginatorBase.getProps(inProps);
var elementRef = React__namespace.useRef(null);
var page = Math.floor(props.first / props.rows);
var pageCount = Math.ceil(props.totalRecords / props.rows);
var isFirstPage = page === 0;
var isLastPage = page === pageCount - 1;
var isEmpty = pageCount === 0;
var calculatePageLinkBoundaries = function calculatePageLinkBoundaries() {
var numberOfPages = pageCount;
var visiblePages = Math.min(props.pageLinkSize, numberOfPages);
//calculate range, keep current in middle if necessary
var start = Math.max(0, Math.ceil(page - visiblePages / 2));
var end = Math.min(numberOfPages - 1, start + visiblePages - 1);
//check when approaching to last page
var delta = props.pageLinkSize - (end - start + 1);
start = Math.max(0, start - delta);
return [start, end];
};
var updatePageLinks = function updatePageLinks() {
var pageLinks = [];
var boundaries = calculatePageLinkBoundaries();
var start = boundaries[0];
var end = boundaries[1];
for (var i = start; i <= end; i++) {
pageLinks.push(i + 1);
}
return pageLinks;
};
var changePage = function changePage(first, rows) {
var pc = pageCount;
var p = Math.floor(first / rows);
if (p >= 0 && p < pc) {
var newPageState = {
first: first,
rows: rows,
page: p,
pageCount: pc
};
if (props.onPageChange) {
props.onPageChange(newPageState);
}
}
};
var changePageToFirst = function changePageToFirst(event) {
changePage(0, props.rows);
event.preventDefault();
};
var changePageToPrev = function changePageToPrev(event) {
changePage(props.first - props.rows, props.rows);
event.preventDefault();
};
var onPageLinkClick = function onPageLinkClick(event) {
changePage((event.value - 1) * props.rows, props.rows);
};
var changePageToNext = function changePageToNext(event) {
changePage(props.first + props.rows, props.rows);
event.preventDefault();
};
var changePageToLast = function changePageToLast(event) {
changePage((pageCount - 1) * props.rows, props.rows);
event.preventDefault();
};
var onRowsChange = function onRowsChange(event) {
var rows = event.value;
changePage(0, rows);
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
getElement: function getElement() {
return elementRef.current;
}
};
});
useUpdateEffect(function () {
if (page > 0 && props.first >= props.totalRecords) {
changePage((pageCount - 1) * props.rows, props.rows);
}
}, [props.totalRecords]);
var createElement = function createElement(key, template) {
var element;
switch (key) {
case 'FirstPageLink':
element = /*#__PURE__*/React__namespace.createElement(FirstPageLink, {
key: key,
onClick: changePageToFirst,
disabled: isFirstPage || isEmpty,
template: template
});
break;
case 'PrevPageLink':
element = /*#__PURE__*/React__namespace.createElement(PrevPageLink, {
key: key,
onClick: changePageToPrev,
disabled: isFirstPage || isEmpty,
template: template
});
break;
case 'NextPageLink':
element = /*#__PURE__*/React__namespace.createElement(NextPageLink, {
key: key,
onClick: changePageToNext,
disabled: isLastPage || isEmpty,
template: template
});
break;
case 'LastPageLink':
element = /*#__PURE__*/React__namespace.createElement(LastPageLink, {
key: key,
onClick: changePageToLast,
disabled: isLastPage || isEmpty,
template: template
});
break;
case 'PageLinks':
element = /*#__PURE__*/React__namespace.createElement(PageLinks, {
key: key,
value: updatePageLinks(),
page: page,
rows: props.rows,
pageCount: pageCount,
onClick: onPageLinkClick,
template: template
});
break;
case 'RowsPerPageDropdown':
element = /*#__PURE__*/React__namespace.createElement(RowsPerPageDropdown, {
key: key,
value: props.rows,
page: page,
pageCount: pageCount,
totalRecords: props.totalRecords,
options: props.rowsPerPageOptions,
onChange: onRowsChange,
appendTo: props.dropdownAppendTo,
template: template,
disabled: isEmpty
});
break;
case 'CurrentPageReport':
element = /*#__PURE__*/React__namespace.createElement(CurrentPageReport, {
reportTemplate: props.currentPageReportTemplate,
key: key,
page: page,
pageCount: pageCount,
first: props.first,
rows: props.rows,
totalRecords: props.totalRecords,
template: template
});
break;
case 'JumpToPageInput':
element = /*#__PURE__*/React__namespace.createElement(JumpToPageInput, {
key: key,
rows: props.rows,
page: page,
pageCount: pageCount,
onChange: changePage,
disabled: isEmpty,
template: template
});
break;
default:
element = null;
break;
}
return element;
};
var createElements = function createElements() {
var template = props.template;
if (template) {
if (_typeof(template) === 'object') {
return template.layout ? template.layout.split(' ').map(function (value) {
var key = value.trim();
return createElement(key, template[key]);
}) : Object.entries(template).map(function (_ref) {
var _ref2 = _slicedToArray(_ref, 2),
key = _ref2[0],
_template = _ref2[1];
return createElement(key, _template);
});
}
return template.split(' ').map(function (value) {
return createElement(value.trim());
});
}
return null;
};
if (!props.alwaysShow && pageCount === 1) {
return null;
} else {
var otherProps = PaginatorBase.getOtherProps(props);
var className = classNames('p-paginator p-component', props.className);
var leftContent = ObjectUtils.getJSXElement(props.leftContent, props);
var rightContent = ObjectUtils.getJSXElement(props.rightContent, props);
var elements = createElements();
var leftElement = leftContent && /*#__PURE__*/React__namespace.createElement("div", {
className: "p-paginator-left-content"
}, leftContent);
var rightElement = rightContent && /*#__PURE__*/React__namespace.createElement("div", {
className: "p-paginator-right-content"
}, rightContent);
return /*#__PURE__*/React__namespace.createElement("div", _extends({
ref: elementRef,
className: className,
style: props.style
}, otherProps), leftElement, elements, rightElement);
}
}));
Paginator.displayName = 'Paginator';
var DataTableBase = {
defaultProps: {
__TYPE: 'DataTable',
alwaysShowPaginator: true,
breakpoint: '960px',
cellClassName: null,
cellSelection: false,
className: null,
collapsedRowIcon: 'pi pi-chevron-right',
columnResizeMode: 'fit',
compareSelectionBy: 'deepEquals',
contextMenuSelection: null,
csvSeparator: ',',
currentPageReportTemplate: '({currentPage} of {totalPages})',
customRestoreState: null,
customSaveState: null,
dataKey: null,
defaultSortOrder: 1,
dragSelection: false,
editMode: 'cell',
editingRows: null,
emptyMessage: null,
expandableRowGroups: false,
expandedRowIcon: 'pi pi-chevron-down',
expandedRows: null,
exportFilename: 'download',
exportFunction: null,
filterDelay: 300,
filterDisplay: 'menu',
filterLocale: undefined,
filters: null,
first: 0,
footer: null,
footerColumnGroup: null,
frozenValue: null,
frozenWidth: null,
globalFilter: null,
globalFilterFields: null,
globalFilterMatchMode: FilterMatchMode.CONTAINS,
groupRowsBy: null,
header: null,
headerColumnGroup: null,
id: null,
isDataSelectable: null,
lazy: false,
loading: false,
loadingIcon: 'pi pi-spinner',
metaKeySelection: true,
multiSortMeta: null,
onAllRowsSelect: null,
onAllRowsUnselect: null,
onCellClick: null,
onCellSelect: null,
onCellUnselect: null,
onColReorder: null,
onColumnResizeEnd: null,
onColumnResizerClick: null,
onColumnResizerDoubleClick: null,
onContextMenu: null,
onContextMenuSelectionChange: null,
onFilter: null,
onPage: null,
onRowClick: null,
onRowMouseEnter: null,
onRowMouseLeave: null,
onRowCollapse: null,
onRowDoubleClick: null,
onRowEditCancel: null,
onRowEditChange: null,
onRowEditComplete: null,
onRowEditInit: null,
onRowEditSave: null,
onRowExpand: null,
onRowReorder: null,
onRowSelect: null,
onRowToggle: null,
onRowUnselect: null,
onSelectAllChange: null,
onSelectionChange: null,
onSort: null,
onStateRestore: null,
onStateSave: null,
onValueChange: null,
pageLinkSize: 5,
paginator: false,
paginatorClassName: null,
paginatorDropdownAppendTo: null,
paginatorLeft: null,
paginatorPosition: 'bottom',
paginatorRight: null,
paginatorTemplate: 'FirstPageLink PrevPageLink PageLinks NextPageLink LastPageLink RowsPerPageDropdown',
removableSort: false,
reorderableColumns: false,
reorderableRows: false,
resizableColumns: false,
responsiveLayout: 'scroll',
rowClassName: null,
rowEditValidator: null,
rowExpansionTemplate: null,
rowGroupFooterTemplate: null,
rowGroupHeaderTemplate: null,
rowGroupMode: null,
rowHover: false,
rows: null,
rowsPerPageOptions: null,
scrollHeight: null,
scrollable: false,
selectAll: false,
selectOnEdit: true,
selection: null,
selectionAriaLabel: null,
selectionAutoFocus: true,
selectionMode: null,
selectionPageOnly: false,
showGridlines: false,
showRowReorderElement: null,
showSelectAll: true,
showSelectionElement: null,
size: 'normal',
sortField: null,
sortMode: 'single',
sortOrder: null,
stateKey: null,
stateStorage: 'session',
stripedRows: false,
style: null,
tabIndex: 0,
tableClassName: null,
tableStyle: null,
totalRecords: null,
value: null,
virtualScrollerOptions: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, DataTableBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, DataTableBase.defaultProps);
}
};
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;
}
var RowCheckbox = /*#__PURE__*/React__namespace.memo(function (props) {
var _React$useState = React__namespace.useState(false),
_React$useState2 = _slicedToArray(_React$useState, 2),
focusedState = _React$useState2[0],
setFocusedState = _React$useState2[1];
var onFocus = function onFocus() {
setFocusedState(true);
};
var onBlur = function onBlur() {
setFocusedState(false);
};
var onClick = function onClick(event) {
if (!props.disabled) {
setFocusedState(true);
props.onChange(event);
}
};
var onKeyDown = function onKeyDown(event) {
if (event.code === 'Space' || event.key === ' ') {
// event.key is for Android support
onClick(event);
event.preventDefault();
}
};
var className = classNames('p-checkbox p-component', {
'p-checkbox-focused': focusedState
});
var boxClassName = classNames('p-checkbox-box p-component', {
'p-highlight': props.checked,
'p-disabled': props.disabled,
'p-focus': focusedState
});
var iconClassName = classNames('p-checkbox-icon', {
'pi pi-check': props.checked
});
var tabIndex = props.disabled ? null : '0';
return /*#__PURE__*/React__namespace.createElement("div", {
className: className,
onClick: onClick
}, /*#__PURE__*/React__namespace.createElement("div", {
className: boxClassName,
role: "checkbox",
"aria-checked": props.checked,
tabIndex: tabIndex,
onKeyDown: onKeyDown,
onFocus: onFocus,
onBlur: onBlur,
"aria-label": props.ariaLabel
}, /*#__PURE__*/React__namespace.createElement("span", {
className: iconClassName
})));
});
RowCheckbox.displayName = 'RowCheckbox';
var RowRadioButton = /*#__PURE__*/React__namespace.memo(function (props) {
var _React$useState = React__namespace.useState(false),
_React$useState2 = _slicedToArray(_React$useState, 2),
focusedState = _React$useState2[0],
setFocusedState = _React$useState2[1];
var inputRef = React__namespace.useRef(null);
var onFocus = function onFocus() {
setFocusedState(true);
};
var onBlur = function onBlur() {
setFocusedState(false);
};
var onClick = function onClick(event) {
if (!props.disabled) {
props.onChange(event);
DomHandler.focus(inputRef.current);
}
};
var onKeyDown = function onKeyDown(event) {
if (event.code === 'Space' || event.key === ' ') {
// event.key is for Android support
onClick(event);
event.preventDefault();
}
};
var onChange = function onChange(event) {
onClick(event);
};
var className = classNames('p-radiobutton p-component', {
'p-radiobutton-focused': focusedState
});
var boxClassName = classNames('p-radiobutton-box p-component', {
'p-highlight': props.checked,
'p-focus': focusedState,
'p-disabled': props.disabled
});
var name = "".concat(props.tableSelector, "_dt_radio");
return /*#__PURE__*/React__namespace.createElement("div", {
className: className
}, /*#__PURE__*/React__namespace.createElement("div", {
className: "p-hidden-accessible"
}, /*#__PURE__*/React__namespace.createElement("input", {
name: name,
ref: inputRef,
type: "radio",
checked: props.checked,
onFocus: onFocus,
onBlur: onBlur,
onChange: onChange,
onKeyDown: onKeyDown,
"aria-label": props.ariaLabel
})), /*#__PURE__*/React__namespace.createElement("div", {
className: boxClassName,
onClick: onClick,
role: "radio",
"aria-checked": props.checked
}, /*#__PURE__*/React__namespace.createElement("div", {
className: "p-radiobutton-icon"
})));
});
RowRadioButton.displayName = 'RowRadioButton';
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; }
var BodyCell = /*#__PURE__*/React__namespace.memo(function (props) {
var _React$useState = React__namespace.useState(props.editing),
_React$useState2 = _slicedToArray(_React$useState, 2),
editingState = _React$useState2[0],
setEditingState = _React$useState2[1];
var _React$useState3 = React__namespace.useState(props.rowData),
_React$useState4 = _slicedToArray(_React$useState3, 2),
editingRowDataState = _React$useState4[0],
setEditingRowDataState = _React$useState4[1];
var _React$useState5 = React__namespace.useState({}),
_React$useState6 = _slicedToArray(_React$useState5, 2),
styleObjectState = _React$useState6[0],
setStyleObjectState = _React$useState6[1];
var elementRef = React__namespace.useRef(null);
var keyHelperRef = React__namespace.useRef(null);
var overlayEventListener = React__namespace.useRef(null);
var selfClick = React__namespace.useRef(false);
var tabindexTimeout = React__namespace.useRef(null);
var initFocusTimeout = React__namespace.useRef(null);
var getColumnProp = function getColumnProp(name) {
return ColumnBase.getCProp(props.column, name);
};
var field = getColumnProp('field') || "field_".concat(props.index);
var editingKey = props.dataKey ? props.rowData && props.rowData[props.dataKey] || props.rowIndex : props.rowIndex;
var _useEventListener = useEventListener({
type: 'click',
listener: function listener(e) {
if (!selfClick.current && isOutsideClicked(e.target)) {
switchCellToViewMode(e, true);
}
selfClick.current = false;
},
options: true
}),
_useEventListener2 = _slicedToArray(_useEventListener, 2),
bindDocumentClickListener = _useEventListener2[0],
unbindDocumentClickListener = _useEventListener2[1];
if (props.editMode === 'row' && props.editing !== editingState) {
setEditingState(props.editing);
}
var isEditable = function isEditable() {
return getColumnProp('editor');
};
var isSelected = function isSelected() {
return props.selection ? props.selection instanceof Array ? findIndex(props.selection) > -1 : equals(props.selection) : false;
};
var equalsData = function equalsData(data) {
return props.compareSelectionBy === 'equals' ? data === props.rowData : ObjectUtils.equals(data, props.rowData, props.dataKey);
};
var equals = function equals(selectedCell) {
return selectedCell && (selectedCell.rowIndex === props.rowIndex || equalsData(selectedCell.rowData)) && (selectedCell.field === field || selectedCell.cellIndex === props.index);
};
var isOutsideClicked = function isOutsideClicked(target) {
return elementRef.current && !(elementRef.current.isSameNode(target) || elementRef.current.contains(target));
};
var getVirtualScrollerOption = function getVirtualScrollerOption(option) {
return props.virtualScrollerOptions ? props.virtualScrollerOptions[option] : null;
};
var getStyle = function getStyle() {
var bodyStyle = getColumnProp('bodyStyle');
var columnStyle = getColumnProp('style');
return getColumnProp('frozen') ? Object.assign({}, columnStyle, bodyStyle, styleObjectState) : Object.assign({}, columnStyle, bodyStyle);
};
var getCellParams = function getCellParams() {
return {
value: resolveFieldData(),
field: field,
rowData: props.rowData,
rowIndex: props.rowIndex,
cellIndex: props.index,
selected: isSelected(),
column: props.column,
props: props
};
};
var getCellCallbackParams = function getCellCallbackParams(event) {
var params = getCellParams();
return _objectSpread$n({
originalEvent: event
}, params);
};
var resolveFieldData = function resolveFieldData(data) {
return ObjectUtils.resolveFieldData(data || props.rowData, field);
};
var getEditingRowData = function getEditingRowData() {
return props.editingMeta && props.editingMeta[editingKey] ? props.editingMeta[editingKey].data : props.rowData;
};
var getTabIndex = function getTabIndex(cellSelected) {
return props.allowCellSelection ? cellSelected ? 0 : props.rowIndex === 0 && props.index === 0 ? props.tabIndex : -1 : null;
};
var findIndex = function findIndex(collection) {
return (collection || []).findIndex(function (data) {
return equals(data);
});
};
var closeCell = function closeCell(event) {
var params = getCellCallbackParams(event);
var onBeforeCellEditHide = 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 () {
setEditingState(false);
unbindDocumentClickListener();
OverlayService.off('overlay-click', overlayEventListener.current);
overlayEventListener.current = null;
selfClick.current = false;
}, 1);
};
var switchCellToViewMode = function switchCellToViewMode(event, submit) {
var callbackParams = getCellCallbackParams(event);
var newRowData = editingRowDataState;
var newValue = resolveFieldData(newRowData);
var params = _objectSpread$n(_objectSpread$n({}, callbackParams), {}, {
newRowData: newRowData,
newValue: newValue
});
var onCellEditCancel = getColumnProp('onCellEditCancel');
var cellEditValidator = getColumnProp('cellEditValidator');
var onCellEditComplete = getColumnProp('onCellEditComplete');
if (!submit && onCellEditCancel) {
onCellEditCancel(params);
}
var valid = true;
if (cellEditValidator) {
valid = cellEditValidator(params);
}
if (valid) {
if (submit && onCellEditComplete) {
onCellEditComplete(params);
}
closeCell(event);
} else {
event.preventDefault();
}
};
var findNextSelectableCell = function findNextSelectableCell(cell) {
var nextCell = cell.nextElementSibling;
return nextCell ? DomHandler.hasClass(nextCell, 'p-selectable-cell') ? nextCell : findNextSelectableCell(nextCell) : null;
};
var findPrevSelectableCell = function findPrevSelectableCell(cell) {
var prevCell = cell.previousElementSibling;
return prevCell ? DomHandler.hasClass(prevCell, 'p-selectable-cell') ? prevCell : findPrevSelectableCell(prevCell) : null;
};
var findDownSelectableCell = function findDownSelectableCell(cell) {
var downRow = cell.parentElement.nextElementSibling;
var downCell = downRow ? downRow.children[props.index] : null;
return downRow && downCell ? DomHandler.hasClass(downRow, 'p-selectable-row') && DomHandler.hasClass(downCell, 'p-selectable-cell') ? downCell : findDownSelectableCell(downCell) : null;
};
var findUpSelectableCell = function findUpSelectableCell(cell) {
var upRow = cell.parentElement.previousElementSibling;
var upCell = upRow ? upRow.children[props.index] : null;
return upRow && upCell ? DomHandler.hasClass(upRow, 'p-selectable-row') && DomHandler.hasClass(upCell, 'p-selectable-cell') ? upCell : findUpSelectableCell(upCell) : null;
};
var changeTabIndex = function changeTabIndex(currentCell, nextCell) {
if (currentCell && nextCell) {
currentCell.tabIndex = -1;
nextCell.tabIndex = props.tabIndex;
}
};
var focusOnElement = function focusOnElement() {
clearTimeout(tabindexTimeout.current);
tabindexTimeout.current = setTimeout(function () {
if (editingState) {
var focusableEl = props.editMode === 'cell' ? DomHandler.getFirstFocusableElement(elementRef.current, ':not(.p-cell-editor-key-helper)') : DomHandler.findSingle(elementRef.current, '.p-row-editor-save');
focusableEl && focusableEl.focus();
}
keyHelperRef.current && (keyHelperRef.current.tabIndex = editingState ? -1 : 0);
}, 1);
};
var focusOnInit = function focusOnInit() {
clearTimeout(initFocusTimeout.current);
initFocusTimeout.current = setTimeout(function () {
var focusableEl = props.editMode === 'row' ? DomHandler.findSingle(elementRef.current, '.p-row-editor-init') : null;
focusableEl && focusableEl.focus();
}, 1);
};
var updateStickyPosition = function updateStickyPosition() {
if (getColumnProp('frozen')) {
var styleObject = _objectSpread$n({}, styleObjectState);
var align = getColumnProp('alignFrozen');
if (align === 'right') {
var right = 0;
var next = elementRef.current && elementRef.current.nextElementSibling;
if (next) {
right = DomHandler.getOuterWidth(next) + parseFloat(next.style.right || 0);
}
styleObject['right'] = right + 'px';
} else {
var left = 0;
var prev = elementRef.current && elementRef.current.previousElementSibling;
if (prev) {
left = DomHandler.getOuterWidth(prev) + parseFloat(prev.style.left || 0);
}
styleObject['left'] = left + 'px';
}
var isSameStyle = styleObjectState['left'] === styleObject['left'] && styleObjectState['right'] === styleObject['right'];
!isSameStyle && setStyleObjectState(styleObject);
}
};
var editorCallback = function editorCallback(val) {
var editingRowData = _objectSpread$n({}, editingRowDataState);
editingRowData[field] = val;
setEditingRowDataState(editingRowData);
// update editing meta for complete methods on row mode
var currentData = getEditingRowData();
if (currentData) {
currentData[field] = val;
}
};
var onClick = function onClick(event) {
var params = getCellCallbackParams(event);
if (props.editMode !== 'row' && isEditable() && !editingState && (props.selectOnEdit || !props.selectOnEdit && props.selected)) {
selfClick.current = true;
var onBeforeCellEditShow = getColumnProp('onBeforeCellEditShow');
var onCellEditInit = getColumnProp('onCellEditInit');
var cellEditValidatorEvent = 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 () {
setEditingState(true);
if (onCellEditInit) {
onCellEditInit(params);
}
if (cellEditValidatorEvent === 'click') {
bindDocumentClickListener();
overlayEventListener.current = function (e) {
if (!isOutsideClicked(e.target)) {
selfClick.current = true;
}
};
OverlayService.on('overlay-click', overlayEventListener.current);
}
}, 1);
}
if (props.allowCellSelection && props.onClick) {
props.onClick(params);
}
};
var onMouseDown = function onMouseDown(event) {
var params = getCellCallbackParams(event);
props.onMouseDown && props.onMouseDown(params);
};
var onMouseUp = function onMouseUp(event) {
var params = getCellCallbackParams(event);
props.onMouseUp && props.onMouseUp(params);
};
var onKeyDown = function onKeyDown(event) {
if (props.editMode !== 'row') {
if (event.which === 13 || event.which === 9) {
// tab || enter
switchCellToViewMode(event, true);
}
if (event.which === 27) {
// escape
switchCellToViewMode(event, false);
}
}
if (props.allowCellSelection) {
var target = event.target,
cell = event.currentTarget;
switch (event.which) {
//left arrow
case 37:
var prevCell = findPrevSelectableCell(cell);
if (prevCell) {
changeTabIndex(cell, prevCell);
prevCell.focus();
}
event.preventDefault();
break;
//right arrow
case 39:
var nextCell = findNextSelectableCell(cell);
if (nextCell) {
changeTabIndex(cell, nextCell);
nextCell.focus();
}
event.preventDefault();
break;
//up arrow
case 38:
var upCell = findUpSelectableCell(cell);
if (upCell) {
changeTabIndex(cell, upCell);
upCell.focus();
}
event.preventDefault();
break;
//down arrow
case 40:
var downCell = findDownSelectableCell(cell);
if (downCell) {
changeTabIndex(cell, downCell);
downCell.focus();
}
event.preventDefault();
break;
//enter
case 13:
// @deprecated
if (!DomHandler.isClickable(target)) {
onClick(event);
event.preventDefault();
}
break;
//space
case 32:
if (!DomHandler.isClickable(target) && !target.readOnly) {
onClick(event);
event.preventDefault();
}
break;
}
}
};
var onBlur = function onBlur(event) {
selfClick.current = false;
if (props.editMode !== 'row' && editingState && getColumnProp('cellEditValidatorEvent') === 'blur') {
switchCellToViewMode(event, true);
}
};
var onEditorFocus = function onEditorFocus(event) {
onClick(event);
};
var onRadioChange = function onRadioChange(event) {
props.onRadioChange({
originalEvent: event,
data: props.rowData,
index: props.rowIndex
});
};
var onCheckboxChange = function onCheckboxChange(event) {
props.onCheckboxChange({
originalEvent: event,
data: props.rowData,
index: props.rowIndex
});
};
var onRowToggle = function onRowToggle(event) {
props.onRowToggle({
originalEvent: event,
data: props.rowData
});
event.preventDefault();
};
var onRowEditInit = function onRowEditInit(event) {
props.onRowEditInit({
originalEvent: event,
data: props.rowData,
newData: getEditingRowData(),
field: field,
index: props.rowIndex
});
};
var onRowEditSave = function onRowEditSave(event) {
props.onRowEditSave({
originalEvent: event,
data: props.rowData,
newData: getEditingRowData(),
field: field,
index: props.rowIndex
});
focusOnInit();
};
var onRowEditCancel = function onRowEditCancel(event) {
props.onRowEditCancel({
originalEvent: event,
data: props.rowData,
newData: getEditingRowData(),
field: field,
index: props.rowIndex
});
focusOnInit();
};
React__namespace.useEffect(function () {
if (getColumnProp('frozen')) {
updateStickyPosition();
}
if (props.editMode === 'cell' || props.editMode === 'row') {
focusOnElement();
}
});
useUpdateEffect(function () {
if (props.editMode === 'cell' || props.editMode === 'row') {
setEditingRowDataState(getEditingRowData());
}
}, [props.editingMeta]);
React__namespace.useEffect(function () {
if (props.editMode === 'cell' || props.editMode === 'row') {
var callbackParams = getCellCallbackParams();
var params = _objectSpread$n(_objectSpread$n({}, callbackParams), {}, {
editing: editingState,
editingKey: editingKey
});
props.onEditingMetaChange(params);
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [editingState]);
useUnmountEffect(function () {
if (overlayEventListener.current) {
OverlayService.off('overlay-click', overlayEventListener.current);
overlayEventListener.current = null;
}
});
var createLoading = function createLoading() {
var options = getVirtualScrollerOption('getLoaderOptions')(props.rowIndex, {
cellIndex: props.index,
cellFirst: props.index === 0,
cellLast: props.index === getVirtualScrollerOption('columns').length - 1,
cellEven: props.index % 2 === 0,
cellOdd: props.index % 2 !== 0,
column: props.column,
field: field
});
var content = ObjectUtils.getJSXElement(getVirtualScrollerOption('loadingTemplate'), options);
return /*#__PURE__*/React__namespace.createElement("td", null, content);
};
var createElement = function createElement() {
var content, editorKeyHelper;
var cellSelected = props.allowCellSelection && isSelected();
var isRowEditor = props.editMode === 'row';
var tabIndex = getTabIndex(cellSelected);
var selectionMode = getColumnProp('selectionMode');
var rowReorder = getColumnProp('rowReorder');
var rowEditor = getColumnProp('rowEditor');
var header = getColumnProp('header');
var body = getColumnProp('body');
var editor = getColumnProp('editor');
var frozen = getColumnProp('frozen');
var align = getColumnProp('align');
var value = resolveFieldData();
var columnBodyOptions = {
column: props.column,
field: field,
rowIndex: props.rowIndex,
frozenRow: props.frozenRow,
props: props.tableProps
};
var expander = ObjectUtils.getPropValue(getColumnProp('expander'), props.rowData, columnBodyOptions);
var cellClassName = ObjectUtils.getPropValue(props.cellClassName, value, columnBodyOptions);
var bodyClassName = ObjectUtils.getPropValue(getColumnProp('bodyClassName'), props.rowData, columnBodyOptions);
var className = classNames(bodyClassName, getColumnProp('className'), cellClassName, _defineProperty({
'p-selection-column': selectionMode !== null,
'p-editable-column': editor,
'p-cell-editing': editor && editingState,
'p-frozen-column': frozen,
'p-selectable-cell': props.allowCellSelection && props.isSelectable({
data: getCellParams(),
index: props.rowIndex
}),
'p-highlight': cellSelected
}, "p-align-".concat(align), !!align));
var style = getStyle();
var title = props.responsiveLayout === 'stack' && /*#__PURE__*/React__namespace.createElement("span", {
className: "p-column-title"
}, ObjectUtils.getJSXElement(header, {
props: props.tableProps
}));
if (selectionMode) {
var showSelection = props.showSelectionElement ? props.showSelectionElement(props.rowData, {
rowIndex: props.rowIndex,
props: props.tableProps
}) : true;
var label;
if (showSelection) {
var ariaLabelField = props.selectionAriaLabel || props.tableProps.dataKey;
var ariaLabelText = ObjectUtils.resolveFieldData(props.rowData, ariaLabelField);
label = "".concat(props.selected ? ariaLabel('unselectLabel') : ariaLabel('selectLabel'), " ").concat(ariaLabelText);
}
content = showSelection && /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, selectionMode === 'single' && /*#__PURE__*/React__namespace.createElement(RowRadioButton, {
checked: props.selected,
onChange: onRadioChange,
tabIndex: props.tabIndex,
tableSelector: props.tableSelector,
ariaLabel: label
}), selectionMode === 'multiple' && /*#__PURE__*/React__namespace.createElement(RowCheckbox, {
checked: props.selected,
onChange: onCheckboxChange,
tabIndex: props.tabIndex,
ariaLabel: label
}));
} else if (rowReorder) {
var showReorder = props.showRowReorderElement ? props.showRowReorderElement(props.rowData, {
rowIndex: props.rowIndex,
props: props.tableProps
}) : true;
content = showReorder && /*#__PURE__*/React__namespace.createElement("i", {
className: classNames('p-datatable-reorderablerow-handle', getColumnProp('rowReorderIcon'))
});
} else if (expander) {
var iconClassName = classNames('p-row-toggler-icon', props.expanded ? props.expandedRowIcon : props.collapsedRowIcon);
var ariaControls = "".concat(props.tableSelector, "_content_").concat(props.rowIndex, "_expanded");
var _ariaLabelField = props.selectionAriaLabel || props.tableProps.dataKey;
var _ariaLabelText = ObjectUtils.resolveFieldData(props.rowData, _ariaLabelField);
var _label = "".concat(props.expanded ? ariaLabel('collapseLabel') : ariaLabel('expandLabel'), " ").concat(_ariaLabelText);
var expanderProps = {
onClick: onRowToggle,
className: 'p-row-toggler p-link',
iconClassName: iconClassName
};
content = /*#__PURE__*/React__namespace.createElement("button", {
className: expanderProps.className,
onClick: expanderProps.onClick,
type: "button",
"aria-expanded": props.expanded,
"aria-controls": ariaControls,
tabIndex: props.tabIndex,
"aria-label": _label
}, /*#__PURE__*/React__namespace.createElement("span", {
className: expanderProps.iconClassName,
"aria-hidden": "true"
}), /*#__PURE__*/React__namespace.createElement(Ripple, null));
if (body) {
expanderProps['element'] = content;
content = ObjectUtils.getJSXElement(body, props.rowData, {
column: props.column,
field: field,
rowIndex: props.rowIndex,
frozenRow: props.frozenRow,
props: props.tableProps,
expander: expanderProps
});
}
} else if (isRowEditor && rowEditor) {
var rowEditorProps = {};
if (editingState) {
rowEditorProps = {
editing: true,
onSaveClick: onRowEditSave,
saveClassName: 'p-row-editor-save p-link',
saveIconClassName: 'p-row-editor-save-icon pi pi-fw pi-check',
onCancelClick: onRowEditCancel,
cancelClassName: 'p-row-editor-cancel p-link',
cancelIconClassName: 'p-row-editor-cancel-icon pi pi-fw pi-times'
};
content = /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement("button", {
type: "button",
name: "row-save",
onClick: rowEditorProps.onSaveClick,
className: rowEditorProps.saveClassName,
tabIndex: props.tabIndex
}, /*#__PURE__*/React__namespace.createElement("span", {
className: rowEditorProps.saveIconClassName
}), /*#__PURE__*/React__namespace.createElement(Ripple, null)), /*#__PURE__*/React__namespace.createElement("button", {
type: "button",
name: "row-cancel",
onClick: rowEditorProps.onCancelClick,
className: rowEditorProps.cancelClassName,
tabIndex: props.tabIndex
}, /*#__PURE__*/React__namespace.createElement("span", {
className: rowEditorProps.cancelIconClassName
}), /*#__PURE__*/React__namespace.createElement(Ripple, null)));
} else {
rowEditorProps = {
editing: false,
onInitClick: onRowEditInit,
initClassName: 'p-row-editor-init p-link',
initIconClassName: 'p-row-editor-init-icon pi pi-fw pi-pencil'
};
content = /*#__PURE__*/React__namespace.createElement("button", {
type: "button",
name: "row-edit",
onClick: rowEditorProps.onInitClick,
className: rowEditorProps.initClassName,
tabIndex: props.tabIndex
}, /*#__PURE__*/React__namespace.createElement("span", {
className: rowEditorProps.initIconClassName
}), /*#__PURE__*/React__namespace.createElement(Ripple, null));
}
if (body) {
rowEditorProps['element'] = content;
content = ObjectUtils.getJSXElement(body, props.rowData, {
column: props.column,
field: field,
rowIndex: props.rowIndex,
frozenRow: props.frozenRow,
props: props.tableProps,
rowEditor: rowEditorProps
});
}
} else if (body && (!editingState || !editor)) {
content = body ? ObjectUtils.getJSXElement(body, props.rowData, {
column: props.column,
field: field,
rowIndex: props.rowIndex,
frozenRow: props.frozenRow,
props: props.tableProps
}) : value;
} else if (editor && editingState) {
content = ObjectUtils.getJSXElement(editor, {
rowData: editingRowDataState,
value: resolveFieldData(editingRowDataState),
column: props.column,
field: field,
rowIndex: props.rowIndex,
frozenRow: props.frozenRow,
props: props.tableProps,
editorCallback: editorCallback
});
} else {
content = value;
}
content = typeof content == 'boolean' ? content.toString() : content;
if (!isRowEditor && editor) {
/* eslint-disable */
editorKeyHelper = /*#__PURE__*/React__namespace.createElement("a", {
tabIndex: "0",
ref: keyHelperRef,
className: "p-cell-editor-key-helper p-hidden-accessible",
onFocus: onEditorFocus
}, /*#__PURE__*/React__namespace.createElement("span", null));
/* eslint-enable */
}
return /*#__PURE__*/React__namespace.createElement("td", {
ref: elementRef,
style: style,
className: className,
rowSpan: props.rowSpan,
tabIndex: tabIndex,
role: "cell",
onClick: onClick,
onKeyDown: onKeyDown,
onBlur: onBlur,
onMouseDown: onMouseDown,
onMouseUp: onMouseUp
}, editorKeyHelper, title, content);
};
return getVirtualScrollerOption('loading') ? createLoading() : createElement();
});
BodyCell.displayName = 'BodyCell';
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; }
var BodyRow = /*#__PURE__*/React__namespace.memo(function (props) {
var _React$useState = React__namespace.useState(false),
_React$useState2 = _slicedToArray(_React$useState, 2),
editingState = _React$useState2[0],
setEditingState = _React$useState2[1];
var editing = props.onRowEditChange ? props.editing : editingState;
var getColumnProp = function getColumnProp(column, name) {
return ColumnBase.getCProp(column, name);
};
var isFocusable = function isFocusable() {
return props.selectionMode && props.selectionModeInColumn !== 'single' && props.selectionModeInColumn !== 'multiple';
};
var isGrouped = function isGrouped(column) {
var columnField = getColumnProp(column, 'field');
if (props.groupRowsBy && columnField) {
return Array.isArray(props.groupRowsBy) ? props.groupRowsBy.indexOf(columnField) > -1 : props.groupRowsBy === columnField;
}
return false;
};
var equals = function equals(data1, data2) {
return props.compareSelectionBy === 'equals' ? data1 === data2 : ObjectUtils.equals(data1, data2, props.dataKey);
};
var getTabIndex = function getTabIndex() {
return isFocusable() && !props.allowCellSelection ? props.rowIndex === 0 ? props.tabIndex : -1 : null;
};
var findIndex = function findIndex(collection, rowData) {
return (collection || []).findIndex(function (data) {
return equals(rowData, data);
});
};
var changeTabIndex = function changeTabIndex(currentRow, nextRow) {
if (currentRow && nextRow) {
currentRow.tabIndex = -1;
nextRow.tabIndex = props.tabIndex;
}
};
var findNextSelectableRow = function findNextSelectableRow(row) {
var nextRow = row.nextElementSibling;
return nextRow ? DomHandler.hasClass(nextRow, 'p-selectable-row') ? nextRow : findNextSelectableRow(nextRow) : null;
};
var findPrevSelectableRow = function findPrevSelectableRow(row) {
var prevRow = row.previousElementSibling;
return prevRow ? DomHandler.hasClass(prevRow, 'p-selectable-row') ? prevRow : findPrevSelectableRow(prevRow) : null;
};
var shouldRenderBodyCell = function shouldRenderBodyCell(value, column, i) {
if (getColumnProp(column, 'hidden')) {
return false;
} else if (props.rowGroupMode && props.rowGroupMode === 'rowspan' && isGrouped(column)) {
var prevRowData = value[i - 1];
if (prevRowData) {
var currentRowFieldData = ObjectUtils.resolveFieldData(value[i], getColumnProp(column, 'field'));
var previousRowFieldData = ObjectUtils.resolveFieldData(prevRowData, getColumnProp(column, 'field'));
return currentRowFieldData !== previousRowFieldData;
}
}
return true;
};
var calculateRowGroupSize = function calculateRowGroupSize(value, column, index) {
if (isGrouped(column)) {
var currentRowFieldData = ObjectUtils.resolveFieldData(value[index], getColumnProp(column, 'field'));
var nextRowFieldData = currentRowFieldData;
var groupRowSpan = 0;
while (currentRowFieldData === nextRowFieldData) {
groupRowSpan++;
var nextRowData = value[++index];
if (nextRowData) {
nextRowFieldData = ObjectUtils.resolveFieldData(nextRowData, getColumnProp(column, 'field'));
} else {
break;
}
}
return groupRowSpan === 1 ? null : groupRowSpan;
} else {
return null;
}
};
var onClick = function onClick(event) {
props.onRowClick({
originalEvent: event,
data: props.rowData,
index: props.rowIndex
});
};
var onDoubleClick = function onDoubleClick(event) {
props.onRowDoubleClick({
originalEvent: event,
data: props.rowData,
index: props.rowIndex
});
};
var onRightClick = function onRightClick(event) {
props.onRowRightClick({
originalEvent: event,
data: props.rowData,
index: props.rowIndex
});
};
var onMouseEnter = function onMouseEnter(event) {
props.onRowMouseEnter({
originalEvent: event,
data: props.rowData,
index: props.rowIndex
});
};
var onMouseLeave = function onMouseLeave(event) {
props.onRowMouseLeave({
originalEvent: event,
data: props.rowData,
index: props.rowIndex
});
};
var onTouchEnd = function onTouchEnd(event) {
props.onRowTouchEnd(event);
};
var onKeyDown = function onKeyDown(event) {
if (isFocusable() && !props.allowCellSelection) {
var target = event.target,
row = event.currentTarget;
switch (event.which) {
//down arrow
case 40:
var nextRow = findNextSelectableRow(row);
if (nextRow) {
changeTabIndex(row, nextRow);
nextRow.focus();
}
event.preventDefault();
break;
//up arrow
case 38:
var prevRow = findPrevSelectableRow(row);
if (prevRow) {
changeTabIndex(row, prevRow);
prevRow.focus();
}
event.preventDefault();
break;
//enter
case 13:
// @deprecated
if (!DomHandler.isClickable(target)) {
onClick(event);
event.preventDefault();
}
break;
//space
case 32:
if (!DomHandler.isClickable(target) && !target.readOnly) {
onClick(event);
event.preventDefault();
}
break;
}
}
};
var onMouseDown = function onMouseDown(event) {
props.onRowMouseDown({
originalEvent: event,
data: props.rowData,
index: props.rowIndex
});
};
var onMouseUp = function onMouseUp(event) {
props.onRowMouseUp({
originalEvent: event,
data: props.rowData,
index: props.rowIndex
});
};
var onDragStart = function onDragStart(event) {
props.onRowDragStart({
originalEvent: event,
data: props.rowData,
index: props.rowIndex
});
};
var onDragOver = function onDragOver(event) {
props.onRowDragOver({
originalEvent: event,
data: props.rowData,
index: props.rowIndex
});
};
var onDragLeave = function onDragLeave(event) {
props.onRowDragLeave({
originalEvent: event,
data: props.rowData,
index: props.rowIndex
});
};
var onDragEnd = function onDragEnd(event) {
props.onRowDragEnd({
originalEvent: event,
data: props.rowData,
index: props.rowIndex
});
};
var onDrop = function onDrop(event) {
props.onRowDrop({
originalEvent: event,
data: props.rowData,
index: props.rowIndex
});
};
var onEditChange = function onEditChange(e, isEditing) {
if (props.onRowEditChange) {
var editingRows;
var dataKey = props.dataKey;
var originalEvent = e.originalEvent,
data = e.data,
index = e.index,
newData = e.newData;
if (dataKey) {
var dataKeyValue = String(ObjectUtils.resolveFieldData(data, dataKey));
editingRows = props.editingRows ? _objectSpread$m({}, props.editingRows) : {};
if (!isEditing) {
delete editingRows[dataKeyValue];
// if the key value was changed, stop editing for the new key value too
var newDataKeyValue = String(ObjectUtils.resolveFieldData(newData, dataKey));
delete editingRows[newDataKeyValue];
} else {
editingRows[dataKeyValue] = true;
}
} else {
var editingRowIndex = findIndex(props.editingRows, data);
editingRows = props.editingRows ? _toConsumableArray(props.editingRows) : [];
if (editingRowIndex !== -1) editingRows = editingRows.filter(function (val, i) {
return i !== editingRowIndex;
});else editingRows.push(data);
}
props.onRowEditChange({
originalEvent: originalEvent,
data: editingRows,
index: index
});
} else {
setEditingState(isEditing);
}
};
var onEditInit = function onEditInit(e) {
var event = e.originalEvent;
if (props.onRowEditInit) {
props.onRowEditInit({
originalEvent: event,
data: props.rowData,
index: props.rowIndex
});
}
onEditChange(e, true);
event.preventDefault();
};
var onEditSave = function onEditSave(e) {
var event = e.originalEvent,
newData = e.newData;
var valid = props.rowEditValidator ? props.rowEditValidator(newData, {
props: props.tableProps
}) : true;
if (props.onRowEditSave) {
props.onRowEditSave({
originalEvent: event,
data: props.rowData,
index: props.rowIndex,
valid: valid
});
}
if (valid) {
if (props.onRowEditComplete) {
props.onRowEditComplete(e);
}
onEditChange(e, false);
}
event.preventDefault();
};
var onEditCancel = function onEditCancel(e) {
var event = e.originalEvent;
if (props.onRowEditCancel) {
props.onRowEditCancel({
originalEvent: event,
data: props.rowData,
index: props.rowIndex
});
}
onEditChange(e, false);
event.preventDefault();
};
var createContent = function createContent() {
return props.columns.map(function (col, i) {
if (shouldRenderBodyCell(props.value, col, props.index)) {
var key = "".concat(getColumnProp(col, 'columnKey') || getColumnProp(col, 'field'), "_").concat(i);
var rowSpan = props.rowGroupMode === 'rowspan' ? calculateRowGroupSize(props.value, col, props.index) : null;
return /*#__PURE__*/React__namespace.createElement(BodyCell, {
key: key,
value: props.value,
tableProps: props.tableProps,
tableSelector: props.tableSelector,
column: col,
rowData: props.rowData,
rowIndex: props.rowIndex,
index: i,
rowSpan: rowSpan,
dataKey: props.dataKey,
editing: editing,
editingMeta: props.editingMeta,
editMode: props.editMode,
onRowEditInit: onEditInit,
onRowEditSave: onEditSave,
onRowEditCancel: onEditCancel,
onEditingMetaChange: props.onEditingMetaChange,
onRowToggle: props.onRowToggle,
selection: props.selection,
selectionAriaLabel: props.tableProps.selectionAriaLabel,
allowCellSelection: props.allowCellSelection,
compareSelectionBy: props.compareSelectionBy,
selectOnEdit: props.selectOnEdit,
selected: props.selected,
onClick: props.onCellClick,
onMouseDown: props.onCellMouseDown,
onMouseUp: props.onCellMouseUp,
tabIndex: props.tabIndex,
cellClassName: props.cellClassName,
responsiveLayout: props.responsiveLayout,
frozenRow: props.frozenRow,
isSelectable: props.isSelectable,
showSelectionElement: props.showSelectionElement,
showRowReorderElement: props.showRowReorderElement,
onRadioChange: props.onRadioChange,
onCheckboxChange: props.onCheckboxChange,
expanded: props.expanded,
expandedRowIcon: props.expandedRowIcon,
collapsedRowIcon: props.collapsedRowIcon,
virtualScrollerOptions: props.virtualScrollerOptions
});
}
return null;
});
};
var rowClassName = ObjectUtils.getPropValue(props.rowClassName, props.rowData, {
props: props.tableProps
});
var className = classNames(rowClassName, {
'p-highlight': !props.allowCellSelection && props.selected || props.contextMenuSelected,
'p-highlight-contextmenu': props.contextMenuSelected,
'p-selectable-row': props.allowRowSelection && props.isSelectable({
data: props.rowData,
index: props.rowIndex
}),
'p-row-odd': props.rowIndex % 2 !== 0
});
var style = {
height: props.virtualScrollerOptions ? props.virtualScrollerOptions.itemSize : undefined
};
var content = createContent();
var tabIndex = getTabIndex();
return /*#__PURE__*/React__namespace.createElement("tr", {
role: "row",
tabIndex: tabIndex,
className: className,
style: style,
onMouseDown: onMouseDown,
onMouseUp: onMouseUp,
onMouseEnter: onMouseEnter,
onMouseLeave: onMouseLeave,
onClick: onClick,
onDoubleClick: onDoubleClick,
onContextMenu: onRightClick,
onTouchEnd: onTouchEnd,
onKeyDown: onKeyDown,
onDragStart: onDragStart,
onDragOver: onDragOver,
onDragLeave: onDragLeave,
onDragEnd: onDragEnd,
onDrop: onDrop
}, content);
});
BodyRow.displayName = 'BodyRow';
var RowTogglerButton = /*#__PURE__*/React__namespace.memo(function (props) {
var onClick = function onClick(event) {
props.onClick({
originalEvent: event,
data: props.rowData
});
};
var iconClassName = classNames('p-row-toggler-icon', props.expanded ? props.expandedRowIcon : props.collapsedRowIcon);
var label = props.expanded ? ariaLabel('collapseLabel') : ariaLabel('expandLabel');
return /*#__PURE__*/React__namespace.createElement("button", {
type: "button",
onClick: onClick,
className: "p-row-toggler p-link",
tabIndex: props.tabIndex,
"aria-label": label
}, /*#__PURE__*/React__namespace.createElement("span", {
className: iconClassName,
"aria-hidden": "true"
}), /*#__PURE__*/React__namespace.createElement(Ripple, null));
});
RowTogglerButton.displayName = 'RowTogglerButton';
var _excluded = ["originalEvent"];
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; }
var TableBody = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (props, ref) {
var _React$useState = React__namespace.useState({}),
_React$useState2 = _slicedToArray(_React$useState, 2),
rowGroupHeaderStyleObjectState = _React$useState2[0],
setRowGroupHeaderStyleObjectState = _React$useState2[1];
var elementRef = React__namespace.useRef(null);
var refCallback = React__namespace.useCallback(function (el) {
elementRef.current = el;
props.virtualScrollerContentRef && props.virtualScrollerContentRef(el);
}, [props]);
var dragSelectionHelper = React__namespace.useRef(null);
var initialDragPosition = React__namespace.useRef(null);
var anchorRowIndex = React__namespace.useRef(null);
var anchorCellIndex = React__namespace.useRef(null);
var rangeRowIndex = React__namespace.useRef(null);
var anchorRowFirst = React__namespace.useRef(null);
var rowTouched = React__namespace.useRef(false);
var rowDragging = React__namespace.useRef(false);
var draggedRowIndex = React__namespace.useRef(null);
var droppedRowIndex = React__namespace.useRef(null);
var isSubheaderGrouping = props.rowGroupMode && props.rowGroupMode === 'subheader';
var isRadioSelectionMode = props.selectionMode === 'radiobutton';
var isCheckboxSelectionMode = props.selectionMode === 'checkbox';
var isRadioSelectionModeInColumn = props.selectionModeInColumn === 'single';
var isCheckboxSelectionModeInColumn = props.selectionModeInColumn === 'multiple';
var equals = function equals(data1, data2) {
if (allowCellSelection()) return (data1.rowIndex === data2.rowIndex || data1.rowData === data2.rowData) && (data1.field === data2.field || data1.cellIndex === data2.cellIndex);else return props.compareSelectionBy === 'equals' ? data1 === data2 : ObjectUtils.equals(data1, data2, props.dataKey);
};
var isSelectionEnabled = function isSelectionEnabled() {
return props.selectionMode || props.selectionModeInColumn !== null || props.columns && props.columns.some(function (col) {
return col && !!getColumnProp(col, 'selectionMode');
});
};
var isSingleSelection = function isSingleSelection() {
return props.selectionMode === 'single' && !isCheckboxSelectionModeInColumn || !isRadioSelectionMode && isRadioSelectionModeInColumn;
};
var isMultipleSelection = function isMultipleSelection() {
return props.selectionMode === 'multiple' && !isRadioSelectionModeInColumn || isCheckboxSelectionModeInColumn;
};
var isRadioOnlySelection = function isRadioOnlySelection() {
return isRadioSelectionMode && isRadioSelectionModeInColumn;
};
var isCheckboxOnlySelection = function isCheckboxOnlySelection() {
return isCheckboxSelectionMode && isCheckboxSelectionModeInColumn;
};
var isSelected = function isSelected(rowData) {
if (rowData && props.selection) {
return props.selection instanceof Array ? findIndex(props.selection, rowData) > -1 : equals(rowData, props.selection);
}
return false;
};
var isContextMenuSelected = function isContextMenuSelected(rowData) {
if (rowData && props.contextMenuSelection) {
return equals(rowData, props.contextMenuSelection);
}
return false;
};
var isSelectable = function isSelectable(options) {
return props.isDataSelectable ? props.isDataSelectable(options) : true;
};
var isRowExpanded = function isRowExpanded(rowData) {
if (rowData && props.expandedRows) {
if (isSubheaderGrouping && props.expandableRowGroups) {
return isRowGroupExpanded(rowData);
} else {
if (props.dataKey) return props.expandedRows ? props.expandedRows[ObjectUtils.resolveFieldData(rowData, props.dataKey)] !== undefined : false;else return findIndex(props.expandedRows, rowData) !== -1;
}
}
return false;
};
var isRowGroupExpanded = function isRowGroupExpanded(rowData) {
if (props.dataKey === props.groupRowsBy) return Object.keys(props.expandedRows).some(function (data) {
return ObjectUtils.equals(data, ObjectUtils.resolveFieldData(rowData, props.dataKey));
});else return props.expandedRows.some(function (data) {
return ObjectUtils.equals(data, rowData, props.groupRowsBy);
});
};
var isRowEditing = function isRowEditing(rowData) {
if (props.editMode === 'row' && rowData && props.editingRows) {
if (props.dataKey) return props.editingRows ? props.editingRows[ObjectUtils.resolveFieldData(rowData, props.dataKey)] !== undefined : false;else return findIndex(props.editingRows, rowData) !== -1;
}
return false;
};
var allowDrag = function allowDrag(event) {
return props.dragSelection && isMultipleSelection() && !event.originalEvent.shiftKey;
};
var allowRowDrag = function allowRowDrag(event) {
return !allowCellSelection() && allowDrag(event) || props.reorderableRows;
};
var allowCellDrag = function allowCellDrag(event) {
return allowCellSelection() && allowDrag(event);
};
var allowSelection = function allowSelection(event) {
return !DomHandler.isClickable(event.originalEvent.target);
};
var allowMetaKeySelection = function allowMetaKeySelection(event) {
return !rowTouched.current && (!props.metaKeySelection || props.metaKeySelection && (event.originalEvent.metaKey || event.originalEvent.ctrlKey));
};
var allowRangeSelection = function allowRangeSelection(event) {
return isMultipleSelection() && event.originalEvent.shiftKey && anchorRowIndex.current !== null;
};
var allowRowSelection = function allowRowSelection() {
return (props.selectionMode || props.selectionModeInColumn) && !isRadioOnlySelection() && !isCheckboxOnlySelection();
};
var allowCellSelection = function allowCellSelection() {
return props.cellSelection && !isRadioSelectionModeInColumn && !isCheckboxSelectionModeInColumn;
};
var getColumnsLength = function getColumnsLength() {
return props.columns ? props.columns.length : 0;
};
var getColumnProp = function getColumnProp(column, name) {
return ColumnBase.getCProp(column, name);
};
var getVirtualScrollerOption = function getVirtualScrollerOption(option, options) {
options = options || props.virtualScrollerOptions;
return options ? options[option] : null;
};
var findIndex = function findIndex(collection, rowData) {
return (collection || []).findIndex(function (data) {
return equals(rowData, data);
});
};
var rowGroupHeaderStyle = function rowGroupHeaderStyle() {
if (props.scrollable) {
return {
top: rowGroupHeaderStyleObjectState['top']
};
}
return null;
};
var getRowKey = function getRowKey(rowData, index) {
return props.dataKey ? ObjectUtils.resolveFieldData(rowData, props.dataKey) : index;
};
var shouldRenderRowGroupHeader = function shouldRenderRowGroupHeader(value, rowData, i) {
var currentRowFieldData = ObjectUtils.resolveFieldData(rowData, props.groupRowsBy);
var prevRowData = value[i - 1];
if (prevRowData) {
var previousRowFieldData = ObjectUtils.resolveFieldData(prevRowData, props.groupRowsBy);
return currentRowFieldData !== previousRowFieldData;
} else {
return true;
}
};
var shouldRenderRowGroupFooter = function shouldRenderRowGroupFooter(value, rowData, i, expanded) {
if (props.expandableRowGroups && !expanded) {
return false;
} else {
var currentRowFieldData = ObjectUtils.resolveFieldData(rowData, props.groupRowsBy);
var nextRowData = value[i + 1];
if (nextRowData) {
var nextRowFieldData = ObjectUtils.resolveFieldData(nextRowData, props.groupRowsBy);
return currentRowFieldData !== nextRowFieldData;
} else {
return true;
}
}
};
var updateFrozenRowStickyPosition = function updateFrozenRowStickyPosition() {
elementRef.current.style.top = DomHandler.getOuterHeight(elementRef.current.previousElementSibling) + 'px';
};
var updateFrozenRowGroupHeaderStickyPosition = function updateFrozenRowGroupHeaderStickyPosition() {
var tableHeaderHeight = DomHandler.getOuterHeight(elementRef.current.previousElementSibling);
var top = tableHeaderHeight + 'px';
if (rowGroupHeaderStyleObjectState.top !== top) {
setRowGroupHeaderStyleObjectState({
top: top
});
}
};
var onSingleSelection = function onSingleSelection(_ref) {
var originalEvent = _ref.originalEvent,
data = _ref.data,
index = _ref.index,
toggleable = _ref.toggleable,
type = _ref.type;
if (!isSelectable({
data: data,
index: index
})) {
return;
}
var selected = isSelected(data);
var selection = props.selection;
if (selected) {
if (toggleable) {
selection = null;
onUnselect({
originalEvent: originalEvent,
data: data,
type: type
});
}
} else {
selection = data;
onSelect({
originalEvent: originalEvent,
data: data,
type: type
});
}
focusOnElement(originalEvent, true);
if (props.onSelectionChange && selection !== props.selection) {
props.onSelectionChange({
originalEvent: originalEvent,
value: selection,
type: type
});
}
};
var onMultipleSelection = function onMultipleSelection(_ref2) {
var originalEvent = _ref2.originalEvent,
data = _ref2.data,
index = _ref2.index,
toggleable = _ref2.toggleable,
type = _ref2.type;
if (!isSelectable({
data: data,
index: index
})) {
return;
}
var selected = isSelected(data);
var selection = props.selection || [];
if (selected) {
if (toggleable) {
var selectionIndex = findIndex(selection, data);
selection = props.selection.filter(function (val, i) {
return i !== selectionIndex;
});
onUnselect({
originalEvent: originalEvent,
data: data,
type: type
});
} else if (selection.length) {
props.selection.forEach(function (d) {
return onUnselect({
originalEvent: originalEvent,
data: d,
type: type
});
});
selection = [data];
onSelect({
originalEvent: originalEvent,
data: data,
type: type
});
}
} else {
selection = toggleable && isMultipleSelection() ? [].concat(_toConsumableArray(selection), [data]) : [data];
onSelect({
originalEvent: originalEvent,
data: data,
type: type
});
}
focusOnElement(originalEvent, true);
if (props.onSelectionChange && selection !== props.selection) {
props.onSelectionChange({
originalEvent: originalEvent,
value: selection,
type: type
});
}
};
var onRangeSelection = function onRangeSelection(event, type) {
DomHandler.clearSelection();
rangeRowIndex.current = allowCellSelection() ? event.rowIndex : event.index;
var selection = selectRange(event);
if (props.onSelectionChange && selection !== props.selection) {
props.onSelectionChange({
originalEvent: event.originalEvent,
value: selection,
type: type
});
}
anchorRowIndex.current = rangeRowIndex.current;
anchorCellIndex.current = event.cellIndex;
focusOnElement(event.originalEvent, false);
};
var selectRange = function selectRange(event) {
var rangeStart, rangeEnd;
if (rangeRowIndex.current > anchorRowIndex.current) {
rangeStart = anchorRowIndex.current;
rangeEnd = rangeRowIndex.current;
} else if (rangeRowIndex.current < anchorRowIndex.current) {
rangeStart = rangeRowIndex.current;
rangeEnd = anchorRowIndex.current;
} else {
rangeStart = rangeEnd = rangeRowIndex.current;
}
if (props.paginator) {
rangeStart = Math.max(rangeStart - props.first, 0);
rangeEnd -= props.first;
}
return allowCellSelection() ? selectRangeOnCell(event, rangeStart, rangeEnd) : selectRangeOnRow(event, rangeStart, rangeEnd);
};
var selectRangeOnRow = function selectRangeOnRow(event, rowRangeStart, rowRangeEnd) {
var value = props.value;
var selection = [];
for (var i = rowRangeStart; i <= rowRangeEnd; i++) {
var rangeRowData = value[i];
if (!isSelectable({
data: rangeRowData,
index: i
})) {
continue;
}
selection.push(rangeRowData);
onSelect({
originalEvent: event.originalEvent,
data: rangeRowData,
type: 'row'
});
}
return selection;
};
var selectRangeOnCell = function selectRangeOnCell(event, rowRangeStart, rowRangeEnd) {
var cellRangeStart,
cellRangeEnd,
cellIndex = event.cellIndex;
if (cellIndex > anchorCellIndex.current) {
cellRangeStart = anchorCellIndex.current;
cellRangeEnd = cellIndex;
} else if (cellIndex < anchorCellIndex.current) {
cellRangeStart = cellIndex;
cellRangeEnd = anchorCellIndex.current;
} else {
cellRangeStart = cellRangeEnd = cellIndex;
}
var value = props.value;
var selection = [];
for (var i = rowRangeStart; i <= rowRangeEnd; i++) {
var rowData = value[i];
var columns = props.columns;
var rowIndex = props.paginator ? i + props.first : i;
for (var j = cellRangeStart; j <= cellRangeEnd; j++) {
var field = getColumnProp(columns[j], 'field');
var _value = ObjectUtils.resolveFieldData(rowData, field);
var rangeRowData = {
value: _value,
field: field,
rowData: rowData,
rowIndex: rowIndex,
cellIndex: j,
selected: true
};
if (!isSelectable({
data: rangeRowData,
index: i
})) {
continue;
}
selection.push(rangeRowData);
onSelect({
originalEvent: event.originalEvent,
data: rangeRowData,
type: 'cell'
});
}
}
return selection;
};
var onSelect = function onSelect(event) {
if (allowCellSelection()) props.onCellSelect && props.onCellSelect(_objectSpread$l(_objectSpread$l({
originalEvent: event.originalEvent
}, event.data), {}, {
type: event.type
}));else props.onRowSelect && props.onRowSelect(event);
};
var onUnselect = function onUnselect(event) {
if (allowCellSelection()) props.onCellUnselect && props.onCellUnselect(_objectSpread$l(_objectSpread$l({
originalEvent: event.originalEvent
}, event.data), {}, {
type: event.type
}));else props.onRowUnselect && props.onRowUnselect(event);
};
var enableDragSelection = function enableDragSelection(event) {
if (props.dragSelection && !dragSelectionHelper.current) {
dragSelectionHelper.current = document.createElement('div');
DomHandler.addClass(dragSelectionHelper.current, 'p-datatable-drag-selection-helper');
initialDragPosition.current = {
x: event.clientX,
y: event.clientY
};
dragSelectionHelper.current.style.top = "".concat(event.pageY, "px");
dragSelectionHelper.current.style.left = "".concat(event.pageX, "px");
bindDragSelectionEvents();
}
};
var focusOnElement = function focusOnElement(event, isFocused) {
var target = event.currentTarget;
if (!allowCellSelection() && props.selectionAutoFocus) {
if (isCheckboxSelectionModeInColumn) {
var checkbox = DomHandler.findSingle(target, 'td.p-selection-column .p-checkbox-box');
checkbox && checkbox.focus();
} else if (isRadioSelectionModeInColumn) {
var radio = DomHandler.findSingle(target, 'td.p-selection-column input[type="radio"]');
radio && radio.focus();
}
}
!isFocused && target && target.focus();
};
var changeTabIndex = 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(elementRef.current, "".concat(selector, "[tabindex=\"").concat(props.tabIndex, "\"]"));
if (tabbableEl && target) {
tabbableEl.tabIndex = -1;
target.tabIndex = props.tabIndex;
}
}
};
var onRowClick = function onRowClick(event) {
if (allowCellSelection() || !allowSelection(event)) {
return;
}
props.onRowClick && props.onRowClick(event);
if (allowRowSelection()) {
if (allowRangeSelection(event)) {
onRangeSelection(event, 'row');
} else {
var toggleable = isRadioSelectionModeInColumn || isCheckboxSelectionModeInColumn || allowMetaKeySelection(event);
anchorRowIndex.current = event.index;
rangeRowIndex.current = event.index;
anchorRowFirst.current = props.first;
if (isSingleSelection()) {
onSingleSelection(_objectSpread$l(_objectSpread$l({}, event), {}, {
toggleable: toggleable,
type: 'row'
}));
} else {
onMultipleSelection(_objectSpread$l(_objectSpread$l({}, event), {}, {
toggleable: toggleable,
type: 'row'
}));
}
}
changeTabIndex(event.originalEvent, 'row');
} else {
focusOnElement(event.originalEvent);
}
rowTouched.current = false;
};
var onRowDoubleClick = function onRowDoubleClick(e) {
var event = e.originalEvent;
if (DomHandler.isClickable(event.target)) {
return;
}
if (props.onRowDoubleClick) {
props.onRowDoubleClick(e);
}
};
var onRowRightClick = function onRowRightClick(event) {
if (props.onContextMenu || props.onContextMenuSelectionChange) {
DomHandler.clearSelection();
if (props.onContextMenuSelectionChange) {
props.onContextMenuSelectionChange({
originalEvent: event.originalEvent,
value: event.data
});
}
if (props.onContextMenu) {
props.onContextMenu({
originalEvent: event.originalEvent,
data: event.data
});
}
event.originalEvent.preventDefault();
}
};
var onRowMouseEnter = function onRowMouseEnter(event) {
props.onRowMouseEnter && props.onRowMouseEnter(event);
};
var onRowMouseLeave = function onRowMouseLeave(event) {
props.onRowMouseLeave && props.onRowMouseLeave(event);
};
var onRowTouchEnd = function onRowTouchEnd() {
rowTouched.current = true;
};
var onRowMouseDown = function onRowMouseDown(e) {
var event = e.originalEvent;
if (DomHandler.hasClass(event.target, 'p-datatable-reorderablerow-handle')) event.currentTarget.draggable = true;else event.currentTarget.draggable = false;
if (allowRowDrag(e)) {
enableDragSelection(event);
anchorRowIndex.current = e.index;
rangeRowIndex.current = e.index;
anchorRowFirst.current = props.first;
}
};
var onRowMouseUp = function onRowMouseUp(event) {
var isSameRow = event.index === anchorRowIndex.current;
if (allowRowDrag(event) && !isSameRow) {
onRangeSelection(event, 'row');
}
};
var onRowToggle = function onRowToggle(event) {
var expandedRows;
var dataKey = props.dataKey;
var hasDataKey = props.groupRowsBy ? dataKey === props.groupRowsBy : !!dataKey;
if (hasDataKey) {
var dataKeyValue = String(ObjectUtils.resolveFieldData(event.data, dataKey));
expandedRows = props.expandedRows ? _objectSpread$l({}, props.expandedRows) : {};
if (expandedRows[dataKeyValue] != null) {
delete expandedRows[dataKeyValue];
if (props.onRowCollapse) {
props.onRowCollapse({
originalEvent: event,
data: event.data
});
}
} else {
expandedRows[dataKeyValue] = true;
if (props.onRowExpand) {
props.onRowExpand({
originalEvent: event,
data: event.data
});
}
}
} else {
var expandedRowIndex = findIndex(props.expandedRows, event.data);
expandedRows = props.expandedRows ? _toConsumableArray(props.expandedRows) : [];
if (expandedRowIndex !== -1) {
expandedRows = expandedRows.filter(function (_, i) {
return i !== expandedRowIndex;
});
if (props.onRowCollapse) {
props.onRowCollapse({
originalEvent: event,
data: event.data
});
}
} else {
expandedRows.push(event.data);
if (props.onRowExpand) {
props.onRowExpand({
originalEvent: event,
data: event.data
});
}
}
}
if (props.onRowToggle) {
props.onRowToggle({
data: expandedRows
});
}
};
var onRowDragStart = function onRowDragStart(e) {
var event = e.originalEvent,
index = e.index;
if (allowRowDrag(event)) {
rowDragging.current = true;
draggedRowIndex.current = index;
event.dataTransfer.setData('text', 'b'); // For firefox
}
};
var onRowDragOver = function onRowDragOver(e) {
var event = e.originalEvent,
index = e.index;
if (rowDragging.current && draggedRowIndex.current !== index) {
var rowElement = event.currentTarget;
var rowY = DomHandler.getOffset(rowElement).top + DomHandler.getWindowScrollTop();
var pageY = event.pageY + window.scrollY;
var rowMidY = rowY + DomHandler.getOuterHeight(rowElement) / 2;
var prevRowElement = rowElement.previousElementSibling;
if (pageY < rowMidY) {
DomHandler.removeClass(rowElement, 'p-datatable-dragpoint-bottom');
droppedRowIndex.current = 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');
droppedRowIndex.current = index + 1;
DomHandler.addClass(rowElement, 'p-datatable-dragpoint-bottom');
}
}
event.preventDefault();
};
var onRowDragLeave = 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');
};
var onRowDragEnd = function onRowDragEnd(e) {
var event = e.originalEvent;
rowDragging.current = false;
draggedRowIndex.current = null;
droppedRowIndex.current = null;
event.currentTarget.draggable = false;
};
var onRowDrop = function onRowDrop(e) {
var event = e.originalEvent;
if (droppedRowIndex.current != null) {
var dropIndex = draggedRowIndex.current > droppedRowIndex.current ? droppedRowIndex.current : droppedRowIndex.current === 0 ? 0 : droppedRowIndex.current - 1;
var val = _toConsumableArray(props.tableProps.value);
ObjectUtils.reorderArray(val, draggedRowIndex.current, dropIndex);
if (props.onRowReorder) {
props.onRowReorder({
originalEvent: event,
value: val,
dragIndex: draggedRowIndex.current,
dropIndex: dropIndex
});
}
}
//cleanup
onRowDragLeave(e);
onRowDragEnd(e);
event.preventDefault();
};
var onRadioChange = function onRadioChange(event) {
onSingleSelection(_objectSpread$l(_objectSpread$l({}, event), {}, {
toggleable: true,
type: 'radio'
}));
};
var onCheckboxChange = function onCheckboxChange(event) {
onMultipleSelection(_objectSpread$l(_objectSpread$l({}, event), {}, {
toggleable: true,
type: 'checkbox'
}));
};
var onDragSelectionMouseMove = function onDragSelectionMouseMove(event) {
var _initialDragPosition$ = initialDragPosition.current,
x = _initialDragPosition$.x,
y = _initialDragPosition$.y;
var dx = event.clientX - x;
var dy = event.clientY - y;
if (dy < 0) dragSelectionHelper.current.style.top = "".concat(event.pageY + 5, "px");
if (dx < 0) dragSelectionHelper.current.style.left = "".concat(event.pageX + 5, "px");
dragSelectionHelper.current.style.height = "".concat(Math.abs(dy), "px");
dragSelectionHelper.current.style.width = "".concat(Math.abs(dx), "px");
event.preventDefault();
};
var onDragSelectionMouseUp = function onDragSelectionMouseUp() {
if (dragSelectionHelper.current) {
dragSelectionHelper.current.remove();
dragSelectionHelper.current = null;
}
document.removeEventListener('mousemove', onDragSelectionMouseMove);
document.removeEventListener('mouseup', onDragSelectionMouseUp);
};
var onCellClick = function onCellClick(event) {
if (!allowSelection(event)) {
return;
}
props.onCellClick && props.onCellClick(event);
if (allowCellSelection()) {
if (allowRangeSelection(event)) {
onRangeSelection(event, 'cell');
} else {
var toggleable = allowMetaKeySelection(event);
var originalEvent = event.originalEvent,
data = _objectWithoutProperties(event, _excluded);
anchorRowIndex.current = event.rowIndex;
rangeRowIndex.current = event.rowIndex;
anchorRowFirst.current = props.first;
anchorCellIndex.current = event.cellIndex;
if (isSingleSelection()) {
onSingleSelection({
originalEvent: originalEvent,
data: data,
index: event.rowIndex,
toggleable: toggleable,
type: 'cell'
});
} else {
onMultipleSelection({
originalEvent: originalEvent,
data: data,
index: event.rowIndex,
toggleable: toggleable,
type: 'cell'
});
}
}
changeTabIndex(event.originalEvent, 'cell');
}
rowTouched.current = false;
};
var onCellMouseDown = function onCellMouseDown(event) {
if (allowCellDrag(event)) {
enableDragSelection(event.originalEvent);
anchorRowIndex.current = event.rowIndex;
rangeRowIndex.current = event.rowIndex;
anchorRowFirst.current = props.first;
anchorCellIndex.current = event.cellIndex;
}
};
var onCellMouseUp = function onCellMouseUp(event) {
var isSameCell = event.rowIndex === anchorRowIndex.current && event.cellIndex === anchorCellIndex.current;
if (allowCellDrag(event) && !isSameCell) {
onRangeSelection(event, 'cell');
}
};
var bindDragSelectionEvents = function bindDragSelectionEvents() {
document.addEventListener('mousemove', onDragSelectionMouseMove);
document.addEventListener('mouseup', onDragSelectionMouseUp);
document.body.appendChild(dragSelectionHelper.current);
};
var unbindDragSelectionEvents = function unbindDragSelectionEvents() {
onDragSelectionMouseUp();
};
React__namespace.useEffect(function () {
if (props.frozenRow) {
updateFrozenRowStickyPosition();
}
if (props.scrollable && props.rowGroupMode === 'subheader') {
updateFrozenRowGroupHeaderStickyPosition();
}
});
useUpdateEffect(function () {
if (props.paginator && isMultipleSelection()) {
anchorRowIndex.current = null;
}
}, [props.first]);
useUnmountEffect(function () {
if (props.dragSelection) {
unbindDragSelectionEvents();
}
});
var createEmptyContent = function createEmptyContent() {
if (!props.loading) {
var colSpan = getColumnsLength();
var _content = ObjectUtils.getJSXElement(props.emptyMessage, {
props: props.tableProps,
frozen: props.frozenRow
}) || localeOption('emptyMessage');
return /*#__PURE__*/React__namespace.createElement("tr", {
className: "p-datatable-emptymessage",
role: "row"
}, /*#__PURE__*/React__namespace.createElement("td", {
colSpan: colSpan,
role: "cell"
}, _content));
}
return null;
};
var createGroupHeader = function createGroupHeader(rowData, rowIndex, expanded, colSpan) {
if (isSubheaderGrouping && shouldRenderRowGroupHeader(props.value, rowData, rowIndex - props.first)) {
var style = rowGroupHeaderStyle();
var toggler = props.expandableRowGroups && /*#__PURE__*/React__namespace.createElement(RowTogglerButton, {
onClick: onRowToggle,
rowData: rowData,
expanded: expanded,
expandedRowIcon: props.expandedRowIcon,
collapsedRowIcon: props.collapsedRowIcon
});
var options = {
index: rowIndex,
props: props.tableProps,
customRendering: false
};
var _content2 = ObjectUtils.getJSXElement(props.rowGroupHeaderTemplate, rowData, options);
// check if the user wants complete control of the rendering
if (!options.customRendering) {
_content2 = /*#__PURE__*/React__namespace.createElement("td", {
colSpan: colSpan
}, toggler, /*#__PURE__*/React__namespace.createElement("span", {
className: "p-rowgroup-header-name"
}, _content2));
}
return /*#__PURE__*/React__namespace.createElement("tr", {
className: "p-rowgroup-header",
style: style,
role: "row"
}, _content2);
}
return null;
};
var createRow = function createRow(rowData, rowIndex, index, expanded) {
if (!props.expandableRowGroups || expanded) {
var selected = isSelectionEnabled() ? isSelected(rowData) : false;
var contextMenuSelected = isContextMenuSelected(rowData);
var _allowRowSelection = allowRowSelection();
var _allowCellSelection = allowCellSelection();
var editing = isRowEditing(rowData);
return /*#__PURE__*/React__namespace.createElement(BodyRow, {
tableProps: props.tableProps,
tableSelector: props.tableSelector,
value: props.value,
columns: props.columns,
rowData: rowData,
rowIndex: rowIndex,
index: index,
selected: selected,
contextMenuSelected: contextMenuSelected,
onRowClick: onRowClick,
onRowDoubleClick: onRowDoubleClick,
onRowRightClick: onRowRightClick,
onRowMouseEnter: onRowMouseEnter,
onRowMouseLeave: onRowMouseLeave,
tabIndex: props.tabIndex,
isSelectable: isSelectable,
onRowTouchEnd: onRowTouchEnd,
onRowMouseDown: onRowMouseDown,
onRowMouseUp: onRowMouseUp,
onRowToggle: onRowToggle,
onRowDragStart: onRowDragStart,
onRowDragOver: onRowDragOver,
onRowDragLeave: onRowDragLeave,
onRowDragEnd: onRowDragEnd,
onRowDrop: onRowDrop,
onRadioChange: onRadioChange,
onCheckboxChange: onCheckboxChange,
onCellClick: onCellClick,
onCellMouseDown: onCellMouseDown,
onCellMouseUp: onCellMouseUp,
editing: editing,
editingRows: props.editingRows,
editingMeta: props.editingMeta,
editMode: props.editMode,
onRowEditChange: props.onRowEditChange,
onEditingMetaChange: props.onEditingMetaChange,
groupRowsBy: props.groupRowsBy,
compareSelectionBy: props.compareSelectionBy,
dataKey: props.dataKey,
rowGroupMode: props.rowGroupMode,
onRowEditInit: props.onRowEditInit,
rowEditValidator: props.rowEditValidator,
onRowEditSave: props.onRowEditSave,
onRowEditComplete: props.onRowEditComplete,
onRowEditCancel: props.onRowEditCancel,
selection: props.selection,
allowRowSelection: _allowRowSelection,
allowCellSelection: _allowCellSelection,
selectOnEdit: props.selectOnEdit,
selectionMode: props.selectionMode,
selectionModeInColumn: props.selectionModeInColumn,
cellClassName: props.cellClassName,
responsiveLayout: props.responsiveLayout,
frozenRow: props.frozenRow,
showSelectionElement: props.showSelectionElement,
showRowReorderElement: props.showRowReorderElement,
expanded: expanded,
expandedRowIcon: props.expandedRowIcon,
collapsedRowIcon: props.collapsedRowIcon,
rowClassName: props.rowClassName,
virtualScrollerOptions: props.virtualScrollerOptions
});
}
};
var createExpansion = function createExpansion(rowData, rowIndex, expanded, colSpan) {
if (expanded && !(isSubheaderGrouping && props.expandableRowGroups)) {
var id = "".concat(props.tableSelector, "_content_").concat(rowIndex, "_expanded");
var options = {
index: rowIndex,
customRendering: false
};
var _content3 = ObjectUtils.getJSXElement(props.rowExpansionTemplate, rowData, options);
// check if the user wants complete control of the rendering
if (!options.customRendering) {
_content3 = /*#__PURE__*/React__namespace.createElement("td", {
role: "cell",
colSpan: colSpan
}, _content3);
}
return /*#__PURE__*/React__namespace.createElement("tr", {
id: id,
className: "p-datatable-row-expansion",
role: "row"
}, _content3);
}
return null;
};
var createGroupFooter = function createGroupFooter(rowData, rowIndex, expanded, colSpan) {
if (isSubheaderGrouping && shouldRenderRowGroupFooter(props.value, rowData, rowIndex - props.first, expanded)) {
var _content4 = ObjectUtils.getJSXElement(props.rowGroupFooterTemplate, rowData, {
index: rowIndex,
colSpan: colSpan,
props: props.tableProps
});
return /*#__PURE__*/React__namespace.createElement("tr", {
className: "p-rowgroup-footer",
role: "row"
}, _content4);
}
return null;
};
var createContent = function createContent() {
return props.value && props.value.map(function (rowData, index) {
var rowIndex = getVirtualScrollerOption('getItemOptions') ? getVirtualScrollerOption('getItemOptions')(index).index : props.first + index;
var key = getRowKey(rowData, rowIndex);
var expanded = isRowExpanded(rowData);
var colSpan = getColumnsLength();
var groupHeader = createGroupHeader(rowData, rowIndex, expanded, colSpan);
var row = createRow(rowData, rowIndex, index, expanded);
var expansion = createExpansion(rowData, rowIndex, expanded, colSpan);
var groupFooter = createGroupFooter(rowData, rowIndex, expanded, colSpan);
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, {
key: key
}, groupHeader, row, expansion, groupFooter);
});
};
var content = props.empty ? createEmptyContent() : createContent();
return /*#__PURE__*/React__namespace.createElement("tbody", {
ref: refCallback,
style: props.style,
className: props.className
}, content);
}));
TableBody.displayName = 'TableBody';
var ColumnGroupBase = {
defaultProps: {
__TYPE: 'ColumnGroup',
children: undefined
},
getCProp: function getCProp(group, name) {
return ObjectUtils.getComponentProp(group, name, ColumnGroupBase.defaultProps);
},
getCProps: function getCProps(group) {
return ObjectUtils.getComponentProps(group, ColumnGroupBase.defaultProps);
}
};
var RowBase = {
defaultProps: {
__TYPE: 'Row',
style: null,
className: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, RowBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, RowBase.defaultProps);
},
getCProp: function getCProp(row, name) {
return ObjectUtils.getComponentProp(row, name, RowBase.defaultProps);
}
};
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; }
var FooterCell = /*#__PURE__*/React__namespace.memo(function (props) {
var _React$useState = React__namespace.useState({}),
_React$useState2 = _slicedToArray(_React$useState, 2),
styleObjectState = _React$useState2[0],
setStyleObjectState = _React$useState2[1];
var elementRef = React__namespace.useRef(null);
var getColumnProp = function getColumnProp(name) {
return ColumnBase.getCProp(props.column, name);
};
var getStyle = function getStyle() {
var footerStyle = getColumnProp('footerStyle');
var columnStyle = getColumnProp('style');
return getColumnProp('frozen') ? Object.assign({}, columnStyle, footerStyle, styleObjectState) : Object.assign({}, columnStyle, footerStyle);
};
var updateStickyPosition = function updateStickyPosition() {
if (getColumnProp('frozen')) {
var styleObject = _objectSpread$k({}, styleObjectState);
var _align = getColumnProp('alignFrozen');
if (_align === 'right') {
var right = 0;
var next = elementRef.current.nextElementSibling;
if (next) {
right = DomHandler.getOuterWidth(next) + parseFloat(next.style.right || 0);
}
styleObject['right'] = right + 'px';
} else {
var left = 0;
var prev = elementRef.current.previousElementSibling;
if (prev) {
left = DomHandler.getOuterWidth(prev) + parseFloat(prev.style.left || 0);
}
styleObject['left'] = left + 'px';
}
var isSameStyle = styleObjectState['left'] === styleObject['left'] && styleObjectState['right'] === styleObject['right'];
!isSameStyle && setStyleObjectState(styleObject);
}
};
React__namespace.useEffect(function () {
if (getColumnProp('frozen')) {
updateStickyPosition();
}
});
var style = getStyle();
var align = getColumnProp('align');
var colSpan = getColumnProp('colSpan');
var rowSpan = getColumnProp('rowSpan');
var className = classNames(getColumnProp('footerClassName'), getColumnProp('className'), _defineProperty({
'p-frozen-column': getColumnProp('frozen')
}, "p-align-".concat(align), !!align));
var content = ObjectUtils.getJSXElement(getColumnProp('footer'), {
props: props.tableProps
});
return /*#__PURE__*/React__namespace.createElement("td", {
ref: elementRef,
style: style,
className: className,
role: "cell",
colSpan: colSpan,
rowSpan: rowSpan
}, content);
});
FooterCell.displayName = 'FooterCell';
var TableFooter = /*#__PURE__*/React__namespace.memo(function (props) {
var hasFooter = function hasFooter() {
return props.footerColumnGroup ? true : props.columns ? props.columns.some(function (col) {
return col && getColumnProp(col, 'footer');
}) : false;
};
var getColumnProp = function getColumnProp(column, name) {
return ColumnBase.getCProp(column, name);
};
var createGroupFooterCells = function createGroupFooterCells(row) {
var columns = React__namespace.Children.toArray(RowBase.getCProp(row, 'children'));
return createFooterCells(columns);
};
var createFooterCells = function createFooterCells(columns) {
return React__namespace.Children.map(columns, function (col, i) {
var isVisible = col ? !getColumnProp(col, 'hidden') : true;
var key = col ? getColumnProp(col, 'columnKey') || getColumnProp(col, 'field') || i : i;
return isVisible && /*#__PURE__*/React__namespace.createElement(FooterCell, {
key: key,
tableProps: props.tableProps,
column: col
});
});
};
var createContent = function createContent() {
if (props.footerColumnGroup) {
var rows = React__namespace.Children.toArray(ColumnGroupBase.getCProp(props.footerColumnGroup, 'children'));
return rows.map(function (row, i) {
return /*#__PURE__*/React__namespace.createElement("tr", {
key: i,
role: "row"
}, createGroupFooterCells(row));
});
}
return /*#__PURE__*/React__namespace.createElement("tr", {
role: "row"
}, createFooterCells(props.columns));
};
if (hasFooter()) {
var content = createContent();
return /*#__PURE__*/React__namespace.createElement("tfoot", {
className: "p-datatable-tfoot"
}, content);
}
return null;
});
TableFooter.displayName = 'TableFooter';
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; }
var ColumnFilter = /*#__PURE__*/React__namespace.memo(function (props) {
var _React$useState = React__namespace.useState(false),
_React$useState2 = _slicedToArray(_React$useState, 2),
overlayVisibleState = _React$useState2[0],
setOverlayVisibleState = _React$useState2[1];
var overlayRef = React__namespace.useRef(null);
var iconRef = React__namespace.useRef(null);
var selfClick = React__namespace.useRef(false);
var overlayEventListener = React__namespace.useRef(null);
var getColumnProp = function getColumnProp(name) {
return ColumnBase.getCProp(props.column, name);
};
var field = getColumnProp('filterField') || getColumnProp('field');
var filterModel = props.filters[field];
var filterStoreModel = props.filtersStore && props.filtersStore[field];
var _useOverlayListener = useOverlayListener({
target: iconRef,
overlay: overlayRef,
listener: function listener(event, _ref) {
var type = _ref.type,
valid = _ref.valid;
if (valid) {
type === 'outside' ? !selfClick.current && !isTargetClicked(event.target) && hide() : hide();
}
selfClick.current = false;
},
when: overlayVisibleState
}),
_useOverlayListener2 = _slicedToArray(_useOverlayListener, 2),
bindOverlayListener = _useOverlayListener2[0],
unbindOverlayListener = _useOverlayListener2[1];
var hasFilter = function hasFilter() {
if (!filterStoreModel || !filterModel) return false;
return filterStoreModel.operator ? !isFilterBlank(filterModel.constraints[0].value) : !isFilterBlank(filterModel.value);
};
var hasRowFilter = function hasRowFilter() {
return filterModel && !isFilterBlank(filterModel.value);
};
var isFilterBlank = function isFilterBlank(filter) {
return ObjectUtils.isEmpty(filter);
};
var isRowMatchModeSelected = function isRowMatchModeSelected(matchMode) {
return filterModel && filterModel.matchMode === matchMode;
};
var showMenuButton = function showMenuButton() {
return getColumnProp('showFilterMenu') && (props.display === 'row' ? getColumnProp('dataType') !== 'boolean' : true);
};
var matchModes = function matchModes() {
return getColumnProp('filterMatchModeOptions') || PrimeReact.filterMatchModeOptions[findDataType()].map(function (key) {
return {
label: localeOption(key),
value: key
};
});
};
var isShowMatchModes = function isShowMatchModes() {
return getColumnProp('dataType') !== 'boolean' && getColumnProp('showFilterMatchModes') && matchModes() && getColumnProp('showFilterMenuOptions');
};
var isShowOperator = function isShowOperator() {
return getColumnProp('showFilterOperator') && filterModel && filterModel.operator && getColumnProp('showFilterMenuOptions');
};
var showRemoveIcon = function showRemoveIcon() {
return fieldConstraints().length > 1;
};
var isShowAddConstraint = function isShowAddConstraint() {
return getColumnProp('showAddButton') && filterModel && filterModel.operator && fieldConstraints() && fieldConstraints().length < getColumnProp('maxConstraints') && getColumnProp('showFilterMenuOptions');
};
var isOutsideClicked = function isOutsideClicked(target) {
return !isTargetClicked(target) && overlayRef.current && !(overlayRef.current.isSameNode(target) || overlayRef.current.contains(target));
};
var isTargetClicked = function isTargetClicked(target) {
return iconRef.current && (iconRef.current.isSameNode(target) || iconRef.current.contains(target));
};
var getDefaultConstraint = function getDefaultConstraint() {
if (filterStoreModel) {
if (filterStoreModel.operator) {
return {
matchMode: filterStoreModel.constraints[0].matchMode,
operator: filterStoreModel.operator
};
} else {
return {
matchMode: filterStoreModel.matchMode
};
}
}
};
var findDataType = function findDataType() {
var dataType = getColumnProp('dataType');
var matchMode = 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;
};
var clearFilter = function clearFilter() {
var filterClearCallback = getColumnProp('onFilterClear');
var defaultConstraint = getDefaultConstraint();
var filters = _objectSpread$j({}, 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();
props.onFilterChange(filters);
props.onFilterApply();
hide();
};
var applyFilter = function applyFilter() {
var filterApplyClickCallback = getColumnProp('onFilterApplyClick');
filterApplyClickCallback && filterApplyClickCallback({
field: field,
constraints: filterModel
});
props.onFilterApply();
hide();
};
var toggleMenu = function toggleMenu() {
setOverlayVisibleState(function (prevVisible) {
return !prevVisible;
});
};
var onToggleButtonKeyDown = function onToggleButtonKeyDown(event) {
switch (event.key) {
case 'Escape':
case 'Tab':
hide();
break;
case 'ArrowDown':
if (overlayVisibleState) {
var focusable = DomHandler.getFirstFocusableElement(overlayRef.current);
focusable && focusable.focus();
event.preventDefault();
} else if (event.altKey) {
setOverlayVisibleState(true);
event.preventDefault();
}
break;
}
};
var onContentKeyDown = function onContentKeyDown(event) {
if (event.key === 'Escape') {
hide();
iconRef.current && iconRef.current.focus();
}
};
var onInputChange = function onInputChange(event, index) {
var filters = _objectSpread$j({}, props.filters);
var value = event.target.value;
if (props.display === 'menu') {
filters[field].constraints[index].value = value;
} else {
filters[field].value = value;
}
props.onFilterChange(filters);
if (!getColumnProp('showApplyButton') || props.display === 'row') {
props.onFilterApply();
}
};
var onInputKeydown = function onInputKeydown(event, _index) {
if (event.key === 'Enter') {
if (!getColumnProp('showApplyButton') || props.display === 'menu') {
applyFilter();
}
}
};
var onRowMatchModeChange = function onRowMatchModeChange(matchMode) {
var filterMatchModeChangeCallback = getColumnProp('onFilterMatchModeChange');
var filters = _objectSpread$j({}, props.filters);
filters[field].matchMode = matchMode;
filterMatchModeChangeCallback && filterMatchModeChangeCallback({
field: field,
matchMode: matchMode
});
props.onFilterChange(filters);
props.onFilterApply();
hide();
};
var onRowMatchModeKeyDown = function onRowMatchModeKeyDown(event, matchMode, clear) {
var item = event.target;
switch (event.key) {
case 'ArrowDown':
var nextItem = findNextItem(item);
if (nextItem) {
item.removeAttribute('tabindex');
nextItem.tabIndex = 0;
nextItem.focus();
}
event.preventDefault();
break;
case 'ArrowUp':
var prevItem = findPrevItem(item);
if (prevItem) {
item.removeAttribute('tabindex');
prevItem.tabIndex = 0;
prevItem.focus();
}
event.preventDefault();
break;
case 'Enter':
clear ? clearFilter() : onRowMatchModeChange(matchMode.value);
event.preventDefault();
break;
}
};
var onOperatorChange = function onOperatorChange(e) {
var filterOperationChangeCallback = getColumnProp('onFilterOperatorChange');
var value = e.value;
var filters = _objectSpread$j({}, props.filters);
filters[field].operator = value;
props.onFilterChange(filters);
filterOperationChangeCallback && filterOperationChangeCallback({
field: field,
operator: value
});
if (!getColumnProp('showApplyButton')) {
props.onFilterApply();
}
};
var onMenuMatchModeChange = function onMenuMatchModeChange(value, index) {
var filterMatchModeChangeCallback = getColumnProp('onFilterMatchModeChange');
var filters = _objectSpread$j({}, props.filters);
filters[field].constraints[index].matchMode = value;
props.onFilterChange(filters);
filterMatchModeChangeCallback && filterMatchModeChangeCallback({
field: field,
matchMode: value,
index: index
});
if (!getColumnProp('showApplyButton')) {
props.onFilterApply();
}
};
var addConstraint = function addConstraint() {
var filterConstraintAddCallback = getColumnProp('onFilterConstraintAdd');
var defaultConstraint = getDefaultConstraint();
var filters = _objectSpread$j({}, props.filters);
var newConstraint = {
value: null,
matchMode: defaultConstraint.matchMode
};
filters[field].constraints.push(newConstraint);
filterConstraintAddCallback && filterConstraintAddCallback({
field: field,
constraint: newConstraint
});
props.onFilterChange(filters);
if (!getColumnProp('showApplyButton')) {
props.onFilterApply();
}
};
var removeConstraint = function removeConstraint(index) {
var filterConstraintRemoveCallback = getColumnProp('onFilterConstraintRemove');
var filters = _objectSpread$j({}, props.filters);
var removedConstraint = filters[field].constraints.splice(index, 1);
filterConstraintRemoveCallback && filterConstraintRemoveCallback({
field: field,
constraint: removedConstraint
});
props.onFilterChange(filters);
if (!getColumnProp('showApplyButton')) {
props.onFilterApply();
}
};
var findNextItem = function findNextItem(item) {
var nextItem = item.nextElementSibling;
return nextItem ? DomHandler.hasClass(nextItem, 'p-column-filter-separator') ? findNextItem(nextItem) : nextItem : item.parentElement.firstElementChild;
};
var findPrevItem = function findPrevItem(item) {
var prevItem = item.previousElementSibling;
return prevItem ? DomHandler.hasClass(prevItem, 'p-column-filter-separator') ? findPrevItem(prevItem) : prevItem : item.parentElement.lastElementChild;
};
var hide = function hide() {
setOverlayVisibleState(false);
};
var onContentClick = function onContentClick(event) {
selfClick.current = true;
OverlayService.emit('overlay-click', {
originalEvent: event,
target: overlayRef.current
});
};
var onContentMouseDown = function onContentMouseDown() {
selfClick.current = true;
};
var onOverlayEnter = function onOverlayEnter() {
ZIndexUtils.set('overlay', overlayRef.current, PrimeReact.autoZIndex, PrimeReact.zIndex['overlay']);
DomHandler.alignOverlay(overlayRef.current, iconRef.current, PrimeReact.appendTo, false);
overlayEventListener.current = function (e) {
if (!isOutsideClicked(e.target)) {
selfClick.current = true;
}
};
OverlayService.on('overlay-click', overlayEventListener.current);
};
var onOverlayEntered = function onOverlayEntered() {
bindOverlayListener();
};
var onOverlayExit = function onOverlayExit() {
onOverlayHide();
};
var onOverlayExited = function onOverlayExited() {
ZIndexUtils.clear(overlayRef.current);
};
var onOverlayHide = function onOverlayHide() {
unbindOverlayListener();
OverlayService.off('overlay-click', overlayEventListener.current);
overlayEventListener.current = null;
selfClick.current = false;
};
var fieldConstraints = function fieldConstraints() {
return filterModel ? filterModel.constraints || [filterModel] : [];
};
var operator = function operator() {
return filterModel.operator;
};
var operatorOptions = function operatorOptions() {
return [{
label: localeOption('matchAll'),
value: FilterOperator.AND
}, {
label: localeOption('matchAny'),
value: FilterOperator.OR
}];
};
var filterLabel = function filterLabel() {
return localeOption('filter');
};
var noFilterLabel = function noFilterLabel() {
return localeOption('noFilter');
};
var removeRuleButtonLabel = function removeRuleButtonLabel() {
return localeOption('removeRule');
};
var addRuleButtonLabel = function addRuleButtonLabel() {
return localeOption('addRule');
};
var clearButtonLabel = function clearButtonLabel() {
return localeOption('clear');
};
var applyButtonLabel = function applyButtonLabel() {
return localeOption('apply');
};
var filterCallback = function filterCallback(value) {
var index = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
var filters = _objectSpread$j({}, props.filters);
var meta = filters[field];
props.display === 'menu' && meta && meta.operator ? filters[field].constraints[index].value = value : filters[field].value = value;
props.onFilterChange(filters);
};
var filterApplyCallback = function filterApplyCallback() {
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
args && filterCallback(args[0], args[1]);
props.onFilterApply();
};
useUpdateEffect(function () {
if (props.display === 'menu' && overlayVisibleState) {
DomHandler.alignOverlay(overlayRef.current, iconRef.current, PrimeReact.appendTo, false);
}
});
useUnmountEffect(function () {
if (overlayEventListener.current) {
OverlayService.off('overlay-click', overlayEventListener.current);
overlayEventListener.current = null;
}
if (overlayRef.current) {
ZIndexUtils.clear(overlayRef.current);
onOverlayHide();
}
});
var createFilterElement = function createFilterElement(model, index) {
var value = model ? model.value : null;
return getColumnProp('filterElement') ? ObjectUtils.getJSXElement(getColumnProp('filterElement'), {
field: field,
index: index,
filterModel: model,
value: value,
filterApplyCallback: filterApplyCallback,
filterCallback: filterCallback
}) : /*#__PURE__*/React__namespace.createElement(InputText, {
type: getColumnProp('filterType'),
value: value || '',
onChange: function onChange(e) {
return onInputChange(e, index);
},
onKeyDown: function onKeyDown(e) {
return onInputKeydown(e);
},
className: "p-column-filter",
placeholder: getColumnProp('filterPlaceholder'),
maxLength: getColumnProp('filterMaxLength')
});
};
var createRowFilterElement = function createRowFilterElement() {
if (props.display === 'row') {
var content = createFilterElement(filterModel, 0);
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-fluid p-column-filter-element"
}, content);
}
return null;
};
var createMenuFilterElement = function createMenuFilterElement(fieldConstraint, index) {
return props.display === 'menu' ? createFilterElement(fieldConstraint, index) : null;
};
var createMenuButton = function createMenuButton() {
if (showMenuButton()) {
var _className = classNames('p-column-filter-menu-button p-link', {
'p-column-filter-menu-button-open': overlayVisibleState,
'p-column-filter-menu-button-active': hasFilter()
});
var label = filterLabel();
return /*#__PURE__*/React__namespace.createElement("button", {
ref: iconRef,
type: "button",
className: _className,
"aria-haspopup": true,
"aria-expanded": overlayVisibleState,
onClick: toggleMenu,
onKeyDown: onToggleButtonKeyDown,
"aria-label": label
}, /*#__PURE__*/React__namespace.createElement("span", {
className: "pi pi-filter-icon pi-filter",
"aria-hidden": "true"
}), /*#__PURE__*/React__namespace.createElement(Ripple, null));
}
return null;
};
var createClearButton = function createClearButton() {
if (getColumnProp('showClearButton') && props.display === 'row') {
var _className2 = classNames('p-column-filter-clear-button p-link', {
'p-hidden-space': !hasRowFilter()
});
var clearLabel = clearButtonLabel();
return /*#__PURE__*/React__namespace.createElement("button", {
className: _className2,
type: "button",
onClick: clearFilter,
"aria-label": clearLabel
}, /*#__PURE__*/React__namespace.createElement("span", {
className: "pi pi-filter-slash",
"aria-hidden": "true"
}), /*#__PURE__*/React__namespace.createElement(Ripple, null));
}
return null;
};
var createRowItems = function createRowItems() {
if (isShowMatchModes()) {
var _matchModes = matchModes();
var _noFilterLabel = noFilterLabel();
return /*#__PURE__*/React__namespace.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': isRowMatchModeSelected(value)
});
var tabIndex = i === 0 ? 0 : null;
return /*#__PURE__*/React__namespace.createElement("li", {
className: className,
key: label,
onClick: function onClick() {
return onRowMatchModeChange(value);
},
onKeyDown: function onKeyDown(e) {
return onRowMatchModeKeyDown(e, matchMode);
},
tabIndex: tabIndex
}, label);
}), /*#__PURE__*/React__namespace.createElement("li", {
className: "p-column-filter-separator"
}), /*#__PURE__*/React__namespace.createElement("li", {
className: "p-column-filter-row-item",
onClick: clearFilter,
onKeyDown: function onKeyDown(e) {
return onRowMatchModeKeyDown(e, null, true);
}
}, _noFilterLabel));
}
return null;
};
var createOperator = function createOperator() {
if (isShowOperator()) {
var options = operatorOptions();
var value = operator();
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-column-filter-operator"
}, /*#__PURE__*/React__namespace.createElement(Dropdown, {
options: options,
value: value,
onChange: onOperatorChange,
className: "p-column-filter-operator-dropdown"
}));
}
return null;
};
var createMatchModeDropdown = function createMatchModeDropdown(constraint, index) {
if (isShowMatchModes()) {
var options = matchModes();
return /*#__PURE__*/React__namespace.createElement(Dropdown, {
options: options,
value: constraint.matchMode,
onChange: function onChange(e) {
return onMenuMatchModeChange(e.value, index);
},
className: "p-column-filter-matchmode-dropdown"
});
}
return null;
};
var createRemoveButton = function createRemoveButton(index) {
if (showRemoveIcon()) {
var removeRuleLabel = removeRuleButtonLabel();
return /*#__PURE__*/React__namespace.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 removeConstraint(index);
},
label: removeRuleLabel
});
}
return null;
};
var createConstraints = function createConstraints() {
var _fieldConstraints = fieldConstraints();
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-column-filter-constraints"
}, _fieldConstraints.map(function (fieldConstraint, i) {
var matchModeDropdown = createMatchModeDropdown(fieldConstraint, i);
var menuFilterElement = createMenuFilterElement(fieldConstraint, i);
var removeButton = createRemoveButton(i);
return /*#__PURE__*/React__namespace.createElement("div", {
key: i,
className: "p-column-filter-constraint"
}, matchModeDropdown, menuFilterElement, /*#__PURE__*/React__namespace.createElement("div", null, removeButton));
}));
};
var createAddRule = function createAddRule() {
if (isShowAddConstraint()) {
var addRuleLabel = addRuleButtonLabel();
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-column-filter-add-rule"
}, /*#__PURE__*/React__namespace.createElement(Button, {
type: "button",
label: addRuleLabel,
icon: "pi pi-plus",
className: "p-column-filter-add-button p-button-text p-button-sm",
onClick: addConstraint
}));
}
return null;
};
var createFilterClearButton = function createFilterClearButton() {
if (getColumnProp('showClearButton')) {
if (!getColumnProp('filterClear')) {
var clearLabel = clearButtonLabel();
return /*#__PURE__*/React__namespace.createElement(Button, {
type: "button",
className: "p-button-outlined p-button-sm",
onClick: clearFilter,
label: clearLabel
});
}
return ObjectUtils.getJSXElement(getColumnProp('filterClear'), {
field: field,
filterModel: filterModel,
filterClearCallback: clearFilter
});
}
return null;
};
var createFilterApplyButton = function createFilterApplyButton() {
if (getColumnProp('showApplyButton')) {
if (!getColumnProp('filterApply')) {
var applyLabel = applyButtonLabel();
return /*#__PURE__*/React__namespace.createElement(Button, {
type: "button",
className: "p-button-sm",
onClick: applyFilter,
label: applyLabel
});
}
return ObjectUtils.getJSXElement(getColumnProp('filterApply'), {
field: field,
filterModel: filterModel,
filterApplyCallback: applyFilter
});
}
return null;
};
var createButtonBar = function createButtonBar() {
var clearButton = createFilterClearButton();
var applyButton = createFilterApplyButton();
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-column-filter-buttonbar"
}, clearButton, applyButton);
};
var createItems = function createItems() {
var operator = createOperator();
var constraints = createConstraints();
var addRule = createAddRule();
var buttonBar = createButtonBar();
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, operator, constraints, addRule, buttonBar);
};
var createOverlay = function createOverlay() {
var style = getColumnProp('filterMenuStyle');
var className = classNames('p-column-filter-overlay p-component p-fluid', getColumnProp('filterMenuClassName'), {
'p-column-filter-overlay-menu': props.display === 'menu',
'p-input-filled': PrimeReact.inputStyle === 'filled',
'p-ripple-disabled': PrimeReact.ripple === false
});
var filterHeader = ObjectUtils.getJSXElement(getColumnProp('filterHeader'), {
field: field,
filterModel: filterModel,
filterApplyCallback: filterApplyCallback
});
var filterFooter = ObjectUtils.getJSXElement(getColumnProp('filterFooter'), {
field: field,
filterModel: filterModel,
filterApplyCallback: filterApplyCallback
});
var items = props.display === 'row' ? createRowItems() : createItems();
return /*#__PURE__*/React__namespace.createElement(Portal, null, /*#__PURE__*/React__namespace.createElement(CSSTransition, {
nodeRef: overlayRef,
classNames: "p-connected-overlay",
"in": overlayVisibleState,
timeout: {
enter: 120,
exit: 100
},
unmountOnExit: true,
onEnter: onOverlayEnter,
onEntered: onOverlayEntered,
onExit: onOverlayExit,
onExited: onOverlayExited
}, /*#__PURE__*/React__namespace.createElement("div", {
ref: overlayRef,
style: style,
className: className,
onKeyDown: onContentKeyDown,
onClick: onContentClick,
onMouseDown: onContentMouseDown
}, filterHeader, items, filterFooter)));
};
var className = classNames('p-column-filter p-fluid', {
'p-column-filter-row': props.display === 'row',
'p-column-filter-menu': props.display === 'menu'
});
var rowFilterElement = createRowFilterElement();
var menuButton = createMenuButton();
var clearButton = createClearButton();
var overlay = createOverlay();
return /*#__PURE__*/React__namespace.createElement("div", {
className: className
}, rowFilterElement, menuButton, clearButton, overlay);
});
ColumnFilter.displayName = 'ColumnFilter';
var HeaderCheckbox = /*#__PURE__*/React__namespace.memo(function (props) {
var _React$useState = React__namespace.useState(false),
_React$useState2 = _slicedToArray(_React$useState, 2),
focusedState = _React$useState2[0],
setFocusedState = _React$useState2[1];
var onFocus = function onFocus() {
setFocusedState(true);
};
var onBlur = function onBlur() {
setFocusedState(false);
};
var onClick = function onClick(event) {
if (!props.disabled) {
setFocusedState(true);
props.onChange({
originalEvent: event,
checked: !props.checked
});
}
};
var onKeyDown = function onKeyDown(event) {
if (event.code === 'Space' || event.key === ' ') {
// event.key is for Android support
onClick(event);
event.preventDefault();
}
};
var boxClassName = classNames('p-checkbox-box p-component', {
'p-highlight': props.checked,
'p-disabled': props.disabled,
'p-focus': focusedState
});
var iconClassName = classNames('p-checkbox-icon', {
'pi pi-check': props.checked
});
var tabIndex = props.disabled ? null : 0;
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-checkbox p-component",
onClick: onClick
}, /*#__PURE__*/React__namespace.createElement("div", {
className: boxClassName,
role: "checkbox",
"aria-checked": props.checked,
tabIndex: tabIndex,
onFocus: onFocus,
onBlur: onBlur,
onKeyDown: onKeyDown
}, /*#__PURE__*/React__namespace.createElement("span", {
className: iconClassName
})));
});
HeaderCheckbox.displayName = 'HeaderCheckbox';
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; }
var HeaderCell = /*#__PURE__*/React__namespace.memo(function (props) {
var _React$useState = React__namespace.useState({}),
_React$useState2 = _slicedToArray(_React$useState, 2),
styleObjectState = _React$useState2[0],
setStyleObjectState = _React$useState2[1];
var elementRef = React__namespace.useRef(null);
var prevColumn = usePrevious(props.column);
var isBadgeVisible = function isBadgeVisible() {
return props.multiSortMeta && props.multiSortMeta.length > 1;
};
var isSortableDisabled = function isSortableDisabled() {
return !getColumnProp('sortable') || getColumnProp('sortable') && (props.allSortableDisabled || getColumnProp('sortableDisabled'));
};
var getColumnProp = function getColumnProp() {
return props.column ? typeof (arguments.length <= 0 ? undefined : arguments[0]) === 'string' ? ColumnBase.getCProp(props.column, arguments.length <= 0 ? undefined : arguments[0]) : ColumnBase.getCProp((arguments.length <= 0 ? undefined : arguments[0]) || props.column, arguments.length <= 1 ? undefined : arguments[1]) : null;
};
var getStyle = function getStyle() {
var headerStyle = getColumnProp('headerStyle');
var columnStyle = getColumnProp('style');
return getColumnProp('frozen') ? Object.assign({}, columnStyle, headerStyle, styleObjectState) : Object.assign({}, columnStyle, headerStyle);
};
var getMultiSortMetaIndex = function getMultiSortMetaIndex() {
return props.multiSortMeta.findIndex(function (meta) {
return meta.field === getColumnProp('field') || meta.field === getColumnProp('sortField');
});
};
var getSortMeta = function getSortMeta() {
var sorted = false;
var sortOrder = 0;
var metaIndex = -1;
if (props.sortMode === 'single') {
sorted = props.sortField && (props.sortField === getColumnProp('field') || props.sortField === getColumnProp('sortField'));
sortOrder = sorted ? props.sortOrder : 0;
} else if (props.sortMode === 'multiple') {
metaIndex = getMultiSortMetaIndex();
if (metaIndex > -1) {
sorted = true;
sortOrder = props.multiSortMeta[metaIndex].order;
}
}
return {
sorted: sorted,
sortOrder: sortOrder,
metaIndex: metaIndex
};
};
var getAriaSort = function getAriaSort(_ref) {
var sorted = _ref.sorted,
sortOrder = _ref.sortOrder;
if (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;
};
var updateStickyPosition = function updateStickyPosition() {
if (getColumnProp('frozen')) {
var styleObject = _objectSpread$i({}, styleObjectState);
var align = getColumnProp('alignFrozen');
if (align === 'right') {
var right = 0;
var next = elementRef.current.nextElementSibling;
if (next) {
right = DomHandler.getOuterWidth(next) + parseFloat(next.style.right || 0);
}
styleObject['right'] = right + 'px';
} else {
var left = 0;
var prev = elementRef.current.previousElementSibling;
if (prev) {
left = DomHandler.getOuterWidth(prev) + parseFloat(prev.style.left || 0);
}
styleObject['left'] = left + 'px';
}
var filterRow = elementRef.current.parentElement.nextElementSibling;
if (filterRow) {
var index = DomHandler.index(elementRef.current);
filterRow.children[index].style.left = styleObject['left'];
filterRow.children[index].style.right = styleObject['right'];
}
var isSameStyle = styleObjectState['left'] === styleObject['left'] && styleObjectState['right'] === styleObject['right'];
!isSameStyle && setStyleObjectState(styleObject);
}
};
var updateSortableDisabled = function updateSortableDisabled(prevColumn) {
if (getColumnProp(prevColumn, 'sortableDisabled') !== getColumnProp('sortableDisabled') || getColumnProp(prevColumn, 'sortable') !== getColumnProp('sortable')) {
props.onSortableChange();
}
};
var onClick = function onClick(event) {
if (!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();
props.onSortChange({
originalEvent: event,
column: props.column,
sortableDisabledFields: props.sortableDisabledFields
});
}
}
};
var onMouseDown = function onMouseDown(event) {
props.onColumnMouseDown({
originalEvent: event,
column: props.column
});
};
var onKeyDown = function onKeyDown(event) {
if (event.key === 'Enter' && event.currentTarget === elementRef.current && DomHandler.hasClass(event.currentTarget, 'p-sortable-column')) {
onClick(event);
event.preventDefault();
}
};
var onDragStart = function onDragStart(event) {
props.onColumnDragStart({
originalEvent: event,
column: props.column
});
};
var onDragOver = function onDragOver(event) {
props.onColumnDragOver({
originalEvent: event,
column: props.column
});
};
var onDragLeave = function onDragLeave(event) {
props.onColumnDragLeave({
originalEvent: event,
column: props.column
});
};
var onDrop = function onDrop(event) {
props.onColumnDrop({
originalEvent: event,
column: props.column
});
};
var onResizerMouseDown = function onResizerMouseDown(event) {
props.onColumnResizeStart({
originalEvent: event,
column: props.column
});
};
var onResizerClick = function onResizerClick(event) {
if (props.onColumnResizerClick) {
props.onColumnResizerClick({
originalEvent: event,
element: event.currentTarget.parentElement,
column: props.column
});
event.preventDefault();
}
};
var onResizerDoubleClick = function onResizerDoubleClick(event) {
if (props.onColumnResizerDoubleClick) {
props.onColumnResizerDoubleClick({
originalEvent: event,
element: event.currentTarget.parentElement,
column: props.column
});
event.preventDefault();
}
};
React__namespace.useEffect(function () {
if (getColumnProp('frozen')) {
updateStickyPosition();
}
updateSortableDisabled(prevColumn);
});
var createResizer = function createResizer() {
if (props.resizableColumns && !getColumnProp('frozen')) {
return /*#__PURE__*/React__namespace.createElement("span", {
className: "p-column-resizer",
onMouseDown: onResizerMouseDown,
onClick: onResizerClick,
onDoubleClick: onResizerDoubleClick
});
}
return null;
};
var createTitle = function createTitle() {
var title = ObjectUtils.getJSXElement(getColumnProp('header'), {
props: props.tableProps
});
return /*#__PURE__*/React__namespace.createElement("span", {
className: "p-column-title"
}, title);
};
var createSortIcon = function createSortIcon(_ref2) {
var sorted = _ref2.sorted,
sortOrder = _ref2.sortOrder;
if (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__namespace.createElement("span", {
className: className
});
}
return null;
};
var createBadge = function createBadge(_ref3) {
var metaIndex = _ref3.metaIndex;
if (metaIndex !== -1 && isBadgeVisible()) {
var value = props.groupRowsBy && props.groupRowsBy === props.groupRowSortField ? metaIndex : metaIndex + 1;
return /*#__PURE__*/React__namespace.createElement("span", {
className: "p-sortable-column-badge"
}, value);
}
return null;
};
var createCheckbox = function createCheckbox() {
if (props.showSelectAll && getColumnProp('selectionMode') === 'multiple' && props.filterDisplay !== 'row') {
var allRowsSelected = props.allRowsSelected(props.value);
return /*#__PURE__*/React__namespace.createElement(HeaderCheckbox, {
checked: allRowsSelected,
onChange: props.onColumnCheckboxChange,
disabled: props.empty
});
}
return null;
};
var createFilter = function createFilter() {
if (props.filterDisplay === 'menu' && getColumnProp('filter')) {
return /*#__PURE__*/React__namespace.createElement(ColumnFilter, {
display: "menu",
column: props.column,
filters: props.filters,
onFilterChange: props.onFilterChange,
onFilterApply: props.onFilterApply,
filtersStore: props.filtersStore
});
}
return null;
};
var createHeader = function createHeader(sortMeta) {
var title = createTitle();
var sortIcon = createSortIcon(sortMeta);
var badge = createBadge(sortMeta);
var checkbox = createCheckbox();
var filter = createFilter();
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-column-header-content"
}, title, sortIcon, badge, checkbox, filter);
};
var createElement = function createElement() {
var _isSortableDisabled = isSortableDisabled();
var sortMeta = getSortMeta();
var style = getStyle();
var align = getColumnProp('alignHeader') || getColumnProp('align');
var frozen = getColumnProp('frozen');
var className = classNames(getColumnProp('headerClassName'), getColumnProp('className'), _defineProperty({
'p-sortable-column': getColumnProp('sortable'),
'p-resizable-column': props.resizableColumns && getColumnProp('resizeable'),
'p-highlight': sortMeta.sorted,
'p-frozen-column': frozen,
'p-selection-column': getColumnProp('selectionMode'),
'p-sortable-disabled': getColumnProp('sortable') && _isSortableDisabled,
'p-reorderable-column': props.reorderableColumns && getColumnProp('reorderable') && !frozen
}, "p-align-".concat(align), !!align));
var tabIndex = getColumnProp('sortable') && !_isSortableDisabled ? props.tabIndex : null;
var colSpan = getColumnProp('colSpan');
var rowSpan = getColumnProp('rowSpan');
var ariaSort = getAriaSort(sortMeta);
var headerTooltip = getColumnProp('headerTooltip');
var hasTooltip = ObjectUtils.isNotEmpty(headerTooltip);
var headerTooltipOptions = getColumnProp('headerTooltipOptions');
var resizer = createResizer();
var header = createHeader(sortMeta);
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement("th", {
ref: elementRef,
style: style,
className: className,
tabIndex: tabIndex,
role: "columnheader",
onClick: onClick,
onKeyDown: onKeyDown,
onMouseDown: onMouseDown,
onDragStart: onDragStart,
onDragOver: onDragOver,
onDragLeave: onDragLeave,
onDrop: onDrop,
colSpan: colSpan,
rowSpan: rowSpan,
"aria-sort": ariaSort
}, resizer, header), hasTooltip && /*#__PURE__*/React__namespace.createElement(Tooltip, _extends({
target: elementRef,
content: headerTooltip
}, headerTooltipOptions)));
};
var element = createElement();
return element;
});
HeaderCell.displayName = 'HeaderCell';
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; }
var TableHeader = /*#__PURE__*/React__namespace.memo(function (props) {
var _React$useState = React__namespace.useState([]),
_React$useState2 = _slicedToArray(_React$useState, 2),
sortableDisabledFieldsState = _React$useState2[0],
setSortableDisabledFieldsState = _React$useState2[1];
var _React$useState3 = React__namespace.useState(false),
_React$useState4 = _slicedToArray(_React$useState3, 2),
allSortableDisabledState = _React$useState4[0],
setAllSortableDisabledState = _React$useState4[1];
var isSingleSort = props.sortMode === 'single';
var isMultipleSort = props.sortMode === 'multiple';
var isAllSortableDisabled = isSingleSort && allSortableDisabledState;
var getColumnProp = function getColumnProp(column, name) {
return ColumnBase.getCProp(column, name);
};
var isColumnSorted = function isColumnSorted(column) {
return props.sortField !== null ? getColumnProp(column, 'field') === props.sortField || getColumnProp(column, 'sortField') === props.sortField : false;
};
var updateSortableDisabled = function updateSortableDisabled() {
if (isSingleSort || isMultipleSort && props.onSortChange) {
var sortableDisabledFields = [];
var allSortableDisabled = false;
props.columns.forEach(function (column) {
if (getColumnProp(column, 'sortableDisabled')) {
sortableDisabledFields.push(getColumnProp(column, 'sortField') || getColumnProp(column, 'field'));
if (!allSortableDisabled && isColumnSorted(column)) {
allSortableDisabled = true;
}
}
});
setSortableDisabledFieldsState(sortableDisabledFields);
setAllSortableDisabledState(allSortableDisabled);
}
};
var onSortableChange = function onSortableChange() {
updateSortableDisabled();
};
var onCheckboxChange = function onCheckboxChange(e) {
props.onColumnCheckboxChange(e, props.value);
};
useMountEffect(function () {
updateSortableDisabled();
});
var createGroupHeaderCells = function createGroupHeaderCells(row) {
var columns = React__namespace.Children.toArray(RowBase.getCProp(row, 'children'));
return createHeaderCells(columns);
};
var createHeaderCells = function createHeaderCells(columns) {
return React__namespace.Children.map(columns, function (col, i) {
var isVisible = col ? !getColumnProp(col, 'hidden') : true;
var key = col ? getColumnProp(col, 'columnKey') || getColumnProp(col, 'field') || i : i;
return isVisible && /*#__PURE__*/React__namespace.createElement(HeaderCell, {
key: key,
value: props.value,
tableProps: props.tableProps,
column: col,
tabIndex: props.tabIndex,
empty: props.empty,
resizableColumns: props.resizableColumns,
groupRowsBy: props.groupRowsBy,
groupRowSortField: props.groupRowSortField,
sortMode: props.sortMode,
sortField: props.sortField,
sortOrder: props.sortOrder,
multiSortMeta: props.multiSortMeta,
allSortableDisabled: isAllSortableDisabled,
onSortableChange: onSortableChange,
sortableDisabledFields: sortableDisabledFieldsState,
filterDisplay: props.filterDisplay,
filters: props.filters,
filtersStore: props.filtersStore,
onFilterChange: props.onFilterChange,
onFilterApply: props.onFilterApply,
onColumnMouseDown: props.onColumnMouseDown,
onColumnDragStart: props.onColumnDragStart,
onColumnDragOver: props.onColumnDragOver,
onColumnDragLeave: props.onColumnDragLeave,
onColumnDrop: props.onColumnDrop,
onColumnResizeStart: props.onColumnResizeStart,
onColumnResizerClick: props.onColumnResizerClick,
onColumnResizerDoubleClick: props.onColumnResizerDoubleClick,
showSelectAll: props.showSelectAll,
allRowsSelected: props.allRowsSelected,
onColumnCheckboxChange: onCheckboxChange,
reorderableColumns: props.reorderableColumns,
onSortChange: props.onSortChange
});
});
};
var createCheckbox = function createCheckbox(selectionMode) {
if (props.showSelectAll && selectionMode === 'multiple') {
var allRowsSelected = props.allRowsSelected(props.value);
return /*#__PURE__*/React__namespace.createElement(HeaderCheckbox, {
checked: allRowsSelected,
onChange: onCheckboxChange,
disabled: props.empty
});
}
return null;
};
var createFilter = function createFilter(column, filter) {
if (filter) {
return /*#__PURE__*/React__namespace.createElement(ColumnFilter, {
display: "row",
column: column,
filters: props.filters,
filtersStore: props.filtersStore,
onFilterChange: props.onFilterChange,
onFilterApply: props.onFilterApply
});
}
return null;
};
var createFilterCells = function createFilterCells() {
return React__namespace.Children.map(props.columns, function (col, i) {
var isVisible = !getColumnProp(col, 'hidden');
if (isVisible) {
var _ColumnBase$getCProps = ColumnBase.getCProps(col),
filterHeaderStyle = _ColumnBase$getCProps.filterHeaderStyle,
style = _ColumnBase$getCProps.style,
filterHeaderClassName = _ColumnBase$getCProps.filterHeaderClassName,
className = _ColumnBase$getCProps.className,
frozen = _ColumnBase$getCProps.frozen,
columnKey = _ColumnBase$getCProps.columnKey,
field = _ColumnBase$getCProps.field,
selectionMode = _ColumnBase$getCProps.selectionMode,
filter = _ColumnBase$getCProps.filter;
var colStyle = _objectSpread$h(_objectSpread$h({}, filterHeaderStyle || {}), style || {});
var colClassName = classNames('p-filter-column', filterHeaderClassName, className, {
'p-frozen-column': frozen
});
var colKey = columnKey || field || i;
var checkbox = createCheckbox(selectionMode);
var filterRow = createFilter(col, filter);
return /*#__PURE__*/React__namespace.createElement("th", {
key: colKey,
style: colStyle,
className: colClassName
}, checkbox, filterRow);
}
return null;
});
};
var createContent = function createContent() {
if (props.headerColumnGroup) {
var rows = React__namespace.Children.toArray(ColumnGroupBase.getCProp(props.headerColumnGroup, 'children'));
return rows.map(function (row, i) {
return /*#__PURE__*/React__namespace.createElement("tr", {
key: i,
role: "row"
}, createGroupHeaderCells(row));
});
} else {
var headerRow = /*#__PURE__*/React__namespace.createElement("tr", {
role: "row"
}, createHeaderCells(props.columns));
var filterRow = props.filterDisplay === 'row' && /*#__PURE__*/React__namespace.createElement("tr", {
role: "row"
}, createFilterCells());
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, headerRow, filterRow);
}
};
var content = createContent();
return /*#__PURE__*/React__namespace.createElement("thead", {
className: "p-datatable-thead"
}, content);
});
TableHeader.displayName = 'TableHeader';
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; }
var DataTable = /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = DataTableBase.getProps(inProps);
var _React$useState = React__namespace.useState(props.first),
_React$useState2 = _slicedToArray(_React$useState, 2),
firstState = _React$useState2[0],
setFirstState = _React$useState2[1];
var _React$useState3 = React__namespace.useState(props.rows),
_React$useState4 = _slicedToArray(_React$useState3, 2),
rowsState = _React$useState4[0],
setRowsState = _React$useState4[1];
var _React$useState5 = React__namespace.useState(props.sortField),
_React$useState6 = _slicedToArray(_React$useState5, 2),
sortFieldState = _React$useState6[0],
setSortFieldState = _React$useState6[1];
var _React$useState7 = React__namespace.useState(props.sortOrder),
_React$useState8 = _slicedToArray(_React$useState7, 2),
sortOrderState = _React$useState8[0],
setSortOrderState = _React$useState8[1];
var _React$useState9 = React__namespace.useState(props.multiSortMeta),
_React$useState10 = _slicedToArray(_React$useState9, 2),
multiSortMetaState = _React$useState10[0],
setMultiSortMetaState = _React$useState10[1];
var _React$useState11 = React__namespace.useState(props.filters),
_React$useState12 = _slicedToArray(_React$useState11, 2),
filtersState = _React$useState12[0],
setFiltersState = _React$useState12[1];
var _React$useState13 = React__namespace.useState([]),
_React$useState14 = _slicedToArray(_React$useState13, 2),
columnOrderState = _React$useState14[0],
setColumnOrderState = _React$useState14[1];
var _React$useState15 = React__namespace.useState(null),
_React$useState16 = _slicedToArray(_React$useState15, 2),
groupRowsSortMetaState = _React$useState16[0],
setGroupRowsSortMetaState = _React$useState16[1];
var _React$useState17 = React__namespace.useState({}),
_React$useState18 = _slicedToArray(_React$useState17, 2),
editingMetaState = _React$useState18[0],
setEditingMetaState = _React$useState18[1];
var _React$useState19 = React__namespace.useState(null),
_React$useState20 = _slicedToArray(_React$useState19, 2),
attributeSelectorState = _React$useState20[0],
setAttributeSelectorState = _React$useState20[1];
var _React$useState21 = React__namespace.useState(props.rows),
_React$useState22 = _slicedToArray(_React$useState21, 2),
d_rowsState = _React$useState22[0],
setD_rowsState = _React$useState22[1];
var _React$useState23 = React__namespace.useState({}),
_React$useState24 = _slicedToArray(_React$useState23, 2),
d_filtersState = _React$useState24[0],
setD_filtersState = _React$useState24[1];
var elementRef = React__namespace.useRef(null);
var tableRef = React__namespace.useRef(null);
var wrapperRef = React__namespace.useRef(null);
var bodyRef = React__namespace.useRef(null);
var frozenBodyRef = React__namespace.useRef(null);
var virtualScrollerRef = React__namespace.useRef(null);
var reorderIndicatorUpRef = React__namespace.useRef(null);
var reorderIndicatorDownRef = React__namespace.useRef(null);
var colReorderIconWidth = React__namespace.useRef(null);
var colReorderIconHeight = React__namespace.useRef(null);
var resizeHelperRef = React__namespace.useRef(null);
var draggedColumnElement = React__namespace.useRef(null);
var draggedColumn = React__namespace.useRef(null);
var dropPosition = React__namespace.useRef(null);
var styleElement = React__namespace.useRef(null);
var responsiveStyleElement = React__namespace.useRef(null);
var columnWidthsState = React__namespace.useRef(null);
var tableWidthState = React__namespace.useRef(null);
var resizeColumn = React__namespace.useRef(null);
var resizeColumnElement = React__namespace.useRef(null);
var columnResizing = React__namespace.useRef(false);
var lastResizeHelperX = React__namespace.useRef(null);
var columnSortable = React__namespace.useRef(false);
var columnSortFunction = React__namespace.useRef(null);
var columnField = React__namespace.useRef(null);
var filterTimeout = React__namespace.useRef(null);
if (props.rows !== d_rowsState && !props.onPage) {
setRowsState(props.rows);
setD_rowsState(props.rows);
}
var _useEventListener = useEventListener({
type: 'mousemove',
listener: function listener(event) {
if (columnResizing.current) {
onColumnResize(event);
}
}
}),
_useEventListener2 = _slicedToArray(_useEventListener, 2),
bindDocumentMouseMoveListener = _useEventListener2[0],
unbindDocumentMouseMoveListener = _useEventListener2[1];
var _useEventListener3 = useEventListener({
type: 'mouseup',
listener: function listener() {
if (columnResizing.current) {
columnResizing.current = false;
onColumnResizeEnd();
}
}
}),
_useEventListener4 = _slicedToArray(_useEventListener3, 2),
bindDocumentMouseUpListener = _useEventListener4[0],
unbindDocumentMouseUpListener = _useEventListener4[1];
var isCustomStateStorage = function isCustomStateStorage() {
return props.stateStorage === 'custom';
};
var isStateful = function isStateful() {
return props.stateKey != null || isCustomStateStorage();
};
var isVirtualScrollerDisabled = function isVirtualScrollerDisabled() {
return ObjectUtils.isEmpty(props.virtualScrollerOptions) || !props.scrollable;
};
var isEquals = function isEquals(data1, data2) {
return props.compareSelectionBy === 'equals' ? data1 === data2 : ObjectUtils.equals(data1, data2, props.dataKey);
};
var hasFilter = function hasFilter() {
return ObjectUtils.isNotEmpty(getFilters()) || props.globalFilter;
};
var getFirst = function getFirst() {
return props.onPage ? props.first : firstState;
};
var getRows = function getRows() {
return props.onPage ? props.rows : rowsState;
};
var getSortField = function getSortField() {
return props.onSort ? props.sortField : sortFieldState;
};
var getSortOrder = function getSortOrder() {
return props.onSort ? props.sortOrder : sortOrderState;
};
var getMultiSortMeta = function getMultiSortMeta() {
return (props.onSort ? props.multiSortMeta : multiSortMetaState) || [];
};
var getFilters = function getFilters() {
return props.onFilter ? props.filters : filtersState;
};
var getColumnProp = function getColumnProp(column, name) {
return ColumnBase.getCProp(column, name);
};
var getColumns = function getColumns(ignoreReorderable) {
var columns = React__namespace.Children.toArray(props.children);
if (!columns) {
return null;
}
if (!ignoreReorderable && props.reorderableColumns && columnOrderState) {
var orderedColumns = columnOrderState.reduce(function (arr, columnKey) {
var column = 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;
};
var getStorage = function getStorage() {
switch (props.stateStorage) {
case 'local':
return window.localStorage;
case 'session':
return window.sessionStorage;
case 'custom':
return null;
default:
throw new Error(props.stateStorage + ' is not a valid value for the state storage, supported values are "local", "session" and "custom".');
}
};
var saveState = function saveState() {
var state = {};
if (props.paginator) {
state.first = getFirst();
state.rows = getRows();
}
var sortField = getSortField();
if (sortField) {
state.sortField = sortField;
state.sortOrder = getSortOrder();
}
var multiSortMeta = getMultiSortMeta();
if (multiSortMeta) {
state.multiSortMeta = multiSortMeta;
}
if (hasFilter()) {
state.filters = getFilters();
}
if (props.resizableColumns) {
saveColumnWidths(state);
}
if (props.reorderableColumns) {
state.columnOrder = columnOrderState;
}
if (props.expandedRows) {
state.expandedRows = props.expandedRows;
}
if (props.selection && props.onSelectionChange) {
state.selection = props.selection;
}
if (isCustomStateStorage()) {
if (props.customSaveState) {
props.customSaveState(state);
}
} else {
var storage = getStorage();
if (ObjectUtils.isNotEmpty(state)) {
storage.setItem(props.stateKey, JSON.stringify(state));
}
}
if (props.onStateSave) {
props.onStateSave(state);
}
};
var clearState = function clearState() {
var storage = getStorage();
if (storage && props.stateKey) {
storage.removeItem(props.stateKey);
}
};
var restoreState = function restoreState() {
var restoredState = {};
if (isCustomStateStorage()) {
if (props.customRestoreState) {
restoredState = props.customRestoreState();
}
} else {
var storage = getStorage();
var stateString = storage.getItem(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);
}
}
_restoreState(restoredState);
};
var restoreTableState = function restoreTableState(restoredState) {
_restoreState(restoredState);
};
var _restoreState = function _restoreState() {
var restoredState = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
if (ObjectUtils.isNotEmpty(restoredState)) {
if (props.paginator) {
if (props.onPage) {
var getOnPageParams = function getOnPageParams(first, rows) {
var totalRecords = getTotalRecords(processedData());
var pageCount = Math.ceil(totalRecords / rows) || 1;
var page = Math.floor(first / rows);
return {
first: first,
rows: rows,
page: page,
pageCount: pageCount
};
};
props.onPage(createEvent(getOnPageParams(restoredState.first, restoredState.rows)));
} else {
setFirstState(restoredState.first);
setRowsState(restoredState.rows);
}
}
if (restoredState.sortField) {
if (props.onSort) {
props.onSort(createEvent({
sortField: restoredState.sortField,
sortOrder: restoredState.sortOrder
}));
} else {
setSortFieldState(restoredState.sortField);
setSortOrderState(restoredState.sortOrder);
}
}
if (restoredState.multiSortMeta) {
if (props.onSort) {
props.onSort(createEvent({
multiSortMeta: restoredState.multiSortMeta
}));
} else {
setMultiSortMetaState(restoredState.multiSortMeta);
}
}
if (restoredState.filters) {
setD_filtersState(cloneFilters(restoredState.filters));
if (props.onFilter) {
props.onFilter(createEvent({
filters: restoredState.filters
}));
} else {
setFiltersState(cloneFilters(restoredState.filters));
}
}
if (props.resizableColumns) {
columnWidthsState.current = restoredState.columnWidths;
tableWidthState.current = restoredState.tableWidth;
restoreColumnWidths();
}
if (props.reorderableColumns) {
setColumnOrderState(restoredState.columnOrder);
}
if (restoredState.expandedRows && props.onRowToggle) {
props.onRowToggle({
data: restoredState.expandedRows
});
}
if (restoredState.selection && props.onSelectionChange) {
props.onSelectionChange({
value: restoredState.selection
});
}
if (props.onStateRestore) {
props.onStateRestore(restoredState);
}
}
};
var saveColumnWidths = function saveColumnWidths(state) {
var widths = [];
var headers = DomHandler.find(elementRef.current, '.p-datatable-thead > tr > th');
headers.forEach(function (header) {
return widths.push(DomHandler.getOuterWidth(header));
});
state.columnWidths = widths.join(',');
if (props.columnResizeMode === 'expand') {
state.tableWidth = DomHandler.getOuterWidth(tableRef.current) + 'px';
}
};
var restoreColumnWidths = function restoreColumnWidths() {
if (columnWidthsState.current) {
var widths = columnWidthsState.current.split(',');
if (props.columnResizeMode === 'expand' && tableWidthState.current) {
tableRef.current.style.width = tableWidthState.current;
tableRef.current.style.minWidth = tableWidthState.current;
elementRef.current.style.width = tableWidthState.current;
}
if (ObjectUtils.isNotEmpty(widths)) {
createStyleElement();
var innerHTML = '';
var selector = ".p-datatable[".concat(attributeSelectorState, "] > .p-datatable-wrapper ").concat(isVirtualScrollerDisabled() ? '' : '> .p-virtualscroller', " > .p-datatable-table");
widths.forEach(function (width, index) {
var style = "width: ".concat(width, "px !important; max-width: ").concat(width, "px !important");
innerHTML += "\n ".concat(selector, " > .p-datatable-thead > tr > th:nth-child(").concat(index + 1, "),\n ").concat(selector, " > .p-datatable-tbody > tr > td:nth-child(").concat(index + 1, "),\n ").concat(selector, " > .p-datatable-tfoot > tr > td:nth-child(").concat(index + 1, ") {\n ").concat(style, "\n }\n ");
});
styleElement.current.innerHTML = innerHTML;
}
}
};
var findParentHeader = 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;
}
};
var getGroupRowSortField = function getGroupRowSortField() {
return props.sortMode === 'single' ? props.sortField : groupRowsSortMetaState ? groupRowsSortMetaState.field : null;
};
var getSelectableData = function getSelectableData(val) {
if (props.showSelectionElement || props.isDataSelectable) {
return val.filter(function (data, index) {
var isSelectable = true;
if (props.showSelectionElement) isSelectable = props.showSelectionElement({
rowIndex: index,
props: props
});
if (props.isDataSelectable && isSelectable) isSelectable = props.isDataSelectable({
data: data,
index: index
});
return isSelectable;
});
}
return val;
};
var allRowsSelected = function allRowsSelected(processedData) {
if (props.onSelectAllChange) {
return props.selectAll;
} else {
var _data = props.selectionPageOnly ? dataToRender(processedData) : processedData;
var val = ObjectUtils.isNotEmpty(props.frozenValue) ? [].concat(_toConsumableArray(props.frozenValue), _toConsumableArray(_data)) : _data;
var selectableVal = getSelectableData(val);
return selectableVal && props.selection && selectableVal.every(function (sv) {
return props.selection.some(function (s) {
return isEquals(s, sv);
});
});
}
};
var getSelectionModeInColumn = function getSelectionModeInColumn(columns) {
if (columns) {
var col = columns.find(function (c) {
return !!getColumnProp(c, 'selectionMode');
});
return col ? getColumnProp(col, 'selectionMode') : null;
}
return null;
};
var findColumnByKey = function findColumnByKey(columns, key) {
return ObjectUtils.isNotEmpty(columns) ? columns.find(function (col) {
return getColumnProp(col, 'columnKey') === key || getColumnProp(col, 'field') === key;
}) : null;
};
var getTotalRecords = function getTotalRecords(data) {
return props.lazy ? props.totalRecords : data ? data.length : 0;
};
var onEditingMetaChange = function onEditingMetaChange(e) {
var rowData = e.rowData,
field = e.field,
editingKey = e.editingKey;
e.rowIndex;
var editing = e.editing;
var editingMeta = _objectSpread$g({}, editingMetaState);
var meta = editingMeta[editingKey];
if (editing) {
!meta && (meta = editingMeta[editingKey] = {
data: _objectSpread$g({}, rowData),
fields: []
});
meta['fields'].push(field);
} else if (meta) {
var fields = meta['fields'].filter(function (f) {
return f !== field;
});
!fields.length ? delete editingMeta[editingKey] : meta['fields'] = fields;
}
setEditingMetaState(editingMeta);
};
var clearEditingMetaData = function clearEditingMetaData() {
if (props.editMode && ObjectUtils.isNotEmpty(editingMetaState)) {
setEditingMetaState({});
}
};
var onColumnResizeStart = function onColumnResizeStart(e) {
var event = e.originalEvent,
column = e.column;
var containerLeft = DomHandler.getOffset(elementRef.current).left;
resizeColumn.current = column;
resizeColumnElement.current = event.currentTarget.parentElement;
columnResizing.current = true;
lastResizeHelperX.current = event.pageX - containerLeft + elementRef.current.scrollLeft;
bindColumnResizeEvents();
};
var onColumnResize = function onColumnResize(event) {
var containerLeft = DomHandler.getOffset(elementRef.current).left;
DomHandler.addClass(elementRef.current, 'p-unselectable-text');
resizeHelperRef.current.style.height = elementRef.current.offsetHeight + 'px';
resizeHelperRef.current.style.top = 0 + 'px';
resizeHelperRef.current.style.left = event.pageX - containerLeft + elementRef.current.scrollLeft + 'px';
resizeHelperRef.current.style.display = 'block';
};
var onColumnResizeEnd = function onColumnResizeEnd() {
var delta = resizeHelperRef.current.offsetLeft - lastResizeHelperX.current;
var columnWidth = resizeColumnElement.current.offsetWidth;
var newColumnWidth = columnWidth + delta;
var minWidth = resizeColumnElement.current.style.minWidth || 15;
if (columnWidth + delta > parseInt(minWidth, 10)) {
if (props.columnResizeMode === 'fit') {
var nextColumn = resizeColumnElement.current.nextElementSibling;
var nextColumnWidth = nextColumn.offsetWidth - delta;
if (newColumnWidth > 15 && nextColumnWidth > 15) {
resizeTableCells(newColumnWidth, nextColumnWidth);
}
} else if (props.columnResizeMode === 'expand') {
var tableWidth = tableRef.current.offsetWidth + delta + 'px';
var updateTableWidth = function updateTableWidth(el) {
!!el && (el.style.width = el.style.minWidth = tableWidth);
};
updateTableWidth(tableRef.current);
if (!isVirtualScrollerDisabled()) {
updateTableWidth(bodyRef.current);
updateTableWidth(frozenBodyRef.current);
if (wrapperRef.current) {
updateTableWidth(DomHandler.findSingle(wrapperRef.current, '.p-virtualscroller-content'));
}
}
resizeTableCells(newColumnWidth);
}
if (props.onColumnResizeEnd) {
props.onColumnResizeEnd({
element: resizeColumnElement.current,
column: resizeColumn.current,
delta: delta
});
}
if (isStateful()) {
saveState();
}
}
resizeHelperRef.current.style.display = 'none';
resizeColumn.current = null;
resizeColumnElement.current = null;
DomHandler.removeClass(elementRef.current, 'p-unselectable-text');
unbindColumnResizeEvents();
};
var resizeTableCells = function resizeTableCells(newColumnWidth, nextColumnWidth) {
var widths = [];
var colIndex = DomHandler.index(resizeColumnElement.current);
var headers = DomHandler.find(tableRef.current, '.p-datatable-thead > tr > th');
headers.forEach(function (header) {
return widths.push(DomHandler.getOuterWidth(header));
});
destroyStyleElement();
createStyleElement();
var innerHTML = '';
var selector = ".p-datatable[".concat(attributeSelectorState, "] > .p-datatable-wrapper ").concat(isVirtualScrollerDisabled() ? '' : '> .p-virtualscroller', " > .p-datatable-table");
widths.forEach(function (width, index) {
var colWidth = index === colIndex ? newColumnWidth : nextColumnWidth && index === colIndex + 1 ? nextColumnWidth : width;
var style = "width: ".concat(colWidth, "px !important; max-width: ").concat(colWidth, "px !important");
innerHTML += "\n ".concat(selector, " > .p-datatable-thead > tr > th:nth-child(").concat(index + 1, "),\n ").concat(selector, " > .p-datatable-tbody > tr > td:nth-child(").concat(index + 1, "),\n ").concat(selector, " > .p-datatable-tfoot > tr > td:nth-child(").concat(index + 1, ") {\n ").concat(style, "\n }\n ");
});
styleElement.current.innerHTML = innerHTML;
};
var bindColumnResizeEvents = function bindColumnResizeEvents() {
bindDocumentMouseMoveListener();
bindDocumentMouseUpListener();
};
var unbindColumnResizeEvents = function unbindColumnResizeEvents() {
unbindDocumentMouseMoveListener();
unbindDocumentMouseUpListener();
};
var onColumnHeaderMouseDown = function onColumnHeaderMouseDown(e) {
DomHandler.clearSelection();
var event = e.originalEvent,
column = e.column;
if (props.reorderableColumns && getColumnProp(column, 'reorderable') !== false && !getColumnProp(column, 'frozen')) {
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;
}
};
var onColumnHeaderCheckboxChange = function onColumnHeaderCheckboxChange(e, processedData) {
if (props.onSelectAllChange) {
props.onSelectAllChange(e);
} else {
var originalEvent = e.originalEvent,
checked = e.checked;
var _data2 = props.selectionPageOnly ? dataToRender(processedData) : processedData;
var selection = props.selectionPageOnly && props.selection ? props.selection.filter(function (s) {
return !_data2.some(function (d) {
return isEquals(s, d);
});
}) : [];
if (checked) {
selection = ObjectUtils.isNotEmpty(props.frozenValue) ? [].concat(_toConsumableArray(selection), _toConsumableArray(props.frozenValue), _toConsumableArray(_data2)) : [].concat(_toConsumableArray(selection), _toConsumableArray(_data2));
selection = getSelectableData(selection);
props.onAllRowsSelect && props.onAllRowsSelect({
originalEvent: originalEvent,
data: selection,
type: 'all'
});
} else {
props.onAllRowsUnselect && props.onAllRowsUnselect({
originalEvent: originalEvent,
data: selection,
type: 'all'
});
}
if (props.onSelectionChange) {
props.onSelectionChange({
originalEvent: originalEvent,
value: selection,
type: 'all'
});
}
}
};
var onColumnHeaderDragStart = function onColumnHeaderDragStart(e) {
var event = e.originalEvent,
column = e.column;
if (columnResizing.current) {
event.preventDefault();
return;
}
if (!props.reorderableColumns) return;
colReorderIconWidth.current = DomHandler.getHiddenElementOuterWidth(reorderIndicatorUpRef.current);
colReorderIconHeight.current = DomHandler.getHiddenElementOuterHeight(reorderIndicatorUpRef.current);
draggedColumn.current = column;
draggedColumnElement.current = findParentHeader(event.currentTarget);
event.dataTransfer.setData('text', 'b'); // Firefox requires this to make dragging possible
};
var onColumnHeaderDragOver = function onColumnHeaderDragOver(e) {
var event = e.originalEvent,
column = e.column;
var dropHeader = findParentHeader(event.currentTarget);
if (props.reorderableColumns && draggedColumnElement.current && dropHeader && !getColumnProp(column, 'frozen')) {
event.preventDefault();
if (draggedColumnElement.current !== dropHeader) {
var containerOffset = DomHandler.getOffset(elementRef.current);
var dropHeaderOffset = DomHandler.getOffset(dropHeader);
var targetLeft = dropHeaderOffset.left - containerOffset.left;
var columnCenter = dropHeaderOffset.left + dropHeader.offsetWidth / 2;
reorderIndicatorUpRef.current.style.top = dropHeaderOffset.top - containerOffset.top - (colReorderIconHeight.current - 1) + 'px';
reorderIndicatorDownRef.current.style.top = dropHeaderOffset.top - containerOffset.top + dropHeader.offsetHeight + 'px';
if (event.pageX > columnCenter) {
reorderIndicatorUpRef.current.style.left = targetLeft + dropHeader.offsetWidth - Math.ceil(colReorderIconWidth.current / 2) + 'px';
reorderIndicatorDownRef.current.style.left = targetLeft + dropHeader.offsetWidth - Math.ceil(colReorderIconWidth.current / 2) + 'px';
dropPosition.current = 1;
} else {
reorderIndicatorUpRef.current.style.left = targetLeft - Math.ceil(colReorderIconWidth.current / 2) + 'px';
reorderIndicatorDownRef.current.style.left = targetLeft - Math.ceil(colReorderIconWidth.current / 2) + 'px';
dropPosition.current = -1;
}
reorderIndicatorUpRef.current.style.display = 'block';
reorderIndicatorDownRef.current.style.display = 'block';
}
}
};
var onColumnHeaderDragLeave = function onColumnHeaderDragLeave(e) {
var event = e.originalEvent;
if (props.reorderableColumns && draggedColumnElement.current) {
event.preventDefault();
reorderIndicatorUpRef.current.style.display = 'none';
reorderIndicatorDownRef.current.style.display = 'none';
}
};
var onColumnHeaderDrop = function onColumnHeaderDrop(e) {
var event = e.originalEvent,
column = e.column;
event.preventDefault();
if (draggedColumnElement.current) {
var dragIndex = DomHandler.index(draggedColumnElement.current);
var dropIndex = DomHandler.index(findParentHeader(event.currentTarget));
var allowDrop = dragIndex !== dropIndex;
if (allowDrop && (dropIndex - dragIndex === 1 && dropPosition.current === -1 || dragIndex - dropIndex === 1 && dropPosition.current === 1)) {
allowDrop = false;
}
if (allowDrop) {
var _columns = getColumns();
var isSameColumn = function isSameColumn(col1, col2) {
return getColumnProp(col1, 'columnKey') || getColumnProp(col2, 'columnKey') ? ObjectUtils.equals(col1.props, col2.props, 'columnKey') : ObjectUtils.equals(col1.props, col2.props, 'field');
};
var dragColIndex = _columns.findIndex(function (child) {
return isSameColumn(child, draggedColumn.current);
});
var dropColIndex = _columns.findIndex(function (child) {
return isSameColumn(child, column);
});
if (dropColIndex < dragColIndex && dropPosition.current === 1) {
dropColIndex++;
}
if (dropColIndex > dragColIndex && dropPosition.current === -1) {
dropColIndex--;
}
ObjectUtils.reorderArray(_columns, dragColIndex, dropColIndex);
var columnOrder = _columns.reduce(function (orders, col) {
orders.push(getColumnProp(col, 'columnKey') || getColumnProp(col, 'field'));
return orders;
}, []);
setColumnOrderState(columnOrder);
if (props.onColReorder) {
props.onColReorder({
originalEvent: event,
dragIndex: dragColIndex,
dropIndex: dropColIndex,
columns: _columns
});
}
}
reorderIndicatorUpRef.current.style.display = 'none';
reorderIndicatorDownRef.current.style.display = 'none';
draggedColumnElement.current.draggable = false;
draggedColumnElement.current = null;
draggedColumn.current = null;
dropPosition.current = null;
}
};
var createStyleElement = function createStyleElement() {
styleElement.current = DomHandler.createInlineStyle(PrimeReact.nonce);
};
var createResponsiveStyle = function createResponsiveStyle() {
if (!responsiveStyleElement.current) {
responsiveStyleElement.current = DomHandler.createInlineStyle(PrimeReact.nonce);
var tableSelector = ".p-datatable-wrapper ".concat(isVirtualScrollerDisabled() ? '' : '> .p-virtualscroller', " > .p-datatable-table");
var selector = ".p-datatable[".concat(attributeSelectorState, "] > ").concat(tableSelector);
var gridLinesSelector = ".p-datatable[".concat(attributeSelectorState, "].p-datatable-gridlines > ").concat(tableSelector);
var innerHTML = "\n@media screen and (max-width: ".concat(props.breakpoint, ") {\n ").concat(selector, " > .p-datatable-thead > tr > th,\n ").concat(selector, " > .p-datatable-tfoot > tr > td {\n display: none !important;\n }\n\n ").concat(selector, " > .p-datatable-tbody > tr > td {\n display: flex;\n width: 100% !important;\n align-items: center;\n justify-content: space-between;\n }\n\n ").concat(selector, " > .p-datatable-tbody > tr > td:not(:last-child) {\n border: 0 none;\n }\n\n ").concat(gridLinesSelector, " > .p-datatable-tbody > tr > td:last-child {\n border-top: 0;\n border-right: 0;\n border-left: 0;\n }\n\n ").concat(selector, " > .p-datatable-tbody > tr > td > .p-column-title {\n display: block;\n }\n}\n");
responsiveStyleElement.current.innerHTML = innerHTML;
}
};
var destroyResponsiveStyle = function destroyResponsiveStyle() {
responsiveStyleElement.current = DomHandler.removeInlineStyle(responsiveStyleElement.current);
};
var destroyStyleElement = function destroyStyleElement() {
styleElement.current = DomHandler.removeInlineStyle(styleElement.current);
};
var onPageChange = function onPageChange(e) {
clearEditingMetaData();
if (props.onPage) {
props.onPage(createEvent(e));
} else {
setFirstState(e.first);
setRowsState(e.rows);
}
if (props.onValueChange) {
props.onValueChange(processedData());
}
};
var onSortChange = function onSortChange(e) {
clearEditingMetaData();
var event = e.originalEvent,
column = e.column,
sortableDisabledFields = e.sortableDisabledFields;
var sortField = getColumnProp(column, 'sortField') || getColumnProp(column, 'field');
var sortOrder = props.defaultSortOrder;
var multiSortMeta;
var eventMeta;
columnSortable.current = getColumnProp(column, 'sortable');
columnSortFunction.current = getColumnProp(column, 'sortFunction');
columnField.current = sortField;
if (props.sortMode === 'multiple') {
var metaKey = event.metaKey || event.ctrlKey;
multiSortMeta = _toConsumableArray(getMultiSortMeta());
var sortMeta = multiSortMeta.find(function (sortMeta) {
return sortMeta.field === sortField;
});
sortOrder = sortMeta ? 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;
});
});
addSortMeta(newMetaData, multiSortMeta);
} else if (props.removableSort) {
removeSortMeta(newMetaData, multiSortMeta);
}
eventMeta = {
multiSortMeta: multiSortMeta
};
} else {
sortOrder = getSortField() === sortField ? getCalculatedSortOrder(getSortOrder()) : sortOrder;
if (props.removableSort) {
sortField = sortOrder ? sortField : null;
}
eventMeta = {
sortField: sortField,
sortOrder: sortOrder
};
}
if (props.onSort) {
props.onSort(createEvent(eventMeta));
} else {
setFirstState(0);
setSortFieldState(eventMeta.sortField);
setSortOrderState(eventMeta.sortOrder);
setMultiSortMetaState(eventMeta.multiSortMeta);
}
if (props.onValueChange) {
props.onValueChange(processedData({
sortField: sortField,
sortOrder: sortOrder,
multiSortMeta: multiSortMeta
}));
}
};
var getCalculatedSortOrder = function getCalculatedSortOrder(currentOrder) {
return props.removableSort ? props.defaultSortOrder === currentOrder ? currentOrder * -1 : 0 : currentOrder * -1;
};
var compareValuesOnSort = function compareValuesOnSort(value1, value2, order) {
return ObjectUtils.sort(value1, value2, order, PrimeReact.locale, PrimeReact.nullSortOrder);
};
var addSortMeta = 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);
};
var removeSortMeta = 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;
};
var sortSingle = function sortSingle(data, field, order) {
if (props.groupRowsBy && props.groupRowsBy === props.sortField) {
var multiSortMeta = [{
field: props.sortField,
order: props.sortOrder || props.defaultSortOrder
}];
props.sortField !== field && multiSortMeta.push({
field: field,
order: order
});
return sortMultiple(data, multiSortMeta);
}
var value = _toConsumableArray(data);
if (columnSortable.current && columnSortFunction.current) {
value = columnSortFunction.current({
data: data,
field: field,
order: order
});
} else {
value.sort(function (data1, data2) {
var value1 = ObjectUtils.resolveFieldData(data1, field);
var value2 = ObjectUtils.resolveFieldData(data2, field);
return compareValuesOnSort(value1, value2, order);
});
}
return value;
};
var sortMultiple = function sortMultiple(data) {
var multiSortMeta = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
if (props.groupRowsBy && (groupRowsSortMetaState || multiSortMeta.length && props.groupRowsBy === multiSortMeta[0].field)) {
var groupRowsSortMeta = groupRowsSortMetaState;
var firstSortMeta = multiSortMeta[0];
if (!groupRowsSortMeta) {
groupRowsSortMeta = firstSortMeta;
setGroupRowsSortMetaState(groupRowsSortMeta);
}
if (firstSortMeta.field !== groupRowsSortMeta.field) {
multiSortMeta = [groupRowsSortMeta].concat(_toConsumableArray(multiSortMeta));
}
}
var value = _toConsumableArray(data);
if (columnSortable.current && columnSortFunction.current) {
var meta = multiSortMeta.find(function (meta) {
return meta.field === columnField.current;
});
var field = columnField.current;
var order = meta ? meta.order : props.defaultSortOrder;
value = columnSortFunction.current({
data: data,
field: field,
order: order,
multiSortMeta: multiSortMeta
});
} else {
value.sort(function (data1, data2) {
return multisortField(data1, data2, multiSortMeta, 0);
});
}
return value;
};
var multisortField = function multisortField(data1, data2, multiSortMeta, index) {
var value1 = ObjectUtils.resolveFieldData(data1, multiSortMeta[index].field);
var value2 = ObjectUtils.resolveFieldData(data2, multiSortMeta[index].field);
// check if they are equal handling dates and locales
if (ObjectUtils.compare(value1, value2, PrimeReact.locale) === 0) {
return multiSortMeta.length - 1 > index ? multisortField(data1, data2, multiSortMeta, index + 1) : 0;
}
return compareValuesOnSort(value1, value2, multiSortMeta[index].order);
};
var onFilterChange = function onFilterChange(filters) {
clearEditingMetaData();
setD_filtersState(filters);
};
var onFilterApply = function onFilterApply(filtersToApply) {
clearTimeout(filterTimeout.current);
filterTimeout.current = setTimeout(function () {
var filters = cloneFilters(filtersToApply || d_filtersState);
if (props.onFilter) {
props.onFilter(createEvent({
filters: filters
}));
} else {
setFirstState(0);
setFiltersState(filters);
}
if (props.onValueChange) {
props.onValueChange(processedData({
filters: filters
}));
}
}, props.filterDelay);
};
var filterLocal = function filterLocal(data, filters) {
if (!data) return;
filters = filters || {};
var columns = getColumns();
var filteredValue = [];
var isGlobalFilter = filters['global'] || props.globalFilter;
var globalFilterFieldsArray;
if (isGlobalFilter) {
globalFilterFieldsArray = props.globalFilterFields || columns.filter(function (col) {
return !getColumnProp(col, 'excludeGlobalFilter');
}).map(function (col) {
return getColumnProp(col, 'filterField') || getColumnProp(col, 'field');
});
}
for (var i = 0; i < data.length; i++) {
var localMatch = true;
var globalMatch = false;
var localFiltered = false;
for (var prop in filters) {
if (prop === 'null') {
continue;
}
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 = executeLocalFilter(filterField, data[i], filterConstraint, j);
if (filterMeta.operator === FilterOperator.OR && localMatch || filterMeta.operator === FilterOperator.AND && !localMatch) {
break;
}
}
} else {
localMatch = 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 : props.globalFilterMatchMode;
var value = filters['global'] ? filters['global'].value : props.globalFilter;
globalMatch = FilterService.filters[matchMode](ObjectUtils.resolveFieldData(data[i], globalFilterField), value, 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 === props.value.length) {
filteredValue = data;
}
return filteredValue;
};
var executeLocalFilter = 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 ObjectUtils.isFunction(filterConstraint) && filterConstraint(dataFieldValue, filterValue, props.filterLocale, index);
};
var cloneFilters = function cloneFilters(filters) {
filters = filters || 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$g({}, constraint);
})
} : _objectSpread$g({}, value);
});
} else {
var _columns2 = getColumns();
cloned = _columns2.reduce(function (filters, col) {
var field = getColumnProp(col, 'filterField') || getColumnProp(col, 'field');
var filterFunction = getColumnProp(col, 'filterFunction');
var dataType = getColumnProp(col, 'dataType');
var matchMode = getColumnProp(col, '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] = props.filterDisplay === 'menu' ? {
operator: FilterOperator.AND,
constraints: [constraint]
} : constraint;
return filters;
}, {});
}
return cloned;
};
var filter = function filter(value, field, matchMode) {
var index = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 0;
var filters = _objectSpread$g({}, d_filtersState);
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
};
props.filterDisplay === 'menu' && meta && meta.operator ? filters[field].constraints[index] = constraint : filters[field] = constraint;
setD_filtersState(filters);
onFilterApply(filters);
};
var reset = function reset() {
setD_rowsState(props.rows);
setD_filtersState(cloneFilters(props.filters));
setGroupRowsSortMetaState(null);
setEditingMetaState({});
if (!props.onPage) {
setFirstState(props.first);
setRowsState(props.rows);
}
if (!props.onSort) {
setSortFieldState(props.sortField);
setSortOrderState(props.sortOrder);
setMultiSortMetaState(props.multiSortMeta);
}
if (!props.onFilter) {
setFiltersState(props.filters);
}
resetColumnOrder();
};
var resetScroll = function resetScroll() {
if (wrapperRef.current) {
var scrollableContainer = !isVirtualScrollerDisabled() ? DomHandler.findSingle(wrapperRef.current, '.p-virtualscroller') : wrapperRef.current;
scrollableContainer.scrollTo(0, 0);
}
};
var resetColumnOrder = function resetColumnOrder() {
var columns = getColumns(true);
var columnOrder = [];
if (columns) {
columnOrder = columns.reduce(function (orders, col) {
orders.push(getColumnProp(col, 'columnKey') || getColumnProp(col, 'field'));
return orders;
}, []);
}
setColumnOrderState(columnOrder);
};
var exportCSV = function exportCSV(options) {
var data;
var csv = "\uFEFF";
var columns = getColumns();
if (options && options.selectionOnly) {
data = props.selection || [];
} else {
data = [].concat(_toConsumableArray(props.frozenValue || []), _toConsumableArray(processedData() || []));
}
//headers
columns.forEach(function (column, i) {
var _ref3 = [getColumnProp(column, 'field'), getColumnProp(column, 'header'), getColumnProp(column, 'exportable')],
field = _ref3[0],
header = _ref3[1],
exportable = _ref3[2];
if (exportable && field) {
var columnHeader = String(header || field).replace(/"/g, '""').replace(/\n/g, "\u2028");
csv += '"' + columnHeader + '"';
if (i < columns.length - 1) {
csv += props.csvSeparator;
}
}
});
//body
data.forEach(function (record) {
csv += '\n';
columns.forEach(function (column, i) {
var _ref4 = [getColumnProp(column, 'field'), getColumnProp(column, 'exportField'), getColumnProp(column, 'exportable')],
colField = _ref4[0],
exportField = _ref4[1],
exportable = _ref4[2];
var field = exportField || colField;
if (exportable && field) {
var cellData = ObjectUtils.resolveFieldData(record, field);
if (cellData != null) {
if (props.exportFunction) {
cellData = props.exportFunction({
data: cellData,
field: field,
rowData: record,
column: column
});
} else {
cellData = String(cellData).replace(/"/g, '""').replace(/\n/g, "\u2028");
}
} else cellData = '';
csv += '"' + cellData + '"';
if (i < columns.length - 1) {
csv += props.csvSeparator;
}
}
});
});
DomHandler.exportCSV(csv, props.exportFilename);
};
var closeEditingCell = function closeEditingCell() {
if (props.editMode !== 'row') {
document.body.click();
}
};
var createEvent = function createEvent(event) {
return _objectSpread$g({
first: getFirst(),
rows: getRows(),
sortField: getSortField(),
sortOrder: getSortOrder(),
multiSortMeta: getMultiSortMeta(),
filters: getFilters()
}, event);
};
var processedData = function processedData(localState) {
var data = props.value || [];
if (!props.lazy) {
if (data && data.length) {
var filters = localState && localState.filters || getFilters();
var sortField = localState && localState.sortField || getSortField();
var sortOrder = localState && localState.sortOrder || getSortOrder();
var multiSortMeta = localState && localState.multiSortMeta || getMultiSortMeta();
var _columns3 = getColumns();
var sortColumn = _columns3.find(function (col) {
return getColumnProp(col, 'field') === sortField;
});
if (sortColumn) {
columnSortable.current = getColumnProp(sortColumn, 'sortable');
columnSortFunction.current = getColumnProp(sortColumn, 'sortFunction');
}
if (ObjectUtils.isNotEmpty(filters) || props.globalFilter) {
data = filterLocal(data, filters);
}
if (sortField || ObjectUtils.isNotEmpty(multiSortMeta)) {
if (props.sortMode === 'single') data = sortSingle(data, sortField, sortOrder);else if (props.sortMode === 'multiple') data = sortMultiple(data, multiSortMeta);
}
}
}
return data;
};
var dataToRender = function dataToRender(data) {
if (data && props.paginator) {
var first = props.lazy ? 0 : getFirst();
return data.slice(first, first + getRows());
}
return data;
};
useMountEffect(function () {
!attributeSelectorState && setAttributeSelectorState(UniqueComponentId());
setFiltersState(cloneFilters(props.filters));
setD_filtersState(cloneFilters(props.filters));
if (isStateful()) {
restoreState();
if (props.resizableColumns) {
restoreColumnWidths();
}
}
});
useUpdateEffect(function () {
if (attributeSelectorState) {
elementRef.current.setAttribute(attributeSelectorState, '');
if (props.responsiveLayout === 'stack' && !props.scrollable) {
createResponsiveStyle();
}
}
return function () {
destroyResponsiveStyle();
};
}, [attributeSelectorState, props.breakpoint]);
useUpdateEffect(function () {
var filters = cloneFilters(props.filters);
setFiltersState(filters);
setD_filtersState(cloneFilters(props.filters));
if (props.onValueChange) {
props.onValueChange(processedData({
filters: filters
}));
}
}, [props.filters]);
useUpdateEffect(function () {
if (isStateful()) {
saveState();
}
});
useUpdateEffect(function () {
destroyResponsiveStyle();
if (props.responsiveLayout === 'stack' && !props.scrollable) {
createResponsiveStyle();
}
}, [props.responsiveLayout, props.scrollable]);
useUpdateEffect(function () {
if (props.globalFilter) {
filter(props.globalFilter, 'global', props.globalFilterMatchMode);
} else {
// #3819 was filtering but now reset filter state
setFiltersState(props.filters);
}
}, [props.globalFilter, props.globalFilterMatchMode]);
useUnmountEffect(function () {
unbindColumnResizeEvents();
destroyStyleElement();
destroyResponsiveStyle();
});
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
clearState: clearState,
closeEditingCell: closeEditingCell,
exportCSV: exportCSV,
filter: filter,
reset: reset,
resetColumnOrder: resetColumnOrder,
resetScroll: resetScroll,
restoreColumnWidths: restoreColumnWidths,
restoreState: restoreState,
restoreTableState: restoreTableState,
saveState: saveState,
getElement: function getElement() {
return elementRef.current;
},
getTable: function getTable() {
return tableRef.current;
},
getVirtualScroller: function getVirtualScroller() {
return virtualScrollerRef.current;
}
};
});
var createLoader = function createLoader() {
if (props.loading) {
var iconClassName = classNames('p-datatable-loading-icon pi-spin', props.loadingIcon);
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-datatable-loading-overlay p-component-overlay"
}, /*#__PURE__*/React__namespace.createElement("i", {
className: iconClassName
}));
}
return null;
};
var createHeader = function createHeader() {
if (props.header) {
var _content = ObjectUtils.getJSXElement(props.header, {
props: props
});
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-datatable-header"
}, _content);
}
return null;
};
var createTableHeader = function createTableHeader(options, empty, _isVirtualScrollerDisabled) {
var sortField = getSortField();
var sortOrder = getSortOrder();
var multiSortMeta = _toConsumableArray(getMultiSortMeta());
var groupRowSortField = getGroupRowSortField();
var filters = d_filtersState;
var filtersStore = !props.onFilter && props.filters || getFilters();
var processedData = options.items,
virtualScrollerProps = options.props,
columns = options.columns;
var data = _isVirtualScrollerDisabled || virtualScrollerProps.lazy ? processedData : virtualScrollerProps.items;
return /*#__PURE__*/React__namespace.createElement(TableHeader, {
value: data,
tableProps: props,
columns: columns,
tabIndex: props.tabIndex,
empty: empty,
headerColumnGroup: props.headerColumnGroup,
resizableColumns: props.resizableColumns,
onColumnResizeStart: onColumnResizeStart,
onColumnResizerClick: props.onColumnResizerClick,
onColumnResizerDoubleClick: props.onColumnResizerDoubleClick,
sortMode: props.sortMode,
sortField: sortField,
sortOrder: sortOrder,
multiSortMeta: multiSortMeta,
groupRowsBy: props.groupRowsBy,
groupRowSortField: groupRowSortField,
onSortChange: onSortChange,
filterDisplay: props.filterDisplay,
filters: filters,
filtersStore: filtersStore,
onFilterChange: onFilterChange,
onFilterApply: onFilterApply,
showSelectAll: props.showSelectAll,
allRowsSelected: allRowsSelected,
onColumnCheckboxChange: onColumnHeaderCheckboxChange,
onColumnMouseDown: onColumnHeaderMouseDown,
onColumnDragStart: onColumnHeaderDragStart,
onColumnDragOver: onColumnHeaderDragOver,
onColumnDragLeave: onColumnHeaderDragLeave,
onColumnDrop: onColumnHeaderDrop,
rowGroupMode: props.rowGroupMode,
reorderableColumns: props.reorderableColumns
});
};
var createTableBody = function createTableBody(options, selectionModeInColumn, empty, isVirtualScrollerDisabled) {
var first = getFirst();
var rows = options.rows,
columns = options.columns,
contentRef = options.contentRef,
style = options.style,
className = options.className,
spacerStyle = options.spacerStyle,
itemSize = options.itemSize;
var frozenBody = ObjectUtils.isNotEmpty(props.frozenValue) && /*#__PURE__*/React__namespace.createElement(TableBody, {
ref: frozenBodyRef,
value: props.frozenValue,
className: "p-datatable-tbody p-datatable-frozen-tbody",
frozenRow: true,
tableProps: props,
tableSelector: attributeSelectorState,
columns: columns,
selectionModeInColumn: selectionModeInColumn,
first: first,
editingMeta: editingMetaState,
onEditingMetaChange: onEditingMetaChange,
tabIndex: props.tabIndex,
onRowClick: props.onRowClick,
onRowDoubleClick: props.onRowDoubleClick,
onRowMouseEnter: props.onRowMouseEnter,
onRowMouseLeave: props.onRowMouseLeave,
onCellClick: props.onCellClick,
selection: props.selection,
onSelectionChange: props.onSelectionChange,
lazy: props.lazy,
paginator: props.paginator,
onCellSelect: props.onCellSelect,
onCellUnselect: props.onCellUnselect,
onRowSelect: props.onRowSelect,
onRowUnselect: props.onRowUnselect,
dragSelection: props.dragSelection,
onContextMenu: props.onContextMenu,
onContextMenuSelectionChange: props.onContextMenuSelectionChange,
metaKeySelection: props.metaKeySelection,
selectionMode: props.selectionMode,
cellSelection: props.cellSelection,
contextMenuSelection: props.contextMenuSelection,
dataKey: props.dataKey,
expandedRows: props.expandedRows,
onRowCollapse: props.onRowCollapse,
onRowExpand: props.onRowExpand,
onRowToggle: props.onRowToggle,
editMode: props.editMode,
editingRows: props.editingRows,
onRowReorder: props.onRowReorder,
reorderableRows: props.reorderableRows,
scrollable: props.scrollable,
rowGroupMode: props.rowGroupMode,
groupRowsBy: props.groupRowsBy,
expandableRowGroups: props.expandableRowGroups,
loading: props.loading,
emptyMessage: props.emptyMessage,
rowGroupHeaderTemplate: props.rowGroupHeaderTemplate,
rowExpansionTemplate: props.rowExpansionTemplate,
rowGroupFooterTemplate: props.rowGroupFooterTemplate,
onRowEditChange: props.onRowEditChange,
compareSelectionBy: props.compareSelectionBy,
selectOnEdit: props.selectOnEdit,
onRowEditInit: props.onRowEditInit,
rowEditValidator: props.rowEditValidator,
onRowEditSave: props.onRowEditSave,
onRowEditComplete: props.onRowEditComplete,
onRowEditCancel: props.onRowEditCancel,
cellClassName: props.cellClassName,
responsiveLayout: props.responsiveLayout,
selectionAutoFocus: props.selectionAutoFocus,
isDataSelectable: props.isDataSelectable,
showSelectionElement: props.showSelectionElement,
showRowReorderElement: props.showRowReorderElement,
expandedRowIcon: props.expandedRowIcon,
collapsedRowIcon: props.collapsedRowIcon,
rowClassName: props.rowClassName,
virtualScrollerOptions: options,
isVirtualScrollerDisabled: true
});
var body = /*#__PURE__*/React__namespace.createElement(TableBody, {
ref: bodyRef,
value: dataToRender(rows),
style: style,
className: classNames('p-datatable-tbody', className),
empty: empty,
frozenRow: false,
tableProps: props,
tableSelector: attributeSelectorState,
columns: columns,
selectionModeInColumn: selectionModeInColumn,
first: first,
editingMeta: editingMetaState,
onEditingMetaChange: onEditingMetaChange,
tabIndex: props.tabIndex,
onRowClick: props.onRowClick,
onRowDoubleClick: props.onRowDoubleClick,
onRowMouseEnter: props.onRowMouseEnter,
onRowMouseLeave: props.onRowMouseLeave,
onCellClick: props.onCellClick,
selection: props.selection,
onSelectionChange: props.onSelectionChange,
lazy: props.lazy,
paginator: props.paginator,
onCellSelect: props.onCellSelect,
onCellUnselect: props.onCellUnselect,
onRowSelect: props.onRowSelect,
onRowUnselect: props.onRowUnselect,
dragSelection: props.dragSelection,
onContextMenu: props.onContextMenu,
onContextMenuSelectionChange: props.onContextMenuSelectionChange,
metaKeySelection: props.metaKeySelection,
selectionMode: props.selectionMode,
cellSelection: props.cellSelection,
contextMenuSelection: props.contextMenuSelection,
dataKey: props.dataKey,
expandedRows: props.expandedRows,
onRowCollapse: props.onRowCollapse,
onRowExpand: props.onRowExpand,
onRowToggle: props.onRowToggle,
editMode: props.editMode,
editingRows: props.editingRows,
onRowReorder: props.onRowReorder,
reorderableRows: props.reorderableRows,
scrollable: props.scrollable,
rowGroupMode: props.rowGroupMode,
groupRowsBy: props.groupRowsBy,
expandableRowGroups: props.expandableRowGroups,
loading: props.loading,
emptyMessage: props.emptyMessage,
rowGroupHeaderTemplate: props.rowGroupHeaderTemplate,
rowExpansionTemplate: props.rowExpansionTemplate,
rowGroupFooterTemplate: props.rowGroupFooterTemplate,
onRowEditChange: props.onRowEditChange,
compareSelectionBy: props.compareSelectionBy,
selectOnEdit: props.selectOnEdit,
onRowEditInit: props.onRowEditInit,
rowEditValidator: props.rowEditValidator,
onRowEditSave: props.onRowEditSave,
onRowEditComplete: props.onRowEditComplete,
onRowEditCancel: props.onRowEditCancel,
cellClassName: props.cellClassName,
responsiveLayout: props.responsiveLayout,
selectionAutoFocus: props.selectionAutoFocus,
isDataSelectable: props.isDataSelectable,
showSelectionElement: props.showSelectionElement,
showRowReorderElement: props.showRowReorderElement,
expandedRowIcon: props.expandedRowIcon,
collapsedRowIcon: props.collapsedRowIcon,
rowClassName: props.rowClassName,
virtualScrollerContentRef: contentRef,
virtualScrollerOptions: options,
isVirtualScrollerDisabled: isVirtualScrollerDisabled
});
var spacerBody = ObjectUtils.isNotEmpty(spacerStyle) ? /*#__PURE__*/React__namespace.createElement(TableBody, {
style: {
height: "calc(".concat(spacerStyle.height, " - ").concat(rows.length * itemSize, "px)")
},
className: "p-datatable-virtualscroller-spacer"
}) : null;
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, frozenBody, body, spacerBody);
};
var createTableFooter = function createTableFooter(options) {
var columns = options.columns;
return /*#__PURE__*/React__namespace.createElement(TableFooter, {
tableProps: props,
columns: columns,
footerColumnGroup: props.footerColumnGroup
});
};
var createContent = function createContent(processedData, columns, selectionModeInColumn, empty) {
if (!columns) return;
var _isVirtualScrollerDisabled = isVirtualScrollerDisabled();
var virtualScrollerOptions = props.virtualScrollerOptions || {};
return /*#__PURE__*/React__namespace.createElement("div", {
ref: wrapperRef,
className: "p-datatable-wrapper",
style: {
maxHeight: _isVirtualScrollerDisabled ? props.scrollHeight : null
}
}, /*#__PURE__*/React__namespace.createElement(VirtualScroller, _extends({
ref: virtualScrollerRef
}, virtualScrollerOptions, {
items: processedData,
columns: columns,
style: _objectSpread$g(_objectSpread$g({}, virtualScrollerOptions.style), {
height: props.scrollHeight !== 'flex' ? props.scrollHeight : undefined
}),
scrollHeight: props.scrollHeight !== 'flex' ? undefined : '100%',
disabled: _isVirtualScrollerDisabled,
loaderDisabled: true,
inline: true,
autoSize: true,
showSpacer: false,
contentTemplate: function contentTemplate(options) {
var ref = function ref(el) {
tableRef.current = el;
options.spacerRef && options.spacerRef(el);
};
var tableClassName = classNames('p-datatable-table', {
'p-datatable-scrollable-table': props.scrollable,
'p-datatable-resizable-table': props.resizableColumns,
'p-datatable-resizable-table-fit': props.resizableColumns && props.columnResizeMode === 'fit'
}, props.tableClassName);
var tableHeader = createTableHeader(options, empty, _isVirtualScrollerDisabled);
var tableBody = createTableBody(options, selectionModeInColumn, empty, _isVirtualScrollerDisabled);
var tableFooter = createTableFooter(options);
return /*#__PURE__*/React__namespace.createElement("table", {
ref: ref,
style: props.tableStyle,
className: tableClassName,
role: "table"
}, tableHeader, tableBody, tableFooter);
}
})));
};
var createFooter = function createFooter() {
if (props.footer) {
var _content2 = ObjectUtils.getJSXElement(props.footer, {
props: props
});
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-datatable-footer"
}, _content2);
}
return null;
};
var createPaginator = function createPaginator(position, totalRecords) {
var className = classNames('p-paginator-' + position, props.paginatorClassName);
return /*#__PURE__*/React__namespace.createElement(Paginator, {
first: getFirst(),
rows: getRows(),
pageLinkSize: props.pageLinkSize,
className: className,
onPageChange: onPageChange,
template: props.paginatorTemplate,
totalRecords: totalRecords,
rowsPerPageOptions: props.rowsPerPageOptions,
currentPageReportTemplate: props.currentPageReportTemplate,
leftContent: props.paginatorLeft,
rightContent: props.paginatorRight,
alwaysShow: props.alwaysShowPaginator,
dropdownAppendTo: props.paginatorDropdownAppendTo
});
};
var createPaginatorTop = function createPaginatorTop(totalRecords) {
if (props.paginator && props.paginatorPosition !== 'bottom') {
return createPaginator('top', totalRecords);
}
return null;
};
var createPaginatorBottom = function createPaginatorBottom(totalRecords) {
if (props.paginator && props.paginatorPosition !== 'top') {
return createPaginator('bottom', totalRecords);
}
return null;
};
var createResizeHelper = function createResizeHelper() {
if (props.resizableColumns) {
return /*#__PURE__*/React__namespace.createElement("div", {
ref: resizeHelperRef,
className: "p-column-resizer-helper",
style: {
display: 'none'
}
});
}
return null;
};
var createReorderIndicators = function createReorderIndicators() {
if (props.reorderableColumns) {
var style = {
position: 'absolute',
display: 'none'
};
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement("span", {
ref: reorderIndicatorUpRef,
className: "pi pi-arrow-down p-datatable-reorder-indicator-up",
style: style
}), /*#__PURE__*/React__namespace.createElement("span", {
ref: reorderIndicatorDownRef,
className: "pi pi-arrow-up p-datatable-reorder-indicator-down",
style: style
}));
}
return null;
};
var data = processedData();
var columns = getColumns();
var totalRecords = getTotalRecords(data);
var empty = ObjectUtils.isEmpty(data);
var selectionModeInColumn = getSelectionModeInColumn(columns);
var selectable = props.selectionMode || selectionModeInColumn;
var otherProps = DataTableBase.getOtherProps(props);
var className = classNames('p-datatable p-component', {
'p-datatable-hoverable-rows': props.rowHover,
'p-datatable-selectable': selectable && !props.cellSelection,
'p-datatable-selectable-cell': selectable && props.cellSelection,
'p-datatable-resizable': props.resizableColumns,
'p-datatable-resizable-fit': props.resizableColumns && props.columnResizeMode === 'fit',
'p-datatable-scrollable': props.scrollable,
'p-datatable-flex-scrollable': props.scrollable && props.scrollHeight === 'flex',
'p-datatable-responsive-stack': props.responsiveLayout === 'stack',
'p-datatable-responsive-scroll': props.responsiveLayout === 'scroll',
'p-datatable-striped': props.stripedRows,
'p-datatable-gridlines': props.showGridlines,
'p-datatable-grouped-header': props.headerColumnGroup != null,
'p-datatable-grouped-footer': props.footerColumnGroup != null,
'p-datatable-sm': props.size === 'small',
'p-datatable-lg': props.size === 'large'
}, props.className);
var loader = createLoader();
var header = createHeader();
var paginatorTop = createPaginatorTop(totalRecords);
var content = createContent(data, columns, selectionModeInColumn, empty);
var paginatorBottom = createPaginatorBottom(totalRecords);
var footer = createFooter();
var resizeHelper = createResizeHelper();
var reorderIndicators = createReorderIndicators();
return /*#__PURE__*/React__namespace.createElement("div", _extends({
ref: elementRef,
id: props.id,
className: className,
style: props.style
}, otherProps, {
"data-scrollselectors": ".p-datatable-wrapper"
}), loader, header, paginatorTop, content, paginatorBottom, footer, resizeHelper, reorderIndicators);
});
DataTable.displayName = 'DataTable';
var DataViewBase = {
defaultProps: {
__TYPE: 'DataView',
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',
gutter: false,
itemTemplate: null,
onPage: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, DataViewBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, DataViewBase.defaultProps);
}
};
var DataViewLayoutOptionsBase = {
defaultProps: {
__TYPE: 'DataViewLayoutOptions',
id: null,
style: null,
className: null,
layout: null,
onChange: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, DataViewLayoutOptionsBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, DataViewLayoutOptionsBase.defaultProps);
}
};
var DataViewLayoutOptions = /*#__PURE__*/React__namespace.memo(function (inProps) {
var props = DataViewLayoutOptionsBase.getProps(inProps);
var changeLayout = function changeLayout(event, layoutMode) {
props.onChange({
originalEvent: event,
value: layoutMode
});
event.preventDefault();
};
var otherProps = DataViewLayoutOptionsBase.getOtherProps(props);
var className = classNames('p-dataview-layout-options p-selectbutton p-buttonset', props.className);
var buttonListClass = classNames('p-button p-button-icon-only', {
'p-highlight': props.layout === 'list'
});
var buttonGridClass = classNames('p-button p-button-icon-only', {
'p-highlight': props.layout === 'grid'
});
return /*#__PURE__*/React__namespace.createElement("div", _extends({
id: props.id,
style: props.style,
className: className
}, otherProps), /*#__PURE__*/React__namespace.createElement("button", {
type: "button",
className: buttonListClass,
onClick: function onClick(event) {
return changeLayout(event, 'list');
}
}, /*#__PURE__*/React__namespace.createElement("i", {
className: "pi pi-bars"
}), /*#__PURE__*/React__namespace.createElement(Ripple, null)), /*#__PURE__*/React__namespace.createElement("button", {
type: "button",
className: buttonGridClass,
onClick: function onClick(event) {
return changeLayout(event, 'grid');
}
}, /*#__PURE__*/React__namespace.createElement("i", {
className: "pi pi-th-large"
}), /*#__PURE__*/React__namespace.createElement(Ripple, null)));
});
var DataViewItem = /*#__PURE__*/React__namespace.memo(function (props) {
return props.template(props.item, props.layout);
});
var DataView = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var _classNames;
var props = DataViewBase.getProps(inProps);
var _React$useState = React__namespace.useState(props.first),
_React$useState2 = _slicedToArray(_React$useState, 2),
firstState = _React$useState2[0],
setFirstState = _React$useState2[1];
var _React$useState3 = React__namespace.useState(props.rows),
_React$useState4 = _slicedToArray(_React$useState3, 2),
rowsState = _React$useState4[0],
setRowsState = _React$useState4[1];
var elementRef = React__namespace.useRef(null);
var first = props.onPage ? props.first : firstState;
var rows = props.onPage ? props.rows : rowsState;
var getItemRenderKey = function getItemRenderKey(value) {
return props.dataKey ? ObjectUtils.resolveFieldData(value, props.dataKey) : null;
};
var getTotalRecords = function getTotalRecords() {
return props.totalRecords ? props.totalRecords : props.value ? props.value.length : 0;
};
var createPaginator = function createPaginator(position) {
var className = classNames('p-paginator-' + position, props.paginatorClassName);
var totalRecords = getTotalRecords();
return /*#__PURE__*/React__namespace.createElement(Paginator, {
first: first,
rows: rows,
pageLinkSize: props.pageLinkSize,
className: className,
onPageChange: onPageChange,
template: props.paginatorTemplate,
totalRecords: totalRecords,
rowsPerPageOptions: props.rowsPerPageOptions,
currentPageReportTemplate: props.currentPageReportTemplate,
leftContent: props.paginatorLeft,
rightContent: props.paginatorRight,
alwaysShow: props.alwaysShowPaginator,
dropdownAppendTo: props.paginatorDropdownAppendTo
});
};
var onPageChange = function onPageChange(event) {
if (props.onPage) {
props.onPage(event);
} else {
setFirstState(event.first);
setRowsState(event.rows);
}
};
var sort = function sort() {
if (props.value) {
var value = _toConsumableArray(props.value);
value.sort(function (data1, data2) {
var value1 = ObjectUtils.resolveFieldData(data1, props.sortField);
var value2 = ObjectUtils.resolveFieldData(data2, props.sortField);
return ObjectUtils.sort(value1, value2, props.sortOrder, PrimeReact.locale, PrimeReact.nullSortOrder);
});
return value;
}
return null;
};
var createLoader = function createLoader() {
if (props.loading) {
var iconClassName = classNames('p-dataview-loading-icon pi-spin', props.loadingIcon);
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-dataview-loading-overlay p-component-overlay"
}, /*#__PURE__*/React__namespace.createElement("i", {
className: iconClassName
}));
}
return null;
};
var createTopPaginator = function createTopPaginator() {
if (props.paginator && (props.paginatorPosition !== 'bottom' || props.paginatorPosition === 'both')) {
return createPaginator('top');
}
return null;
};
var createBottomPaginator = function createBottomPaginator() {
if (props.paginator && (props.paginatorPosition !== 'top' || props.paginatorPosition === 'both')) {
return createPaginator('bottom');
}
return null;
};
var createEmptyMessage = function createEmptyMessage() {
if (!props.loading) {
var _content = props.emptyMessage || localeOption('emptyMessage');
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-col-12 col-12 p-dataview-emptymessage"
}, _content);
}
return null;
};
var createHeader = function createHeader() {
if (props.header) {
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-dataview-header"
}, props.header);
}
return null;
};
var createFooter = function createFooter() {
if (props.footer) {
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-dataview-footer"
}, props.footer);
}
return null;
};
var createItems = function createItems(value) {
if (ObjectUtils.isNotEmpty(value)) {
if (props.paginator) {
var currentFirst = props.lazy ? 0 : first;
var totalRecords = getTotalRecords();
var last = Math.min(rows + currentFirst, totalRecords);
var items = [];
for (var i = currentFirst; i < last; i++) {
var val = value[i];
val && items.push( /*#__PURE__*/React__namespace.createElement(DataViewItem, {
key: getItemRenderKey(value) || i,
template: props.itemTemplate,
layout: props.layout,
item: val
}));
}
return items;
}
return value.map(function (item, index) {
return /*#__PURE__*/React__namespace.createElement(DataViewItem, {
key: getItemRenderKey(item) || index,
template: props.itemTemplate,
layout: props.layout,
item: item
});
});
}
return createEmptyMessage();
};
var createContent = function createContent(value) {
var items = createItems(value);
var gridClassName = classNames('p-grid grid', {
'p-nogutter grid-nogutter': !props.gutter
});
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-dataview-content"
}, /*#__PURE__*/React__namespace.createElement("div", {
className: gridClassName
}, items));
};
var processData = function processData() {
var data = props.value;
if (ObjectUtils.isNotEmpty(data) && props.sortField) {
data = sort();
}
return data;
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
getElement: function getElement() {
return elementRef.current;
}
};
});
var data = processData();
var otherProps = DataViewBase.getOtherProps(props);
var className = classNames('p-dataview p-component', (_classNames = {}, _defineProperty(_classNames, "p-dataview-".concat(props.layout), !!props.layout), _defineProperty(_classNames, 'p-dataview-loading', props.loading), _classNames), props.className);
var loader = createLoader();
var topPaginator = createTopPaginator();
var bottomPaginator = createBottomPaginator();
var header = createHeader();
var footer = createFooter();
var content = createContent(data);
return /*#__PURE__*/React__namespace.createElement("div", _extends({
id: props.id,
ref: elementRef,
style: props.style,
className: className
}, otherProps), loader, header, topPaginator, content, bottomPaginator, footer);
}));
DataViewLayoutOptions.displayName = 'DataViewLayoutOptions';
DataViewItem.displayName = 'DataViewItem';
DataView.displayName = 'DataView';
var DeferredContentBase = {
defaultProps: {
__TYPE: 'DeferredContent',
onload: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, DeferredContentBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, DeferredContentBase.defaultProps);
}
};
var DeferredContent = /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = DeferredContentBase.getProps(inProps);
var _React$useState = React__namespace.useState(false),
_React$useState2 = _slicedToArray(_React$useState, 2),
loadedState = _React$useState2[0],
setLoadedState = _React$useState2[1];
var elementRef = React__namespace.useRef(null);
var _useEventListener = useEventListener({
target: 'window',
type: 'scroll',
listener: function listener() {
if (shouldLoad()) {
load();
unbindScrollListener();
}
}
}),
_useEventListener2 = _slicedToArray(_useEventListener, 2),
bindScrollListener = _useEventListener2[0],
unbindScrollListener = _useEventListener2[1];
var shouldLoad = function shouldLoad() {
if (loadedState) {
return false;
} else {
var rect = elementRef.current.getBoundingClientRect();
var winHeight = document.documentElement.clientHeight;
return winHeight >= rect.top;
}
};
var load = function load(event) {
setLoadedState(true);
props.onLoad && props.onLoad(event);
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
getElement: function getElement() {
return elementRef.current;
}
};
});
useMountEffect(function () {
if (!loadedState) {
shouldLoad() ? load() : bindScrollListener();
}
});
var otherProps = DeferredContentBase.getOtherProps(props);
return /*#__PURE__*/React__namespace.createElement("div", _extends({
ref: elementRef
}, otherProps), loadedState && props.children);
});
DeferredContent.displayName = 'DeferredContent';
var DividerBase = {
defaultProps: {
__TYPE: 'Divider',
align: null,
layout: 'horizontal',
type: 'solid',
style: null,
className: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, DividerBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, DividerBase.defaultProps);
}
};
var Divider = /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = DividerBase.getProps(inProps);
var elementRef = React__namespace.useRef(null);
var horizontal = props.layout === 'horizontal';
var vertical = props.layout === 'vertical';
var otherProps = DividerBase.getOtherProps(props);
var className = classNames("p-divider p-component p-divider-".concat(props.layout, " p-divider-").concat(props.type), {
'p-divider-left': horizontal && (!props.align || props.align === 'left'),
'p-divider-right': horizontal && props.align === 'right',
'p-divider-center': horizontal && props.align === 'center' || vertical && (!props.align || props.align === 'center'),
'p-divider-top': vertical && props.align === 'top',
'p-divider-bottom': vertical && props.align === 'bottom'
}, props.className);
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
getElement: function getElement() {
return elementRef.current;
}
};
});
return /*#__PURE__*/React__namespace.createElement("div", _extends({
ref: elementRef,
className: className,
style: props.style,
role: "separator"
}, otherProps), /*#__PURE__*/React__namespace.createElement("div", {
className: "p-divider-content"
}, props.children));
});
Divider.displayName = 'Divider';
var DockBase = {
defaultProps: {
__TYPE: 'Dock',
id: null,
style: null,
className: null,
model: null,
position: 'bottom',
magnification: true,
header: null,
footer: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, DockBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, DockBase.defaultProps);
}
};
var Dock = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = DockBase.getProps(inProps);
var _React$useState = React__namespace.useState(-3),
_React$useState2 = _slicedToArray(_React$useState, 2),
currentIndexState = _React$useState2[0],
setCurrentIndexState = _React$useState2[1];
var elementRef = React__namespace.useRef(null);
var onListMouseLeave = function onListMouseLeave() {
setCurrentIndexState(-3);
};
var onItemMouseEnter = function onItemMouseEnter(index) {
setCurrentIndexState(index);
};
var onItemClick = function onItemClick(e, item) {
if (item.command) {
item.command({
originalEvent: e,
item: item
});
}
e.preventDefault();
};
var createItem = function createItem(item, index) {
if (item.visible === false) {
return null;
}
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': currentIndexState - 2 === index,
'p-dock-item-prev': currentIndexState - 1 === index,
'p-dock-item-current': currentIndexState === index,
'p-dock-item-next': currentIndexState + 1 === index,
'p-dock-item-second-next': currentIndexState + 2 === index
});
var contentClassName = classNames('p-dock-action', {
'p-disabled': disabled
});
var iconClassName = classNames('p-dock-action-icon', _icon);
var icon = IconUtils.getJSXIcon(_icon, {
className: 'p-dock-action-icon'
}, {
props: props
});
var content = /*#__PURE__*/React__namespace.createElement("a", {
href: url || '#',
role: "menuitem",
className: contentClassName,
target: target,
"data-pr-tooltip": label,
onClick: function onClick(e) {
return onItemClick(e, item);
}
}, icon, /*#__PURE__*/React__namespace.createElement(Ripple, null));
if (template) {
var defaultContentOptions = {
onClick: function onClick(e) {
return onItemClick(e, item);
},
className: contentClassName,
iconClassName: iconClassName,
element: content,
props: props,
index: index
};
content = ObjectUtils.getJSXElement(template, item, defaultContentOptions);
}
return /*#__PURE__*/React__namespace.createElement("li", {
key: index,
className: className,
role: "none",
onMouseEnter: function onMouseEnter() {
return onItemMouseEnter(index);
}
}, content);
};
var createItems = function createItems() {
return props.model ? props.model.map(createItem) : null;
};
var createHeader = function createHeader() {
if (props.header) {
var _header = ObjectUtils.getJSXElement(props.header, {
props: props
});
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-dock-header"
}, _header);
}
return null;
};
var createList = function createList() {
var items = createItems();
return /*#__PURE__*/React__namespace.createElement("ul", {
className: "p-dock-list",
role: "menu",
onMouseLeave: onListMouseLeave
}, items);
};
var createFooter = function createFooter() {
if (props.footer) {
var _footer = ObjectUtils.getJSXElement(props.footer, {
props: props
});
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-dock-footer"
}, _footer);
}
return null;
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
getElement: function getElement() {
return elementRef.current;
}
};
});
var otherProps = DockBase.getOtherProps(props);
var className = classNames("p-dock p-component p-dock-".concat(props.position), {
'p-dock-magnification': props.magnification
}, props.className);
var header = createHeader();
var list = createList();
var footer = createFooter();
return /*#__PURE__*/React__namespace.createElement("div", _extends({
id: props.id,
ref: elementRef,
className: className,
style: props.style
}, otherProps), /*#__PURE__*/React__namespace.createElement("div", {
className: "p-dock-container"
}, header, list, footer));
}));
Dock.displayName = 'Dock';
var EditorBase = {
defaultProps: {
__TYPE: 'Editor',
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,
maxLength: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, EditorBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, EditorBase.defaultProps);
}
};
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; }
var QuillJS = function () {
try {
return Quill;
} catch (_unused) {
return null;
}
}();
var Editor = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = EditorBase.getProps(inProps);
var elementRef = React__namespace.useRef(null);
var contentRef = React__namespace.useRef(null);
var toolbarRef = React__namespace.useRef(null);
var quill = React__namespace.useRef(null);
var isQuillLoaded = React__namespace.useRef(false);
useMountEffect(function () {
if (!isQuillLoaded.current) {
var configuration = {
modules: _objectSpread$f({
toolbar: props.showHeader ? toolbarRef.current : false
}, props.modules),
placeholder: props.placeholder,
readOnly: props.readOnly,
theme: props.theme,
formats: props.formats
};
if (QuillJS) {
// GitHub #3097 loaded by script only
quill.current = new Quill(contentRef.current, configuration);
initQuill();
if (quill.current && quill.current.getModule('toolbar')) {
props.onLoad && props.onLoad(quill.current);
}
} else {
import('quill').then(function (module) {
if (module && DomHandler.isExist(contentRef.current)) {
if (module["default"]) {
// webpack
quill.current = new module["default"](contentRef.current, configuration);
} else {
// parceljs
quill.current = new module(contentRef.current, configuration);
}
initQuill();
}
}).then(function () {
if (quill.current && quill.current.getModule('toolbar')) {
props.onLoad && props.onLoad(quill.current);
}
});
}
isQuillLoaded.current = true;
}
});
var initQuill = function initQuill() {
if (props.value) {
quill.current.setContents(quill.current.clipboard.convert(props.value));
}
quill.current.on('text-change', function (delta, oldContents, source) {
var firstChild = contentRef.current.children[0];
var html = firstChild ? firstChild.innerHTML : null;
var text = quill.current.getText();
if (html === '<p><br></p>') {
html = null;
}
// GitHub #2271 prevent infinite loop on clipboard paste of HTML
if (source === 'api') {
var htmlValue = contentRef.current.children[0];
var editorValue = document.createElement('div');
editorValue.innerHTML = props.value || '';
// this is necessary because Quill rearranged style elements
if (DomHandler.isEqualElement(htmlValue, editorValue)) {
return;
}
}
if (props.maxLength) {
var length = quill.current.getLength();
if (length > props.maxLength) {
quill.current.deleteText(props.maxLength, length);
}
}
if (props.onTextChange) {
props.onTextChange({
htmlValue: html,
textValue: text,
delta: delta,
source: source
});
}
});
quill.current.on('selection-change', function (range, oldRange, source) {
if (props.onSelectionChange) {
props.onSelectionChange({
range: range,
oldRange: oldRange,
source: source
});
}
});
};
useUpdateEffect(function () {
if (quill.current && !quill.current.hasFocus()) {
props.value ? quill.current.setContents(quill.current.clipboard.convert(props.value)) : quill.current.setText('');
}
}, [props.value]);
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
getQuill: function getQuill() {
return quill.current;
},
getElement: function getElement() {
return elementRef.current;
},
getContent: function getContent() {
return contentRef.current;
},
getToolbar: function getToolbar() {
return toolbarRef.current;
}
};
});
var createToolbarHeader = function createToolbarHeader() {
if (props.showHeader === false) {
return null;
} else if (props.headerTemplate) {
return /*#__PURE__*/React__namespace.createElement("div", {
ref: toolbarRef,
className: "p-editor-toolbar"
}, props.headerTemplate);
} else {
return /*#__PURE__*/React__namespace.createElement("div", {
ref: toolbarRef,
className: "p-editor-toolbar"
}, /*#__PURE__*/React__namespace.createElement("span", {
className: "ql-formats"
}, /*#__PURE__*/React__namespace.createElement("select", {
className: "ql-header",
defaultValue: "0"
}, /*#__PURE__*/React__namespace.createElement("option", {
value: "1"
}, "Heading"), /*#__PURE__*/React__namespace.createElement("option", {
value: "2"
}, "Subheading"), /*#__PURE__*/React__namespace.createElement("option", {
value: "0"
}, "Normal")), /*#__PURE__*/React__namespace.createElement("select", {
className: "ql-font"
}, /*#__PURE__*/React__namespace.createElement("option", null), /*#__PURE__*/React__namespace.createElement("option", {
value: "serif"
}), /*#__PURE__*/React__namespace.createElement("option", {
value: "monospace"
}))), /*#__PURE__*/React__namespace.createElement("span", {
className: "ql-formats"
}, /*#__PURE__*/React__namespace.createElement("button", {
type: "button",
className: "ql-bold",
"aria-label": "Bold"
}), /*#__PURE__*/React__namespace.createElement("button", {
type: "button",
className: "ql-italic",
"aria-label": "Italic"
}), /*#__PURE__*/React__namespace.createElement("button", {
type: "button",
className: "ql-underline",
"aria-label": "Underline"
})), /*#__PURE__*/React__namespace.createElement("span", {
className: "ql-formats"
}, /*#__PURE__*/React__namespace.createElement("select", {
className: "ql-color"
}), /*#__PURE__*/React__namespace.createElement("select", {
className: "ql-background"
})), /*#__PURE__*/React__namespace.createElement("span", {
className: "ql-formats"
}, /*#__PURE__*/React__namespace.createElement("button", {
type: "button",
className: "ql-list",
value: "ordered",
"aria-label": "Ordered List"
}), /*#__PURE__*/React__namespace.createElement("button", {
type: "button",
className: "ql-list",
value: "bullet",
"aria-label": "Unordered List"
}), /*#__PURE__*/React__namespace.createElement("select", {
className: "ql-align"
}, /*#__PURE__*/React__namespace.createElement("option", {
defaultValue: true
}), /*#__PURE__*/React__namespace.createElement("option", {
value: "center"
}), /*#__PURE__*/React__namespace.createElement("option", {
value: "right"
}), /*#__PURE__*/React__namespace.createElement("option", {
value: "justify"
}))), /*#__PURE__*/React__namespace.createElement("span", {
className: "ql-formats"
}, /*#__PURE__*/React__namespace.createElement("button", {
type: "button",
className: "ql-link",
"aria-label": "Insert Link"
}), /*#__PURE__*/React__namespace.createElement("button", {
type: "button",
className: "ql-image",
"aria-label": "Insert Image"
}), /*#__PURE__*/React__namespace.createElement("button", {
type: "button",
className: "ql-code-block",
"aria-label": "Insert Code Block"
})), /*#__PURE__*/React__namespace.createElement("span", {
className: "ql-formats"
}, /*#__PURE__*/React__namespace.createElement("button", {
type: "button",
className: "ql-clean",
"aria-label": "Remove Styles"
})));
}
};
var otherProps = EditorBase.getOtherProps(props);
var className = classNames('p-component p-editor-container', props.className);
var header = createToolbarHeader();
var content = /*#__PURE__*/React__namespace.createElement("div", {
ref: contentRef,
className: "p-editor-content",
style: props.style
});
return /*#__PURE__*/React__namespace.createElement("div", _extends({
id: props.id,
ref: elementRef,
className: className
}, otherProps), header, content);
}));
Editor.displayName = 'Editor';
var FieldsetBase = {
defaultProps: {
__TYPE: 'Fieldset',
id: null,
legend: null,
className: null,
style: null,
toggleable: null,
collapsed: null,
transitionOptions: null,
onExpand: null,
onCollapse: null,
onToggle: null,
onClick: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, FieldsetBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, FieldsetBase.defaultProps);
}
};
var Fieldset = /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = FieldsetBase.getProps(inProps);
var _React$useState = React__namespace.useState(props.id),
_React$useState2 = _slicedToArray(_React$useState, 2),
idState = _React$useState2[0],
setIdState = _React$useState2[1];
var _React$useState3 = React__namespace.useState(props.collapsed),
_React$useState4 = _slicedToArray(_React$useState3, 2),
collapsedState = _React$useState4[0],
setCollapsedState = _React$useState4[1];
var collapsed = props.toggleable ? props.onToggle ? props.collapsed : collapsedState : false;
var elementRef = React__namespace.useRef(null);
var contentRef = React__namespace.useRef(null);
var headerId = idState + '_header';
var contentId = idState + '_content';
var toggle = function toggle(event) {
if (props.toggleable) {
collapsed ? expand(event) : collapse(event);
if (props.onToggle) {
props.onToggle({
originalEvent: event,
value: !collapsed
});
}
}
event.preventDefault();
};
var expand = function expand(event) {
if (!props.onToggle) {
setCollapsedState(false);
}
props.onExpand && props.onExpand(event);
};
var collapse = function collapse(event) {
if (!props.onToggle) {
setCollapsedState(true);
}
props.onCollapse && props.onCollapse(event);
};
useMountEffect(function () {
if (!props.id) {
setIdState(UniqueComponentId());
}
});
var createContent = function createContent() {
return /*#__PURE__*/React__namespace.createElement(CSSTransition, {
nodeRef: contentRef,
classNames: "p-toggleable-content",
timeout: {
enter: 1000,
exit: 450
},
"in": !collapsed,
unmountOnExit: true,
options: props.transitionOptions
}, /*#__PURE__*/React__namespace.createElement("div", {
ref: contentRef,
id: contentId,
className: "p-toggleable-content",
"aria-hidden": collapsed,
role: "region",
"aria-labelledby": headerId
}, /*#__PURE__*/React__namespace.createElement("div", {
className: "p-fieldset-content"
}, props.children)));
};
var createToggleIcon = function createToggleIcon() {
if (props.toggleable) {
var _className = classNames('p-fieldset-toggler pi', {
'pi-plus': collapsed,
'pi-minus': !collapsed
});
return /*#__PURE__*/React__namespace.createElement("span", {
className: _className
});
}
return null;
};
var createLegendContent = function createLegendContent() {
if (props.toggleable) {
var toggleIcon = createToggleIcon();
return /*#__PURE__*/React__namespace.createElement("a", {
href: '#' + contentId,
"aria-controls": contentId,
id: headerId,
"aria-expanded": !collapsed,
tabIndex: props.toggleable ? null : -1
}, toggleIcon, /*#__PURE__*/React__namespace.createElement("span", {
className: "p-fieldset-legend-text"
}, props.legend), /*#__PURE__*/React__namespace.createElement(Ripple, null));
}
return /*#__PURE__*/React__namespace.createElement("span", {
className: "p-fieldset-legend-text",
id: headerId
}, props.legend);
};
var createLegend = function createLegend() {
if (props.legend != null || props.toggleable) {
var legendContent = createLegendContent();
return /*#__PURE__*/React__namespace.createElement("legend", {
className: "p-fieldset-legend p-unselectable-text",
onClick: toggle
}, legendContent);
}
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
getElement: function getElement() {
return elementRef.current;
},
getContent: function getContent() {
return contentRef.current;
}
};
});
var otherProps = FieldsetBase.getOtherProps(props);
var className = classNames('p-fieldset p-component', {
'p-fieldset-toggleable': props.toggleable
}, props.className);
var legend = createLegend();
var content = createContent();
return /*#__PURE__*/React__namespace.createElement("fieldset", _extends({
id: idState,
ref: elementRef,
className: className,
style: props.style
}, otherProps, {
onClick: props.onClick
}), legend, content);
});
Fieldset.displayName = 'Fieldset';
function _readOnlyError(name) {
throw new TypeError("\"" + name + "\" is read-only");
}
var MessagesBase = {
defaultProps: {
__TYPE: 'Messages',
id: null,
className: null,
style: null,
transitionOptions: null,
onRemove: null,
onClick: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, MessagesBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, MessagesBase.defaultProps);
}
};
var UIMessage = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (props, ref) {
var _props$message = props.message,
severity = _props$message.severity,
content = _props$message.content,
summary = _props$message.summary,
detail = _props$message.detail,
closable = _props$message.closable,
life = _props$message.life,
sticky = _props$message.sticky,
icon = _props$message.icon;
var _useTimeout = useTimeout(function () {
onClose(null);
}, life || 3000, !sticky),
_useTimeout2 = _slicedToArray(_useTimeout, 1),
clearTimer = _useTimeout2[0];
var onClose = function onClose(event) {
clearTimer();
props.onClose && props.onClose(props.message);
if (event) {
event.preventDefault();
event.stopPropagation();
}
};
var onClick = function onClick() {
props.onClick && props.onClick(props.message);
};
var createCloseIcon = function createCloseIcon() {
if (closable !== false) {
var ariaLabel = localeOption('close');
return /*#__PURE__*/React__namespace.createElement("button", {
type: "button",
className: "p-message-close p-link",
"aria-label": ariaLabel,
onClick: onClose
}, /*#__PURE__*/React__namespace.createElement("i", {
className: "p-message-close-icon pi pi-times",
"aria-hidden": "true"
}), /*#__PURE__*/React__namespace.createElement(Ripple, null));
}
return null;
};
var createMessage = function createMessage() {
if (props.message) {
var iconValue = icon;
if (!iconValue) {
iconValue = classNames('pi', {
'pi-info-circle': severity === 'info',
'pi-exclamation-triangle': severity === 'warn',
'pi-times-circle': severity === 'error',
'pi-check': severity === 'success'
});
}
var iconContent = IconUtils.getJSXIcon(iconValue, {
className: 'p-message-icon'
}, {
props: props
});
return content || /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, iconContent, /*#__PURE__*/React__namespace.createElement("span", {
className: "p-message-summary"
}, summary), /*#__PURE__*/React__namespace.createElement("span", {
className: "p-message-detail"
}, detail));
}
return null;
};
var className = classNames('p-message p-component p-message-' + severity);
var closeIcon = createCloseIcon();
var message = createMessage();
return /*#__PURE__*/React__namespace.createElement("div", {
ref: ref,
className: className,
onClick: onClick
}, /*#__PURE__*/React__namespace.createElement("div", {
className: "p-message-wrapper"
}, message, closeIcon));
}));
UIMessage.displayName = 'UIMessage';
var messageIdx$1 = 0;
var Messages = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = MessagesBase.getProps(inProps);
var _React$useState = React__namespace.useState([]),
_React$useState2 = _slicedToArray(_React$useState, 2),
messagesState = _React$useState2[0],
setMessagesState = _React$useState2[1];
var elementRef = React__namespace.useRef(null);
var show = function show(value) {
if (value) {
var messages = assignIdentifiers(value, true);
if (Array.isArray(value)) {
for (var i = 0; i < value.length; i++) {
value[i].id = messageIdx$1++;
messages = [].concat(_toConsumableArray(messagesState), _toConsumableArray(value));
}
} else {
value.id = messageIdx$1++;
messages = messagesState ? [].concat(_toConsumableArray(messagesState), [value]) : [value];
}
setMessagesState(messages);
}
};
var assignIdentifiers = function assignIdentifiers(value, copy) {
var messages;
if (Array.isArray(value)) {
for (var i = 0; i < value.length; i++) {
value[i].id = messageIdx$1++;
if (copy) {
messages = [].concat(_toConsumableArray(messagesState), _toConsumableArray(value));
} else {
messages = value;
}
}
} else {
value.id = messageIdx$1++;
if (copy) {
messages = messagesState ? [].concat(_toConsumableArray(messagesState), [value]) : [value];
} else {
messages = [value];
}
}
return messages;
};
var clear = function clear() {
setMessagesState([]);
};
var replace = function replace(value) {
var replaced = assignIdentifiers(value, false);
setMessagesState(replaced);
};
var onClose = function onClose(message) {
setMessagesState(messagesState.filter(function (msg) {
return msg.id !== message.id;
}));
props.onRemove && props.onRemove(message);
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
show: show,
replace: replace,
clear: clear,
getElement: function getElement() {
return elementRef.current;
}
};
});
var otherProps = MessagesBase.getOtherProps(props);
return /*#__PURE__*/React__namespace.createElement("div", _extends({
id: props.id,
ref: elementRef,
className: props.className,
style: props.style
}, otherProps), /*#__PURE__*/React__namespace.createElement(reactTransitionGroup.TransitionGroup, null, messagesState && messagesState.map(function (message) {
var messageRef = /*#__PURE__*/React__namespace.createRef();
return /*#__PURE__*/React__namespace.createElement(CSSTransition, {
nodeRef: messageRef,
key: message.id,
classNames: "p-message",
unmountOnExit: true,
timeout: {
enter: 300,
exit: 300
},
options: props.transitionOptions
}, /*#__PURE__*/React__namespace.createElement(UIMessage, {
ref: messageRef,
message: message,
onClick: props.onClick,
onClose: onClose
}));
})));
}));
Messages.displayName = 'Messages';
var ProgressBarBase = {
defaultProps: {
__TYPE: 'ProgressBar',
id: null,
value: null,
showValue: true,
unit: '%',
style: null,
className: null,
mode: 'determinate',
displayValueTemplate: null,
color: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, ProgressBarBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, ProgressBarBase.defaultProps);
}
};
var ProgressBar = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = ProgressBarBase.getProps(inProps);
var elementRef = React__namespace.useRef(null);
var createLabel = function createLabel() {
if (props.showValue && props.value != null) {
var label = props.displayValueTemplate ? props.displayValueTemplate(props.value) : props.value + props.unit;
return label;
}
return null;
};
var createDeterminate = function createDeterminate() {
var otherProps = ProgressBarBase.getOtherProps(props);
var className = classNames('p-progressbar p-component p-progressbar-determinate', props.className);
var label = createLabel();
return /*#__PURE__*/React__namespace.createElement("div", _extends({
role: "progressbar",
id: props.id,
ref: elementRef,
className: className,
style: props.style,
"aria-valuemin": "0",
"aria-valuenow": props.value,
"aria-valuemax": "100"
}, otherProps), /*#__PURE__*/React__namespace.createElement("div", {
className: "p-progressbar-value p-progressbar-value-animate",
style: {
width: props.value + '%',
display: 'flex',
backgroundColor: props.color
}
}, props.value != null && props.value !== 0 && props.showValue && /*#__PURE__*/React__namespace.createElement("div", {
className: "p-progressbar-label"
}, label)));
};
var createIndeterminate = function createIndeterminate() {
var otherProps = ProgressBarBase.getOtherProps(props);
var className = classNames('p-progressbar p-component p-progressbar-indeterminate', props.className);
return /*#__PURE__*/React__namespace.createElement("div", _extends({
role: "progressbar",
id: props.id,
ref: elementRef,
className: className,
style: props.style
}, otherProps), /*#__PURE__*/React__namespace.createElement("div", {
className: "p-progressbar-indeterminate-container"
}, /*#__PURE__*/React__namespace.createElement("div", {
className: "p-progressbar-value p-progressbar-value-animate",
style: {
backgroundColor: props.color
}
})));
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
getElement: function getElement() {
return elementRef.current;
}
};
});
if (props.mode === 'determinate') return createDeterminate();else if (props.mode === 'indeterminate') return createIndeterminate();else throw new Error(props.mode + " is not a valid mode for the ProgressBar. Valid values are 'determinate' and 'indeterminate'");
}));
ProgressBar.displayName = 'ProgressBar';
var FileUploadBase = {
defaultProps: {
__TYPE: 'FileUpload',
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,
onBeforeDrop: null,
onBeforeSelect: null,
onUpload: null,
onError: null,
onClear: null,
onSelect: null,
onProgress: null,
onValidationFail: null,
uploadHandler: null,
onRemove: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, FileUploadBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, FileUploadBase.defaultProps);
}
};
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; }
var FileUpload = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = FileUploadBase.getProps(inProps);
var _React$useState = React__namespace.useState([]),
_React$useState2 = _slicedToArray(_React$useState, 2),
uploadedFilesState = _React$useState2[0],
setUploadedFilesState = _React$useState2[1];
var _React$useState3 = React__namespace.useState([]),
_React$useState4 = _slicedToArray(_React$useState3, 2),
filesState = _React$useState4[0],
setFilesState = _React$useState4[1];
var _React$useState5 = React__namespace.useState(0),
_React$useState6 = _slicedToArray(_React$useState5, 2),
progressState = _React$useState6[0],
setProgressState = _React$useState6[1];
var _React$useState7 = React__namespace.useState(false),
_React$useState8 = _slicedToArray(_React$useState7, 2),
focusedState = _React$useState8[0],
setFocusedState = _React$useState8[1];
var _React$useState9 = React__namespace.useState(false),
_React$useState10 = _slicedToArray(_React$useState9, 2),
uploadingState = _React$useState10[0],
setUploadingState = _React$useState10[1];
var fileInputRef = React__namespace.useRef(null);
var messagesRef = React__namespace.useRef(null);
var contentRef = React__namespace.useRef(null);
var duplicateIEEvent = React__namespace.useRef(false);
var uploadedFileCount = React__namespace.useRef(0);
var hasFiles = ObjectUtils.isNotEmpty(filesState);
var hasUploadedFiles = ObjectUtils.isNotEmpty(uploadedFilesState);
var disabled = props.disabled || uploadingState;
var chooseButtonLabel = props.chooseLabel || props.chooseOptions.label || localeOption('choose');
var uploadButtonLabel = props.uploadLabel || props.uploadOptions.label || localeOption('upload');
var cancelButtonLabel = props.cancelLabel || props.cancelOptions.label || localeOption('cancel');
var chooseDisabled = disabled || props.fileLimit && props.fileLimit <= filesState.length + uploadedFileCount;
var uploadDisabled = disabled || !hasFiles;
var cancelDisabled = disabled || !hasFiles;
var isImage = function isImage(file) {
return /^image\//.test(file.type);
};
var remove = function remove(event, index) {
clearInput();
var currentFiles = _toConsumableArray(filesState);
var removedFile = filesState[index];
currentFiles.splice(index, 1);
setFilesState(currentFiles);
if (props.onRemove) {
props.onRemove({
originalEvent: event,
file: removedFile
});
}
};
var removeUploadedFiles = function removeUploadedFiles(event, index) {
clearInput();
var currentUploadedFiles = _toConsumableArray(uploadedFilesState);
var removedFile = filesState[index];
currentUploadedFiles.splice(index, 1);
setUploadedFilesState(currentUploadedFiles);
if (props.onRemove) {
props.onRemove({
originalEvent: event,
file: removedFile
});
}
};
var clearInput = function clearInput() {
if (fileInputRef.current) {
fileInputRef.current.value = '';
}
};
var clearIEInput = function clearIEInput() {
if (fileInputRef.current) {
duplicateIEEvent.current = true; //IE11 fix to prevent onFileChange trigger again
fileInputRef.current.value = '';
}
};
var formatSize = 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];
};
var onFileSelect = function onFileSelect(event) {
// give caller a chance to stop the selection
if (props.onBeforeSelect && props.onBeforeSelect({
originalEvent: event,
files: filesState
}) === false) {
return;
}
if (event.type !== 'drop' && isIE11() && duplicateIEEvent.current) {
duplicateIEEvent.current = false;
return;
}
var currentFiles = [];
if (props.multiple) {
currentFiles = filesState ? _toConsumableArray(filesState) : [];
}
var selectedFiles = event.dataTransfer ? event.dataTransfer.files : event.target.files;
for (var i = 0; i < selectedFiles.length; i++) {
var file = selectedFiles[i];
if (!isFileSelected(file) && validate(file)) {
if (isImage(file)) {
file.objectURL = window.URL.createObjectURL(file);
}
currentFiles.push(file);
}
}
setFilesState(currentFiles);
if (ObjectUtils.isNotEmpty(currentFiles) && props.auto) {
upload(currentFiles);
}
if (props.onSelect) {
props.onSelect({
originalEvent: event,
files: selectedFiles
});
}
if (event.type !== 'drop' && isIE11()) {
clearIEInput();
} else {
clearInput();
}
if (props.mode === 'basic' && currentFiles.length > 0) {
fileInputRef.current.style.display = 'none';
}
};
var isFileSelected = function isFileSelected(file) {
return filesState.some(function (f) {
return f.name + f.type + f.size === file.name + file.type + file.size;
});
};
var isIE11 = function isIE11() {
return !!window['MSInputMethodContext'] && !!document['documentMode'];
};
var validate = function validate(file) {
if (props.maxFileSize && file.size > props.maxFileSize) {
var message = {
severity: 'error',
summary: props.invalidFileSizeMessageSummary.replace('{0}', file.name),
detail: props.invalidFileSizeMessageDetail.replace('{0}', formatSize(props.maxFileSize)),
sticky: true
};
if (props.mode === 'advanced') {
messagesRef.current.show(message);
}
props.onValidationFail && props.onValidationFail(file);
return false;
}
return true;
};
var upload = function upload(files) {
files = files || filesState;
if (files && files.nativeEvent) {
files = filesState;
}
if (props.customUpload) {
if (props.fileLimit) {
uploadedFileCount + files.length, _readOnlyError("uploadedFileCount");
}
if (props.uploadHandler) {
props.uploadHandler({
files: files,
options: {
clear: clear,
props: props
}
});
}
} else {
setUploadingState(true);
var xhr = new XMLHttpRequest();
var formData = new FormData();
if (props.onBeforeUpload) {
props.onBeforeUpload({
xhr: xhr,
formData: formData
});
}
var _iterator = _createForOfIteratorHelper$9(files),
_step;
try {
for (_iterator.s(); !(_step = _iterator.n()).done;) {
var file = _step.value;
formData.append(props.name, file, file.name);
}
} catch (err) {
_iterator.e(err);
} finally {
_iterator.f();
}
xhr.upload.addEventListener('progress', function (event) {
if (event.lengthComputable) {
var progress = Math.round(event.loaded * 100 / event.total);
setProgressState(progress);
if (props.onProgress) {
props.onProgress({
originalEvent: event,
progress: progress
});
}
}
});
xhr.onreadystatechange = function () {
if (xhr.readyState === 4) {
setProgressState(0);
setUploadingState(false);
if (xhr.status >= 200 && xhr.status < 300) {
if (props.fileLimit) {
uploadedFileCount + files.length, _readOnlyError("uploadedFileCount");
}
if (props.onUpload) {
props.onUpload({
xhr: xhr,
files: files
});
}
} else {
if (props.onError) {
props.onError({
xhr: xhr,
files: files
});
}
}
setUploadedFilesState(function (prevUploadedFiles) {
return [].concat(_toConsumableArray(prevUploadedFiles), _toConsumableArray(files));
});
clear();
}
};
xhr.open('POST', props.url, true);
if (props.onBeforeSend) {
props.onBeforeSend({
xhr: xhr,
formData: formData
});
}
xhr.withCredentials = props.withCredentials;
xhr.send(formData);
}
};
var clear = function clear() {
setFilesState([]);
setUploadingState(false);
props.onClear && props.onClear();
clearInput();
};
var choose = function choose() {
fileInputRef.current.click();
};
var onFocus = function onFocus() {
setFocusedState(true);
};
var onBlur = function onBlur() {
setFocusedState(false);
};
var onKeyDown = function onKeyDown(event) {
if (event.which === 13) {
// enter
choose();
}
};
var onDragEnter = function onDragEnter(event) {
if (!disabled) {
event.dataTransfer.dropEffect = 'copy';
event.stopPropagation();
event.preventDefault();
}
};
var onDragOver = function onDragOver(event) {
if (!disabled) {
event.dataTransfer.dropEffect = 'copy';
DomHandler.addClass(contentRef.current, 'p-fileupload-highlight');
event.stopPropagation();
event.preventDefault();
}
};
var onDragLeave = function onDragLeave(event) {
if (!disabled) {
event.dataTransfer.dropEffect = 'copy';
DomHandler.removeClass(contentRef.current, 'p-fileupload-highlight');
}
};
var onDrop = function onDrop(event) {
if (props.disabled) {
return;
}
DomHandler.removeClass(contentRef.current, 'p-fileupload-highlight');
event.stopPropagation();
event.preventDefault();
// give caller a chance to stop the drop
if (props.onBeforeDrop && props.onBeforeDrop(event) === false) {
return;
}
var files = event.dataTransfer ? event.dataTransfer.files : event.target.files;
var allowDrop = props.multiple || ObjectUtils.isEmpty(filesState) && files && files.length === 1;
allowDrop && onFileSelect(event);
};
var onSimpleUploaderClick = function onSimpleUploaderClick() {
!disabled && hasFiles ? upload() : fileInputRef.current.click();
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
upload: upload,
clear: clear,
formatSize: formatSize,
onFileSelect: onFileSelect,
getInput: function getInput() {
return fileInputRef.current;
},
getContent: function getContent() {
return contentRef.current;
},
getFiles: function getFiles() {
return filesState;
},
setFiles: function setFiles(files) {
return setFilesState(files || []);
}
};
});
var createChooseButton = function createChooseButton() {
var _props$chooseOptions = props.chooseOptions,
className = _props$chooseOptions.className,
style = _props$chooseOptions.style,
_icon = _props$chooseOptions.icon,
iconOnly = _props$chooseOptions.iconOnly;
var chooseClassName = classNames('p-button p-fileupload-choose p-component', {
'p-disabled': disabled,
'p-focus': focusedState,
'p-button-icon-only': iconOnly
}, className);
var labelClassName = 'p-button-label p-clickable';
var label = iconOnly ? /*#__PURE__*/React__namespace.createElement("span", {
className: labelClassName,
dangerouslySetInnerHTML: {
__html: ' '
}
}) : /*#__PURE__*/React__namespace.createElement("span", {
className: labelClassName
}, chooseButtonLabel);
var input = /*#__PURE__*/React__namespace.createElement("input", {
ref: fileInputRef,
type: "file",
onChange: onFileSelect,
multiple: props.multiple,
accept: props.accept,
disabled: chooseDisabled
});
var icon = IconUtils.getJSXIcon(_icon || 'pi pi-fw pi-plus', {
className: 'p-button-icon p-button-icon-left p-clickable'
}, {
props: props
});
return /*#__PURE__*/React__namespace.createElement("span", {
className: chooseClassName,
style: style,
onClick: choose,
onKeyDown: onKeyDown,
onFocus: onFocus,
onBlur: onBlur,
tabIndex: 0
}, input, icon, label, /*#__PURE__*/React__namespace.createElement(Ripple, null));
};
var onRemoveClick = function onRemoveClick(e, badgeOptions, index) {
if (badgeOptions.severity === 'warning') remove(e, index);else removeUploadedFiles(e, index);
};
var createFile = function createFile(file, index, badgeOptions) {
var key = file.name + file.type + file.size;
var preview = isImage(file) ? /*#__PURE__*/React__namespace.createElement("img", {
role: "presentation",
className: "p-fileupload-file-thumbnail",
alt: file.name,
src: file.objectURL,
width: props.previewWidth
}) : null;
var fileName = /*#__PURE__*/React__namespace.createElement("div", {
className: "p-fileupload-filename"
}, file.name);
var size = /*#__PURE__*/React__namespace.createElement("div", null, formatSize(file.size));
var contentBody = /*#__PURE__*/React__namespace.createElement("div", null, /*#__PURE__*/React__namespace.createElement("div", null, " ", file.name), /*#__PURE__*/React__namespace.createElement("span", null, formatSize(file.size)), /*#__PURE__*/React__namespace.createElement(Badge, {
className: "p-fileupload-file-badge",
value: badgeOptions.value,
severity: badgeOptions.severity
}));
var removeButton = /*#__PURE__*/React__namespace.createElement("div", null, /*#__PURE__*/React__namespace.createElement(Button, {
type: "button",
icon: "pi pi-times",
className: "p-button-danger p-button-text p-button-rounded",
onClick: function onClick(e) {
return onRemoveClick(e, badgeOptions, index);
},
disabled: disabled
}));
var content = /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, preview, contentBody, removeButton);
if (props.itemTemplate) {
var defaultContentOptions = {
onRemove: function onRemove(event) {
return remove(event, index);
},
previewElement: preview,
fileNameElement: fileName,
sizeElement: size,
removeElement: removeButton,
formatSize: formatSize(file.size),
element: content,
index: index,
props: props
};
content = ObjectUtils.getJSXElement(props.itemTemplate, file, defaultContentOptions);
}
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-fileupload-row",
key: key
}, content);
};
var createFiles = function createFiles() {
var badgeOptions = {
severity: 'warning',
value: 'Pending'
};
var content = filesState.map(function (file, index) {
return createFile(file, index, badgeOptions);
});
return /*#__PURE__*/React__namespace.createElement("div", null, content);
};
var createUploadedFiles = function createUploadedFiles() {
var badgeOptions = {
severity: 'success',
value: 'Completed'
};
var content = uploadedFilesState && uploadedFilesState.map(function (file, index) {
return createFile(file, index, badgeOptions);
});
return /*#__PURE__*/React__namespace.createElement("div", null, content);
};
var createEmptyContent = function createEmptyContent() {
return props.emptyTemplate && !hasFiles && !hasUploadedFiles ? ObjectUtils.getJSXElement(props.emptyTemplate, props) : null;
};
var createProgressBarContent = function createProgressBarContent() {
if (props.progressBarTemplate) {
return ObjectUtils.getJSXElement(props.progressBarTemplate, props);
}
return /*#__PURE__*/React__namespace.createElement(ProgressBar, {
value: progressState,
showValue: false
});
};
var createAdvanced = function createAdvanced() {
var otherProps = FileUploadBase.getOtherProps(props);
var className = classNames('p-fileupload p-fileupload-advanced p-component', props.className);
var headerClassName = classNames('p-fileupload-buttonbar', props.headerClassName);
var contentClassName = classNames('p-fileupload-content', props.contentClassName);
var chooseButton = createChooseButton();
var emptyContent = createEmptyContent();
var uploadButton, cancelButton, filesList, uplaodedFilesList, progressBar;
if (!props.auto) {
var uploadOptions = props.uploadOptions;
var cancelOptions = props.cancelOptions;
var uploadLabel = !uploadOptions.iconOnly ? uploadButtonLabel : '';
var cancelLabel = !cancelOptions.iconOnly ? cancelButtonLabel : '';
uploadButton = /*#__PURE__*/React__namespace.createElement(Button, {
type: "button",
label: uploadLabel,
icon: uploadOptions.icon || 'pi pi-upload',
onClick: upload,
disabled: uploadDisabled,
style: uploadOptions.style,
className: uploadOptions.className
});
cancelButton = /*#__PURE__*/React__namespace.createElement(Button, {
type: "button",
label: cancelLabel,
icon: cancelOptions.icon || 'pi pi-times',
onClick: clear,
disabled: cancelDisabled,
style: cancelOptions.style,
className: cancelOptions.className
});
}
if (hasFiles) {
filesList = createFiles();
progressBar = createProgressBarContent();
}
if (hasUploadedFiles) {
uplaodedFilesList = createUploadedFiles();
}
var header = /*#__PURE__*/React__namespace.createElement("div", {
className: headerClassName,
style: props.headerStyle
}, chooseButton, uploadButton, cancelButton);
if (props.headerTemplate) {
var defaultContentOptions = {
className: headerClassName,
chooseButton: chooseButton,
uploadButton: uploadButton,
cancelButton: cancelButton,
element: header,
props: props
};
header = ObjectUtils.getJSXElement(props.headerTemplate, defaultContentOptions);
}
return /*#__PURE__*/React__namespace.createElement("div", _extends({
id: props.id,
className: className,
style: props.style
}, otherProps), header, /*#__PURE__*/React__namespace.createElement("div", {
ref: contentRef,
className: contentClassName,
style: props.contentStyle,
onDragEnter: onDragEnter,
onDragOver: onDragOver,
onDragLeave: onDragLeave,
onDrop: onDrop
}, progressBar, /*#__PURE__*/React__namespace.createElement(Messages, {
ref: messagesRef
}), hasFiles ? filesList : null, hasUploadedFiles ? uplaodedFilesList : null, emptyContent));
};
var createBasic = function createBasic() {
var chooseOptions = props.chooseOptions;
var otherProps = FileUploadBase.getOtherProps(props);
var className = classNames('p-fileupload p-fileupload-basic p-component', props.className);
var buttonClassName = classNames('p-button p-component p-fileupload-choose', {
'p-fileupload-choose-selected': hasFiles,
'p-disabled': disabled,
'p-focus': focusedState
}, chooseOptions.className);
var chooseIcon = chooseOptions.icon || classNames({
'pi pi-plus': !chooseOptions.icon && (!hasFiles || props.auto),
'pi pi-upload': !chooseOptions.icon && hasFiles && !props.auto
});
var labelClassName = 'p-button-label p-clickable';
var chooseLabel = chooseOptions.iconOnly ? /*#__PURE__*/React__namespace.createElement("span", {
className: labelClassName,
dangerouslySetInnerHTML: {
__html: ' '
}
}) : /*#__PURE__*/React__namespace.createElement("span", {
className: labelClassName
}, chooseButtonLabel);
var label = props.auto ? chooseLabel : /*#__PURE__*/React__namespace.createElement("span", {
className: labelClassName
}, hasFiles ? filesState[0].name : chooseLabel);
var icon = IconUtils.getJSXIcon(chooseIcon, {
className: 'p-button-icon p-button-icon-left'
}, {
props: props,
hasFiles: hasFiles
});
var input = !hasFiles && /*#__PURE__*/React__namespace.createElement("input", {
ref: fileInputRef,
type: "file",
accept: props.accept,
multiple: props.multiple,
disabled: disabled,
onChange: onFileSelect
});
return /*#__PURE__*/React__namespace.createElement("div", _extends({
className: className,
style: props.style
}, otherProps), /*#__PURE__*/React__namespace.createElement(Messages, {
ref: messagesRef
}), /*#__PURE__*/React__namespace.createElement("span", {
className: buttonClassName,
style: chooseOptions.style,
onMouseUp: onSimpleUploaderClick,
onKeyDown: onKeyDown,
onFocus: onFocus,
onBlur: onBlur,
tabIndex: 0
}, icon, label, input, /*#__PURE__*/React__namespace.createElement(Ripple, null)));
};
if (props.mode === 'advanced') return createAdvanced();else if (props.mode === 'basic') return createBasic();
}));
FileUpload.displayName = 'FileUpload';
var GalleriaBase = {
defaultProps: {
__TYPE: 'Galleria',
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,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, GalleriaBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, GalleriaBase.defaultProps);
}
};
var GalleriaItem = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (props, ref) {
var next = function next() {
var nextItemIndex = props.activeItemIndex + 1;
props.onActiveItemChange({
index: props.circular && props.value.length - 1 === props.activeItemIndex ? 0 : nextItemIndex
});
};
var prev = function prev() {
var prevItemIndex = props.activeItemIndex !== 0 ? props.activeItemIndex - 1 : 0;
props.onActiveItemChange({
index: props.circular && props.activeItemIndex === 0 ? props.value.length - 1 : prevItemIndex
});
};
var stopSlideShow = function stopSlideShow() {
if (props.slideShowActive && props.stopSlideShow) {
props.stopSlideShow();
}
};
var navBackward = function navBackward(e) {
stopSlideShow();
prev();
if (e && e.cancelable) {
e.preventDefault();
}
};
var navForward = function navForward(e) {
stopSlideShow();
next();
if (e && e.cancelable) {
e.preventDefault();
}
};
var onIndicatorClick = function onIndicatorClick(index) {
stopSlideShow();
props.onActiveItemChange({
index: index
});
};
var onIndicatorMouseEnter = function onIndicatorMouseEnter(index) {
if (props.changeItemOnIndicatorHover) {
stopSlideShow();
props.onActiveItemChange({
index: index
});
}
};
var onIndicatorKeyDown = function onIndicatorKeyDown(event, index) {
if (event.which === 13) {
stopSlideShow();
props.onActiveItemChange({
index: index
});
}
};
useMountEffect(function () {
if (props.autoPlay) {
props.startSlideShow();
}
});
var createBackwardNavigator = function createBackwardNavigator() {
if (props.showItemNavigators) {
var isDisabled = !props.circular && props.activeItemIndex === 0;
var buttonClassName = classNames('p-galleria-item-prev p-galleria-item-nav p-link', {
'p-disabled': isDisabled
});
return /*#__PURE__*/React__namespace.createElement("button", {
type: "button",
className: buttonClassName,
onClick: navBackward,
disabled: isDisabled
}, /*#__PURE__*/React__namespace.createElement("span", {
className: "p-galleria-item-prev-icon pi pi-chevron-left"
}), /*#__PURE__*/React__namespace.createElement(Ripple, null));
}
return null;
};
var createForwardNavigator = function createForwardNavigator() {
if (props.showItemNavigators) {
var isDisabled = !props.circular && props.activeItemIndex === props.value.length - 1;
var buttonClassName = classNames('p-galleria-item-next p-galleria-item-nav p-link', {
'p-disabled': isDisabled
});
return /*#__PURE__*/React__namespace.createElement("button", {
type: "button",
className: buttonClassName,
onClick: navForward,
disabled: isDisabled
}, /*#__PURE__*/React__namespace.createElement("span", {
className: "p-galleria-item-next-icon pi pi-chevron-right"
}), /*#__PURE__*/React__namespace.createElement(Ripple, null));
}
return null;
};
var createCaption = function createCaption() {
if (props.caption) {
var _content = props.caption(props.value[props.activeItemIndex]);
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-galleria-caption"
}, _content);
}
return null;
};
var createIndicator = function createIndicator(index) {
var key = 'p-galleria-indicator-' + index;
var isActive = props.activeItemIndex === index;
var className = classNames('p-galleria-indicator', {
'p-highlight': isActive
});
var indicator = props.indicator && props.indicator(index);
if (!indicator) {
indicator = /*#__PURE__*/React__namespace.createElement("button", {
type: "button",
tabIndex: -1,
className: "p-link"
}, /*#__PURE__*/React__namespace.createElement(Ripple, null));
}
return /*#__PURE__*/React__namespace.createElement("li", {
className: className,
key: key,
tabIndex: 0,
onClick: function onClick() {
return onIndicatorClick(index);
},
onMouseEnter: function onMouseEnter() {
return onIndicatorMouseEnter(index);
},
onKeyDown: function onKeyDown(e) {
return onIndicatorKeyDown(e, index);
}
}, indicator);
};
var createIndicators = function createIndicators() {
if (props.showIndicators) {
var className = classNames('p-galleria-indicators p-reset', props.indicatorsContentClassName);
var _indicators = [];
for (var i = 0; i < props.value.length; i++) {
_indicators.push(createIndicator(i));
}
return /*#__PURE__*/React__namespace.createElement("ul", {
className: className
}, _indicators);
}
return null;
};
var content = props.itemTemplate && props.itemTemplate(props.value[props.activeItemIndex]);
var backwardNavigator = createBackwardNavigator();
var forwardNavigator = createForwardNavigator();
var caption = createCaption();
var indicators = createIndicators();
return /*#__PURE__*/React__namespace.createElement("div", {
ref: ref,
className: "p-galleria-item-wrapper"
}, /*#__PURE__*/React__namespace.createElement("div", {
className: "p-galleria-item-container"
}, backwardNavigator, /*#__PURE__*/React__namespace.createElement("div", {
className: "p-galleria-item"
}, content), forwardNavigator, caption), indicators);
}));
GalleriaItem.displayName = 'GalleriaItem';
var GalleriaThumbnailItem = /*#__PURE__*/React__namespace.memo(function (props) {
var onItemClick = function onItemClick(event) {
props.onItemClick({
originalEvent: event,
index: props.index
});
};
var onItemKeyDown = function onItemKeyDown(event) {
if (event.which === 13) {
props.onItemClick({
originalEvent: event,
index: props.index
});
}
};
var tabIndex = props.active ? 0 : null;
var content = props.template && props.template(props.item);
var className = classNames('p-galleria-thumbnail-item', {
'p-galleria-thumbnail-item-current': props.current,
'p-galleria-thumbnail-item-active': props.active,
'p-galleria-thumbnail-item-start': props.start,
'p-galleria-thumbnail-item-end': props.end
}, props.className);
return /*#__PURE__*/React__namespace.createElement("div", {
className: className
}, /*#__PURE__*/React__namespace.createElement("div", {
className: "p-galleria-thumbnail-item-content",
tabIndex: tabIndex,
onClick: onItemClick,
onKeyDown: onItemKeyDown
}, content));
});
var GalleriaThumbnails = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (props, ref) {
var _React$useState = React__namespace.useState(props.numVisible),
_React$useState2 = _slicedToArray(_React$useState, 2),
numVisibleState = _React$useState2[0],
setNumVisibleState = _React$useState2[1];
var _React$useState3 = React__namespace.useState(0),
_React$useState4 = _slicedToArray(_React$useState3, 2),
totalShiftedItemsState = _React$useState4[0],
setTotalShiftedItemsState = _React$useState4[1];
var itemsContainerRef = React__namespace.useRef(null);
var startPos = React__namespace.useRef(null);
var attributeSelector = React__namespace.useRef('');
var thumbnailsStyle = React__namespace.useRef(null);
var responsiveOptions = React__namespace.useRef(null);
var prevNumVisible = usePrevious(numVisibleState);
var prevActiveItemIndex = usePrevious(props.activeItemIndex);
var _useResizeListener = useResizeListener({
listener: function listener() {
calculatePosition();
},
when: props.responsiveOptions
}),
_useResizeListener2 = _slicedToArray(_useResizeListener, 1),
bindWindowResizeListener = _useResizeListener2[0];
var step = function step(dir) {
var totalShiftedItems = totalShiftedItemsState + dir;
if (dir < 0 && -1 * totalShiftedItems + numVisibleState > props.value.length - 1) {
totalShiftedItems = numVisibleState - props.value.length;
} else if (dir > 0 && totalShiftedItems > 0) {
totalShiftedItems = 0;
}
if (props.circular) {
if (dir < 0 && props.value.length - 1 === props.activeItemIndex) {
totalShiftedItems = 0;
} else if (dir > 0 && props.activeItemIndex === 0) {
totalShiftedItems = numVisibleState - props.value.length;
}
}
if (itemsContainerRef.current) {
DomHandler.removeClass(itemsContainerRef.current, 'p-items-hidden');
itemsContainerRef.current.style.transform = props.isVertical ? "translate3d(0, ".concat(totalShiftedItems * (100 / numVisibleState), "%, 0)") : "translate3d(".concat(totalShiftedItems * (100 / numVisibleState), "%, 0, 0)");
itemsContainerRef.current.style.transition = 'transform 500ms ease 0s';
}
setTotalShiftedItemsState(totalShiftedItems);
};
var stopSlideShow = function stopSlideShow() {
if (props.slideShowActive && props.stopSlideShow) {
props.stopSlideShow();
}
};
var getMedianItemIndex = function getMedianItemIndex() {
var index = Math.floor(numVisibleState / 2);
return numVisibleState % 2 ? index : index - 1;
};
var navBackward = function navBackward(e) {
stopSlideShow();
var prevItemIndex = props.activeItemIndex !== 0 ? props.activeItemIndex - 1 : 0;
var diff = prevItemIndex + totalShiftedItemsState;
if (numVisibleState - diff - 1 > getMedianItemIndex() && (-1 * totalShiftedItemsState !== 0 || props.circular)) {
step(1);
}
props.onActiveItemChange({
index: props.circular && props.activeItemIndex === 0 ? props.value.length - 1 : prevItemIndex
});
if (e.cancelable) {
e.preventDefault();
}
};
var navForward = function navForward(e) {
stopSlideShow();
var nextItemIndex = props.activeItemIndex + 1;
if (nextItemIndex + totalShiftedItemsState > getMedianItemIndex() && (-1 * totalShiftedItemsState < getTotalPageNumber() - 1 || props.circular)) {
step(-1);
}
props.onActiveItemChange({
index: props.circular && props.value.length - 1 === props.activeItemIndex ? 0 : nextItemIndex
});
if (e.cancelable) {
e.preventDefault();
}
};
var onItemClick = function onItemClick(event) {
stopSlideShow();
var selectedItemIndex = event.index;
if (selectedItemIndex !== props.activeItemIndex) {
var diff = selectedItemIndex + totalShiftedItemsState;
var dir = 0;
if (selectedItemIndex < props.activeItemIndex) {
dir = numVisibleState - diff - 1 - getMedianItemIndex();
if (dir > 0 && -1 * totalShiftedItemsState !== 0) {
step(dir);
}
} else {
dir = getMedianItemIndex() - diff;
if (dir < 0 && -1 * totalShiftedItemsState < getTotalPageNumber() - 1) {
step(dir);
}
}
props.onActiveItemChange({
index: selectedItemIndex
});
}
};
var onTransitionEnd = function onTransitionEnd(e) {
if (itemsContainerRef.current && e.propertyName === 'transform') {
DomHandler.addClass(itemsContainerRef.current, 'p-items-hidden');
itemsContainerRef.current.style.transition = '';
}
};
var onTouchStart = function onTouchStart(e) {
var touchobj = e.changedTouches[0];
startPos.current = {
x: touchobj.pageX,
y: touchobj.pageY
};
};
var onTouchMove = function onTouchMove(e) {
if (e.cancelable) {
e.preventDefault();
}
};
var onTouchEnd = function onTouchEnd(e) {
var touchobj = e.changedTouches[0];
if (props.isVertical) {
changePageOnTouch(e, touchobj.pageY - startPos.current.y);
} else {
changePageOnTouch(e, touchobj.pageX - startPos.current.x);
}
};
var changePageOnTouch = function changePageOnTouch(e, diff) {
if (diff < 0) {
// left
navForward(e);
} else {
// right
navBackward(e);
}
};
var getTotalPageNumber = function getTotalPageNumber() {
return props.value.length > numVisibleState ? props.value.length - numVisibleState + 1 : 0;
};
var createStyle = function createStyle() {
if (!thumbnailsStyle.current) {
thumbnailsStyle.current = DomHandler.createInlineStyle(PrimeReact.nonce);
}
var innerHTML = "\n .p-galleria-thumbnail-items[".concat(attributeSelector.current, "] .p-galleria-thumbnail-item {\n flex: 1 0 ").concat(100 / numVisibleState, "%\n }\n ");
if (props.responsiveOptions) {
responsiveOptions.current = _toConsumableArray(props.responsiveOptions);
responsiveOptions.current.sort(function (data1, data2) {
var value1 = data1.breakpoint;
var value2 = data2.breakpoint;
return ObjectUtils.sort(value1, value2, -1, PrimeReact.locale, PrimeReact.nullSortOrder);
});
for (var i = 0; i < responsiveOptions.current.length; i++) {
var res = responsiveOptions.current[i];
innerHTML += "\n @media screen and (max-width: ".concat(res.breakpoint, ") {\n .p-galleria-thumbnail-items[").concat(attributeSelector.current, "] .p-galleria-thumbnail-item {\n flex: 1 0 ").concat(100 / res.numVisible, "%\n }\n }\n ");
}
}
thumbnailsStyle.current.innerHTML = innerHTML;
};
var calculatePosition = function calculatePosition() {
if (itemsContainerRef.current && responsiveOptions.current) {
var windowWidth = window.innerWidth;
var matchedResponsiveData = {
numVisible: props.numVisible
};
for (var i = 0; i < responsiveOptions.current.length; i++) {
var res = responsiveOptions.current[i];
if (parseInt(res.breakpoint, 10) >= windowWidth) {
matchedResponsiveData = res;
}
}
if (numVisibleState !== matchedResponsiveData.numVisible) {
setNumVisibleState(matchedResponsiveData.numVisible);
}
}
};
useMountEffect(function () {
if (itemsContainerRef.current) {
attributeSelector.current = UniqueComponentId();
itemsContainerRef.current.setAttribute(attributeSelector.current, '');
}
createStyle();
calculatePosition();
bindWindowResizeListener();
});
useUpdateEffect(function () {
var totalShiftedItems = totalShiftedItemsState;
if (prevNumVisible !== numVisibleState || prevActiveItemIndex !== props.activeItemIndex) {
if (props.activeItemIndex <= getMedianItemIndex()) {
totalShiftedItems = 0;
} else if (props.value.length - numVisibleState + getMedianItemIndex() < props.activeItemIndex) {
totalShiftedItems = numVisibleState - props.value.length;
} else if (props.value.length - numVisibleState < props.activeItemIndex && numVisibleState % 2 === 0) {
totalShiftedItems = props.activeItemIndex * -1 + getMedianItemIndex() + 1;
} else {
totalShiftedItems = props.activeItemIndex * -1 + getMedianItemIndex();
}
if (totalShiftedItems !== totalShiftedItemsState) {
setTotalShiftedItemsState(totalShiftedItems);
}
itemsContainerRef.current.style.transform = props.isVertical ? "translate3d(0, ".concat(totalShiftedItems * (100 / numVisibleState), "%, 0)") : "translate3d(".concat(totalShiftedItems * (100 / numVisibleState), "%, 0, 0)");
if (prevActiveItemIndex !== props.activeItemIndex) {
DomHandler.removeClass(itemsContainerRef.current, 'p-items-hidden');
itemsContainerRef.current.style.transition = 'transform 500ms ease 0s';
}
}
});
var createItems = function createItems() {
return props.value.map(function (item, index) {
var firstIndex = totalShiftedItemsState * -1;
var lastIndex = firstIndex + numVisibleState - 1;
var isActive = firstIndex <= index && lastIndex >= index;
var start = firstIndex === index;
var end = lastIndex === index;
var current = props.activeItemIndex === index;
return /*#__PURE__*/React__namespace.createElement(GalleriaThumbnailItem, {
key: index,
index: index,
template: props.itemTemplate,
item: item,
active: isActive,
start: start,
end: end,
onItemClick: onItemClick,
current: current
});
});
};
var createBackwardNavigator = function createBackwardNavigator() {
if (props.showThumbnailNavigators) {
var isDisabled = !props.circular && props.activeItemIndex === 0 || props.value.length <= numVisibleState;
var buttonClassName = classNames('p-galleria-thumbnail-prev p-link', {
'p-disabled': isDisabled
}),
iconClassName = classNames('p-galleria-thumbnail-prev-icon pi', {
'pi-chevron-left': !props.isVertical,
'pi-chevron-up': props.isVertical
});
return /*#__PURE__*/React__namespace.createElement("button", {
className: buttonClassName,
onClick: navBackward,
disabled: isDisabled
}, /*#__PURE__*/React__namespace.createElement("span", {
className: iconClassName
}), /*#__PURE__*/React__namespace.createElement(Ripple, null));
}
return null;
};
var createForwardNavigator = function createForwardNavigator() {
if (props.showThumbnailNavigators) {
var isDisabled = !props.circular && props.activeItemIndex === props.value.length - 1 || props.value.length <= numVisibleState;
var buttonClassName = classNames('p-galleria-thumbnail-next p-link', {
'p-disabled': isDisabled
});
var iconClassName = classNames('p-galleria-thumbnail-next-icon pi', {
'pi-chevron-right': !props.isVertical,
'pi-chevron-down': props.isVertical
});
return /*#__PURE__*/React__namespace.createElement("button", {
className: buttonClassName,
onClick: navForward,
disabled: isDisabled
}, /*#__PURE__*/React__namespace.createElement("span", {
className: iconClassName
}), /*#__PURE__*/React__namespace.createElement(Ripple, null));
}
return null;
};
var createContent = function createContent() {
var items = createItems();
var height = props.isVertical ? props.contentHeight : '';
var backwardNavigator = createBackwardNavigator();
var forwardNavigator = createForwardNavigator();
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-galleria-thumbnail-container"
}, backwardNavigator, /*#__PURE__*/React__namespace.createElement("div", {
className: "p-galleria-thumbnail-items-container",
style: {
height: height
}
}, /*#__PURE__*/React__namespace.createElement("div", {
ref: itemsContainerRef,
className: "p-galleria-thumbnail-items",
onTransitionEnd: onTransitionEnd,
onTouchStart: onTouchStart,
onTouchMove: onTouchMove,
onTouchEnd: onTouchEnd
}, items)), forwardNavigator);
};
var content = createContent();
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-galleria-thumbnail-wrapper"
}, content);
}));
GalleriaThumbnailItem.displayName = 'GalleriaThumbnailItem';
GalleriaThumbnails.displayName = 'GalleriaThumbnails';
var Galleria = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = GalleriaBase.getProps(inProps);
var _React$useState = React__namespace.useState(false),
_React$useState2 = _slicedToArray(_React$useState, 2),
visibleState = _React$useState2[0],
setVisibleState = _React$useState2[1];
var _React$useState3 = React__namespace.useState(props.numVisible),
_React$useState4 = _slicedToArray(_React$useState3, 2),
numVisibleState = _React$useState4[0],
setNumVisibleState = _React$useState4[1];
var _React$useState5 = React__namespace.useState(false),
_React$useState6 = _slicedToArray(_React$useState5, 2),
slideShowActiveState = _React$useState6[0],
setSlideShowActiveState = _React$useState6[1];
var _React$useState7 = React__namespace.useState(props.activeIndex),
_React$useState8 = _slicedToArray(_React$useState7, 2),
activeIndexState = _React$useState8[0],
setActiveIndexState = _React$useState8[1];
var elementRef = React__namespace.useRef(null);
var previewContentRef = React__namespace.useRef(null);
var maskRef = React__namespace.useRef(null);
var activeItemIndex = props.onItemChange ? props.activeIndex : activeIndexState;
var isVertical = props.thumbnailsPosition === 'left' || props.thumbnailsPosition === 'right';
useInterval(function () {
onActiveItemChange({
index: props.circular && props.value.length - 1 === activeItemIndex ? 0 : activeItemIndex + 1
});
}, props.transitionInterval, slideShowActiveState);
var onActiveItemChange = function onActiveItemChange(event) {
if (props.onItemChange) {
props.onItemChange(event);
} else {
setActiveIndexState(event.index);
}
};
var show = function show() {
setVisibleState(true);
};
var hide = function hide() {
setVisibleState(false);
};
var onEnter = function onEnter() {
DomHandler.addClass(document.body, 'p-overflow-hidden');
};
var onEntering = function onEntering() {
ZIndexUtils.set('modal', maskRef.current, PrimeReact.autoZIndex, props.baseZIndex || PrimeReact.zIndex['modal']);
DomHandler.addMultipleClasses(maskRef.current, 'p-component-overlay p-component-overlay-enter');
};
var onEntered = function onEntered() {
props.onShow && props.onShow();
};
var onExit = function onExit() {
DomHandler.removeClass(document.body, 'p-overflow-hidden');
DomHandler.addClass(maskRef.current, 'p-component-overlay-leave');
};
var onExited = function onExited() {
ZIndexUtils.clear(maskRef.current);
props.onHide && props.onHide();
};
var isAutoPlayActive = function isAutoPlayActive() {
return slideShowActiveState;
};
var startSlideShow = function startSlideShow() {
setSlideShowActiveState(true);
};
var stopSlideShow = function stopSlideShow() {
setSlideShowActiveState(false);
};
var getPositionClassName = 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) : '';
};
React__namespace.useEffect(function () {
if (props.value && props.value.length < numVisibleState) {
setNumVisibleState(props.value.length);
}
}, [props.value, numVisibleState]);
React__namespace.useEffect(function () {
setNumVisibleState(props.numVisible);
}, [props.numVisible]);
useUnmountEffect(function () {
if (slideShowActiveState) {
stopSlideShow();
}
ZIndexUtils.clear(maskRef.current);
});
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
show: show,
hide: hide,
isAutoPlayActive: isAutoPlayActive,
startSlideShow: startSlideShow,
stopSlideShow: stopSlideShow,
getElement: function getElement() {
return elementRef.current;
},
getPreviewContent: function getPreviewContent() {
return previewContentRef.current;
}
};
});
var createHeader = function createHeader() {
if (props.header) {
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-galleria-header"
}, props.header);
}
return null;
};
var createFooter = function createFooter() {
if (props.footer) {
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-galleria-footer"
}, props.footer);
}
return null;
};
var createElement = function createElement() {
var otherProps = GalleriaBase.getOtherProps(props);
var thumbnailsPosClassName = props.showThumbnails && getPositionClassName('p-galleria-thumbnails', props.thumbnailsPosition);
var indicatorPosClassName = props.showIndicators && getPositionClassName('p-galleria-indicators', props.indicatorsPosition);
var galleriaClassName = classNames('p-galleria p-component', props.className, {
'p-galleria-fullscreen': props.fullScreen,
'p-galleria-indicator-onitem': props.showIndicatorsOnItem,
'p-galleria-item-nav-onhover': props.showItemNavigatorsOnHover && !props.fullScreen,
'p-input-filled': PrimeReact.inputStyle === 'filled',
'p-ripple-disabled': PrimeReact.ripple === false
}, thumbnailsPosClassName, indicatorPosClassName);
var closeIcon = props.fullScreen && /*#__PURE__*/React__namespace.createElement("button", {
type: "button",
className: "p-galleria-close p-link",
"aria-label": localeOption('close'),
onClick: hide
}, /*#__PURE__*/React__namespace.createElement("span", {
className: "p-galleria-close-icon pi pi-times",
"aria-hidden": "true"
}), /*#__PURE__*/React__namespace.createElement(Ripple, null));
var header = createHeader();
var footer = createFooter();
var element = /*#__PURE__*/React__namespace.createElement("div", _extends({
ref: elementRef,
id: props.id,
className: galleriaClassName,
style: props.style
}, otherProps), closeIcon, header, /*#__PURE__*/React__namespace.createElement("div", {
className: "p-galleria-content"
}, /*#__PURE__*/React__namespace.createElement(GalleriaItem, {
ref: previewContentRef,
value: props.value,
activeItemIndex: activeItemIndex,
onActiveItemChange: onActiveItemChange,
itemTemplate: props.item,
circular: props.circular,
caption: props.caption,
showIndicators: props.showIndicators,
changeItemOnIndicatorHover: props.changeItemOnIndicatorHover,
indicator: props.indicator,
showItemNavigators: props.showItemNavigators,
autoPlay: props.autoPlay,
slideShowActive: slideShowActiveState,
startSlideShow: startSlideShow,
stopSlideShow: stopSlideShow
}), props.showThumbnails && /*#__PURE__*/React__namespace.createElement(GalleriaThumbnails, {
value: props.value,
activeItemIndex: activeItemIndex,
onActiveItemChange: onActiveItemChange,
itemTemplate: props.thumbnail,
numVisible: numVisibleState,
responsiveOptions: props.responsiveOptions,
circular: props.circular,
isVertical: isVertical,
contentHeight: props.verticalThumbnailViewPortHeight,
showThumbnailNavigators: props.showThumbnailNavigators,
autoPlay: props.autoPlay,
slideShowActive: slideShowActiveState,
stopSlideShow: stopSlideShow
})), footer);
return element;
};
var createGalleria = function createGalleria() {
var element = createElement();
if (props.fullScreen) {
var maskClassName = classNames('p-galleria-mask', {
'p-galleria-visible': visibleState
});
var galleriaWrapper = /*#__PURE__*/React__namespace.createElement("div", {
ref: maskRef,
className: maskClassName
}, /*#__PURE__*/React__namespace.createElement(CSSTransition, {
nodeRef: elementRef,
classNames: "p-galleria",
"in": visibleState,
timeout: {
enter: 150,
exit: 150
},
options: props.transitionOptions,
unmountOnExit: true,
onEnter: onEnter,
onEntering: onEntering,
onEntered: onEntered,
onExit: onExit,
onExited: onExited
}, element));
return /*#__PURE__*/React__namespace.createElement(Portal, {
element: galleriaWrapper
});
}
return element;
};
return ObjectUtils.isNotEmpty(props.value) && createGalleria();
}));
Galleria.displayName = 'Galleria';
var ImageBase = {
defaultProps: {
__TYPE: 'Image',
alt: null,
className: null,
downloadable: false,
height: null,
imageClassName: null,
imageStyle: null,
onError: null,
onHide: null,
onShow: null,
preview: false,
src: null,
template: null,
width: null,
zoomSrc: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, ImageBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, ImageBase.defaultProps);
}
};
var Image = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = ImageBase.getProps(inProps);
var _React$useState = React__namespace.useState(false),
_React$useState2 = _slicedToArray(_React$useState, 2),
maskVisibleState = _React$useState2[0],
setMaskVisibleState = _React$useState2[1];
var _React$useState3 = React__namespace.useState(false),
_React$useState4 = _slicedToArray(_React$useState3, 2),
previewVisibleState = _React$useState4[0],
setPreviewVisibleState = _React$useState4[1];
var _React$useState5 = React__namespace.useState(0),
_React$useState6 = _slicedToArray(_React$useState5, 2),
rotateState = _React$useState6[0],
setRotateState = _React$useState6[1];
var _React$useState7 = React__namespace.useState(1),
_React$useState8 = _slicedToArray(_React$useState7, 2),
scaleState = _React$useState8[0],
setScaleState = _React$useState8[1];
var elementRef = React__namespace.useRef(null);
var imageRef = React__namespace.useRef(null);
var maskRef = React__namespace.useRef(null);
var previewRef = React__namespace.useRef(null);
var previewClick = React__namespace.useRef(false);
var show = function show() {
if (props.preview) {
setMaskVisibleState(true);
setTimeout(function () {
setPreviewVisibleState(true);
}, 25);
}
};
var hide = function hide() {
if (!previewClick.current) {
setPreviewVisibleState(false);
setRotateState(0);
setScaleState(1);
}
previewClick.current = false;
};
var onPreviewImageClick = function onPreviewImageClick() {
previewClick.current = true;
};
var onDownload = function onDownload() {
var name = props.alt,
src = props.src;
DomHandler.saveAs({
name: name,
src: src
});
previewClick.current = true;
};
var rotateRight = function rotateRight() {
setRotateState(function (prevRotate) {
return prevRotate + 90;
});
previewClick.current = true;
};
var rotateLeft = function rotateLeft() {
setRotateState(function (prevRotate) {
return prevRotate - 90;
});
previewClick.current = true;
};
var zoomIn = function zoomIn() {
setScaleState(function (prevScale) {
return prevScale + 0.1;
});
previewClick.current = true;
};
var zoomOut = function zoomOut() {
setScaleState(function (prevScale) {
return prevScale - 0.1;
});
previewClick.current = true;
};
var onEntering = function onEntering() {
ZIndexUtils.set('modal', maskRef.current, PrimeReact.autoZIndex, PrimeReact.zIndex['modal']);
};
var onEntered = function onEntered() {
props.onShow && props.onShow();
};
var onExit = function onExit() {
DomHandler.addClass(maskRef.current, 'p-component-overlay-leave');
};
var onExiting = function onExiting() {
props.onHide && props.onHide();
};
var onExited = function onExited() {
ZIndexUtils.clear(maskRef.current);
setMaskVisibleState(false);
};
useUnmountEffect(function () {
maskRef.current && ZIndexUtils.clear(maskRef.current);
});
var createPreview = function createPreview() {
if (props.preview) {
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-image-preview-indicator",
onClick: show
}, content);
}
return null;
};
var createElement = function createElement() {
var downloadable = props.downloadable;
var imagePreviewStyle = {
transform: 'rotate(' + rotateState + 'deg) scale(' + scaleState + ')'
};
var zoomDisabled = scaleState <= 0.5 || scaleState >= 1.5;
// const rotateClassName = 'p-image-preview-rotate-' + rotateScale;
return /*#__PURE__*/React__namespace.createElement("div", {
ref: maskRef,
className: "p-image-mask p-component-overlay p-component-overlay-enter",
onClick: hide
}, /*#__PURE__*/React__namespace.createElement("div", {
className: "p-image-toolbar"
}, downloadable && /*#__PURE__*/React__namespace.createElement("button", {
className: "p-image-action p-link",
onClick: onDownload,
type: "button"
}, /*#__PURE__*/React__namespace.createElement("i", {
className: "pi pi-download"
})), /*#__PURE__*/React__namespace.createElement("button", {
className: "p-image-action p-link",
onClick: rotateRight,
type: "button"
}, /*#__PURE__*/React__namespace.createElement("i", {
className: "pi pi-refresh"
})), /*#__PURE__*/React__namespace.createElement("button", {
className: "p-image-action p-link",
onClick: rotateLeft,
type: "button"
}, /*#__PURE__*/React__namespace.createElement("i", {
className: "pi pi-undo"
})), /*#__PURE__*/React__namespace.createElement("button", {
className: "p-image-action p-link",
onClick: zoomOut,
type: "button",
disabled: zoomDisabled
}, /*#__PURE__*/React__namespace.createElement("i", {
className: "pi pi-search-minus"
})), /*#__PURE__*/React__namespace.createElement("button", {
className: "p-image-action p-link",
onClick: zoomIn,
type: "button",
disabled: zoomDisabled
}, /*#__PURE__*/React__namespace.createElement("i", {
className: "pi pi-search-plus"
})), /*#__PURE__*/React__namespace.createElement("button", {
className: "p-image-action p-link",
type: "button",
"aria-label": localeOption('close')
}, /*#__PURE__*/React__namespace.createElement("i", {
className: "pi pi-times"
}))), /*#__PURE__*/React__namespace.createElement(CSSTransition, {
nodeRef: previewRef,
classNames: "p-image-preview",
"in": previewVisibleState,
timeout: {
enter: 150,
exit: 150
},
unmountOnExit: true,
onEntering: onEntering,
onEntered: onEntered,
onExit: onExit,
onExiting: onExiting,
onExited: onExited
}, /*#__PURE__*/React__namespace.createElement("div", {
ref: previewRef
}, /*#__PURE__*/React__namespace.createElement("img", {
src: props.zoomSrc || props.src,
className: "p-image-preview",
style: imagePreviewStyle,
onClick: onPreviewImageClick,
alt: props.alt
}))));
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
show: show,
hide: hide,
getElement: function getElement() {
return elementRef.current;
},
getImage: function getImage() {
return imageRef.current;
}
};
});
var src = props.src,
alt = props.alt,
width = props.width,
height = props.height;
var otherProps = ImageBase.getOtherProps(props);
var containerClassName = classNames('p-image p-component', props.className, {
'p-image-preview-container': props.preview
});
var element = createElement();
var content = props.template ? ObjectUtils.getJSXElement(props.template, props) : /*#__PURE__*/React__namespace.createElement("i", {
className: "p-image-preview-icon pi pi-eye"
});
var preview = createPreview();
var image = props.src && /*#__PURE__*/React__namespace.createElement("img", {
ref: imageRef,
src: src,
className: props.imageClassName,
width: width,
height: height,
style: props.imageStyle,
alt: alt,
onError: props.onError
});
return /*#__PURE__*/React__namespace.createElement("span", _extends({
ref: elementRef,
className: containerClassName
}, otherProps), image, preview, maskVisibleState && /*#__PURE__*/React__namespace.createElement(Portal, {
element: element,
appendTo: document.body
}));
}));
Image.displayName = 'Image';
var InplaceDisplayBase = {
defaultProps: {
__TYPE: 'InplaceDisplay',
children: undefined
},
getOtherProps: function getOtherProps(display) {
return ObjectUtils.getComponentDiffProps(display, InplaceDisplayBase.defaultProps);
}
};
var InplaceContentBase = {
defaultProps: {
__TYPE: 'InplaceContent',
children: undefined
},
getOtherProps: function getOtherProps(content) {
return ObjectUtils.getComponentDiffProps(content, InplaceContentBase.defaultProps);
}
};
var InplaceBase = {
defaultProps: {
__TYPE: 'Inplace',
style: null,
className: null,
active: false,
closable: false,
disabled: false,
tabIndex: 0,
ariaLabel: null,
onOpen: null,
onClose: null,
onToggle: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, InplaceBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, InplaceBase.defaultProps);
}
};
var InplaceDisplay = function InplaceDisplay(props) {
return props.children;
};
var InplaceContent = function InplaceContent(props) {
return props.children;
};
var Inplace = /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = InplaceBase.getProps(inProps);
var _React$useState = React__namespace.useState(props.active),
_React$useState2 = _slicedToArray(_React$useState, 2),
activeState = _React$useState2[0],
setActiveState = _React$useState2[1];
var elementRef = React__namespace.useRef(null);
var active = props.onToggle ? props.active : activeState;
var open = function open(event) {
if (props.disabled) {
return;
}
props.onOpen && props.onOpen(event);
if (props.onToggle) {
props.onToggle({
originalEvent: event,
value: true
});
} else {
setActiveState(true);
}
};
var close = function close(event) {
props.onClose && props.onClose(event);
if (props.onToggle) {
props.onToggle({
originalEvent: event,
value: false
});
} else {
setActiveState(false);
}
};
var onDisplayKeyDown = function onDisplayKeyDown(event) {
if (event.key === 'Enter') {
open(event);
event.preventDefault();
}
};
var createDisplay = function createDisplay(content) {
var otherProps = InplaceDisplayBase.getOtherProps(content);
var className = classNames('p-inplace-display', {
'p-disabled': props.disabled
});
return /*#__PURE__*/React__namespace.createElement("div", _extends({
className: className
}, otherProps, {
onClick: open,
onKeyDown: onDisplayKeyDown,
tabIndex: props.tabIndex,
"aria-label": props.ariaLabel
}), content);
};
var createCloseButton = function createCloseButton() {
if (props.closable) {
return /*#__PURE__*/React__namespace.createElement(Button, {
type: "button",
className: "p-inplace-content-close",
icon: "pi pi-times",
onClick: close,
"aria-label": localeOption('close')
});
}
return null;
};
var createContent = function createContent(content) {
var otherProps = InplaceContentBase.getOtherProps(content);
var closeButton = createCloseButton();
return /*#__PURE__*/React__namespace.createElement("div", _extends({
className: "p-inplace-content"
}, otherProps), content, closeButton);
};
var createChildren = function createChildren() {
var validChildTypes = ['InplaceContent', 'InplaceDisplay'];
return React__namespace.Children.map(props.children, function (child) {
if (active && ObjectUtils.isValidChild(child, 'InplaceContent', validChildTypes)) {
return createContent(child);
} else if (!active && ObjectUtils.isValidChild(child, 'InplaceDisplay', validChildTypes)) {
return createDisplay(child);
}
});
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
getElement: function getElement() {
return elementRef.current;
}
};
});
var otherProps = InplaceBase.getOtherProps(props);
var children = createChildren();
var className = classNames('p-inplace p-component', {
'p-inplace-closable': props.closable
}, props.className);
return /*#__PURE__*/React__namespace.createElement("div", _extends({
ref: elementRef,
className: className
}, otherProps), children);
});
InplaceDisplay.displayName = 'InplaceDisplay';
InplaceContent.displayName = 'InplaceContent';
Inplace.displayName = 'Inplace';
var InputMaskBase = {
defaultProps: {
__TYPE: 'InputMask',
id: 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,
onComplete: null,
onChange: null,
onFocus: null,
onBlur: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, InputMaskBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, InputMaskBase.defaultProps);
}
};
var InputMask = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = InputMaskBase.getProps(inProps);
var elementRef = React__namespace.useRef(ref);
var firstNonMaskPos = React__namespace.useRef(null);
var lastRequiredNonMaskPos = React__namespace.useRef(0);
var tests = React__namespace.useRef([]);
var buffer = React__namespace.useRef([]);
var len = React__namespace.useRef(0);
var oldVal = React__namespace.useRef(null);
var focus = React__namespace.useRef(false);
var focusText = React__namespace.useRef(null);
var isValueChecked = React__namespace.useRef(null);
var partialPosition = React__namespace.useRef(null);
var defaultBuffer = React__namespace.useRef(null);
var caretTimeoutId = React__namespace.useRef(null);
var androidChrome = React__namespace.useRef(false);
var caret = function caret(first, last) {
var range, begin, end;
var inputEl = elementRef.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
};
}
};
var isCompleted = function isCompleted() {
for (var i = firstNonMaskPos.current; i <= lastRequiredNonMaskPos.current; i++) {
if (tests.current[i] && buffer.current[i] === getPlaceholder(i)) {
return false;
}
}
return true;
};
var getPlaceholder = React__namespace.useCallback(function (i) {
if (i < props.slotChar.length) {
return props.slotChar.charAt(i);
}
return props.slotChar.charAt(0);
}, [props.slotChar]);
var getValue = function getValue() {
return props.unmask ? getUnmaskedValue() : elementRef.current && elementRef.current.value;
};
var seekNext = function seekNext(pos) {
while (++pos < len.current && !tests.current[pos]);
return pos;
};
var seekPrev = function seekPrev(pos) {
while (--pos >= 0 && !tests.current[pos]);
return pos;
};
var shiftL = function shiftL(begin, end) {
var i, j;
if (begin < 0) {
return;
}
for (i = begin, j = seekNext(end); i < len.current; i++) {
if (tests.current[i]) {
if (j < len.current && tests.current[i].test(buffer.current[j])) {
buffer.current[i] = buffer.current[j];
buffer.current[j] = getPlaceholder(j);
} else {
break;
}
j = seekNext(j);
}
}
writeBuffer();
caret(Math.max(firstNonMaskPos.current, begin));
};
var shiftR = function shiftR(pos) {
var i, c, j, t;
for (i = pos, c = getPlaceholder(pos); i < len.current; i++) {
if (tests.current[i]) {
j = seekNext(i);
t = buffer.current[i];
buffer.current[i] = c;
if (j < len.current && tests.current[j].test(t)) {
c = t;
} else {
break;
}
}
}
};
var handleAndroidInput = function handleAndroidInput(e) {
var curVal = elementRef.current.value;
var pos = caret();
if (oldVal.current.length && oldVal.current.length > curVal.length) {
// a deletion or backspace happened
checkVal(true);
while (pos.begin > 0 && !tests.current[pos.begin - 1]) pos.begin--;
if (pos.begin === 0) {
while (pos.begin < firstNonMaskPos.current && !tests.current[pos.begin]) pos.begin++;
}
caret(pos.begin, pos.begin);
} else {
checkVal(true);
while (pos.begin < len.current && !tests.current[pos.begin]) pos.begin++;
caret(pos.begin, pos.begin);
}
if (props.onComplete && isCompleted()) {
props.onComplete({
originalEvent: e,
value: getValue()
});
}
updateModel(e);
};
var onBlur = function onBlur(e) {
focus.current = false;
checkVal();
updateModel(e);
updateFilledState();
props.onBlur && props.onBlur(e);
if (elementRef.current.value !== focusText.current) {
var event = document.createEvent('HTMLEvents');
event.initEvent('change', true, false);
elementRef.current.dispatchEvent(event);
}
};
var onKeyDown = function onKeyDown(e) {
if (props.readOnly) {
return;
}
var k = e.which || e.keyCode,
pos,
begin,
end;
oldVal.current = elementRef.current.value;
//backspace, delete, and escape get special treatment
if (k === 8 || k === 46 || DomHandler.isIOS() && 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
elementRef.current.value = focusText.current;
caret(0, checkVal());
updateModel(e);
e.preventDefault();
}
};
var onKeyPress = function onKeyPress(e) {
if (props.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.current) {
c = String.fromCharCode(k);
if (tests.current[p].test(c)) {
shiftR(p);
buffer.current[p] = c;
writeBuffer();
next = seekNext(p);
if (DomHandler.isAndroid()) {
//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.current) {
completed = isCompleted();
}
}
}
e.preventDefault();
}
updateModel(e);
if (props.onComplete && completed) {
props.onComplete({
originalEvent: e,
value: getValue()
});
}
};
var clearBuffer = function clearBuffer(start, end) {
var i;
for (i = start; i < end && i < len.current; i++) {
if (tests.current[i]) {
buffer.current[i] = getPlaceholder(i);
}
}
};
var writeBuffer = function writeBuffer() {
elementRef.current.value = buffer.current.join('');
};
var checkVal = function checkVal(allow) {
isValueChecked.current = true;
//try to place characters where they belong
var test = elementRef.current.value,
lastMatch = -1,
i,
c,
pos;
for (i = 0, pos = 0; i < len.current; i++) {
if (tests.current[i]) {
buffer.current[i] = getPlaceholder(i);
while (pos++ < test.length) {
c = test.charAt(pos - 1);
if (tests.current[i].test(c)) {
buffer.current[i] = c;
lastMatch = i;
break;
}
}
if (pos > test.length) {
clearBuffer(i + 1, len.current);
break;
}
} else {
if (buffer.current[i] === test.charAt(pos)) {
pos++;
}
if (i < partialPosition.current) {
lastMatch = i;
}
}
}
if (allow) {
writeBuffer();
} else if (lastMatch + 1 < partialPosition.current) {
if (props.autoClear || buffer.current.join('') === defaultBuffer.current) {
// Invalid value. Remove it and replace it with the
// mask, which is the default behavior.
if (elementRef.current.value) elementRef.current.value = '';
clearBuffer(0, len.current);
} else {
// Invalid value, but we opt to show the value to the
// user and allow them to correct their mistake.
writeBuffer();
}
} else {
writeBuffer();
elementRef.current.value = elementRef.current.value.substring(0, lastMatch + 1);
}
return partialPosition.current ? i : firstNonMaskPos.current;
};
var onFocus = function onFocus(e) {
if (props.readOnly) {
return;
}
focus.current = true;
clearTimeout(caretTimeoutId.current);
var pos;
focusText.current = elementRef.current.value;
pos = checkVal();
caretTimeoutId.current = setTimeout(function () {
if (elementRef.current !== document.activeElement) {
return;
}
writeBuffer();
if (pos === props.mask.replace('?', '').length) {
caret(0, pos);
} else {
caret(pos);
}
updateFilledState();
}, 10);
props.onFocus && props.onFocus(e);
};
var onInput = function onInput(event) {
androidChrome.current ? handleAndroidInput(event) : handleInputChange(event);
};
var handleInputChange = function handleInputChange(e) {
if (props.readOnly) {
return;
}
var pos = checkVal(true);
caret(pos);
updateModel(e);
if (props.onComplete && isCompleted()) {
props.onComplete({
originalEvent: e,
value: getValue()
});
}
};
var getUnmaskedValue = React__namespace.useCallback(function () {
var unmaskedBuffer = [];
for (var i = 0; i < buffer.current.length; i++) {
var c = buffer.current[i];
if (tests.current[i] && c !== getPlaceholder(i)) {
unmaskedBuffer.push(c);
}
}
return unmaskedBuffer.join('');
}, [getPlaceholder]);
var updateModel = function updateModel(e) {
if (props.onChange) {
var val = props.unmask ? getUnmaskedValue() : e && e.target.value;
props.onChange({
originalEvent: e,
value: defaultBuffer.current !== val ? val : '',
stopPropagation: function stopPropagation() {},
preventDefault: function preventDefault() {},
target: {
name: props.name,
id: props.id,
value: defaultBuffer.current !== val ? val : ''
}
});
}
};
var updateFilledState = function updateFilledState() {
if (elementRef.current && elementRef.current.value && elementRef.current.value.length > 0) DomHandler.addClass(elementRef.current, 'p-filled');else DomHandler.removeClass(elementRef.current, 'p-filled');
};
var updateValue = function updateValue(allow) {
var pos;
if (elementRef.current) {
if (props.value == null) {
elementRef.current.value = '';
} else {
elementRef.current.value = props.value;
pos = checkVal(allow);
setTimeout(function () {
if (elementRef.current) {
writeBuffer();
return checkVal(allow);
}
}, 10);
}
focusText.current = elementRef.current.value;
}
updateFilledState();
return pos;
};
var isValueUpdated = React__namespace.useCallback(function () {
return props.unmask ? props.value !== getUnmaskedValue() : defaultBuffer.current !== elementRef.current.value && elementRef.current.value !== props.value;
}, [props.unmask, props.value, getUnmaskedValue]);
var init = function init() {
if (props.mask) {
tests.current = [];
partialPosition.current = props.mask.length;
len.current = props.mask.length;
firstNonMaskPos.current = null;
var defs = {
9: '[0-9]',
a: '[A-Za-z]',
'*': '[A-Za-z0-9]'
};
androidChrome.current = DomHandler.isChrome() && DomHandler.isAndroid();
var maskTokens = props.mask.split('');
for (var i = 0; i < maskTokens.length; i++) {
var c = maskTokens[i];
if (c === '?') {
len.current--;
partialPosition.current = i;
} else if (defs[c]) {
tests.current.push(new RegExp(defs[c]));
if (firstNonMaskPos.current === null) {
firstNonMaskPos.current = tests.current.length - 1;
}
if (i < partialPosition.current) {
lastRequiredNonMaskPos.current = tests.current.length - 1;
}
} else {
tests.current.push(null);
}
}
buffer.current = [];
for (var _i = 0; _i < maskTokens.length; _i++) {
var _c = maskTokens[_i];
if (_c !== '?') {
if (defs[_c]) buffer.current.push(getPlaceholder(_i));else buffer.current.push(_c);
}
}
defaultBuffer.current = buffer.current.join('');
}
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
focus: function focus() {
return DomHandler.focus(elementRef.current);
},
getElement: function getElement() {
return elementRef.current;
}
};
});
React__namespace.useEffect(function () {
ObjectUtils.combinedRefs(elementRef, ref);
}, [elementRef, ref]);
useMountEffect(function () {
init();
updateValue();
});
useUpdateEffect(function () {
init();
caret(updateValue(true));
if (props.unmask) {
updateModel();
}
}, [props.mask]);
useUpdateEffect(function () {
if (isValueUpdated()) {
updateValue();
}
}, [isValueUpdated]);
var otherProps = InputMaskBase.getOtherProps(props);
var className = classNames('p-inputmask', props.className);
return /*#__PURE__*/React__namespace.createElement(InputText, _extends({
ref: elementRef,
id: props.id,
type: props.type,
name: props.name,
style: props.style,
className: className
}, otherProps, {
placeholder: props.placeholder,
size: props.size,
maxLength: props.maxLength,
tabIndex: props.tabIndex,
disabled: props.disabled,
readOnly: props.readOnly,
onFocus: onFocus,
onBlur: onBlur,
onKeyDown: onKeyDown,
onKeyPress: onKeyPress,
onInput: onInput,
onPaste: handleInputChange,
required: props.required,
tooltip: props.tooltip,
tooltipOptions: props.tooltipOptions
}));
}));
InputMask.displayName = 'InputMask';
var InputSwitchBase = {
defaultProps: {
__TYPE: 'InputSwitch',
checked: false,
className: null,
disabled: false,
falseValue: false,
id: null,
inputId: null,
inputRef: null,
name: null,
onBlur: null,
onChange: null,
onFocus: null,
style: null,
tabIndex: null,
tooltip: null,
tooltipOptions: null,
trueValue: true,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, InputSwitchBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, InputSwitchBase.defaultProps);
}
};
var InputSwitch = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = InputSwitchBase.getProps(inProps);
var _React$useState = React__namespace.useState(false),
_React$useState2 = _slicedToArray(_React$useState, 2),
focusedState = _React$useState2[0],
setFocusedState = _React$useState2[1];
var elementRef = React__namespace.useRef(null);
var inputRef = React__namespace.useRef(props.inputRef);
var checked = props.checked === props.trueValue;
var onClick = function onClick(event) {
if (props.disabled) {
return;
}
toggle(event);
DomHandler.focus(inputRef.current);
event.preventDefault();
};
var toggle = function toggle(event) {
if (props.onChange) {
var value = checked ? props.falseValue : props.trueValue;
props.onChange({
originalEvent: event,
value: value,
stopPropagation: function stopPropagation() {},
preventDefault: function preventDefault() {},
target: {
name: props.name,
id: props.id,
value: value
}
});
}
};
var onFocus = function onFocus(event) {
setFocusedState(true);
props.onFocus && props.onFocus(event);
};
var onBlur = function onBlur(event) {
setFocusedState(false);
props.onBlur && props.onBlur(event);
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
focus: function focus() {
return DomHandler.focus(inputRef.current);
},
getElement: function getElement() {
return elementRef.current;
},
getInput: function getInput() {
return inputRef.current;
}
};
});
React__namespace.useEffect(function () {
ObjectUtils.combinedRefs(inputRef, props.inputRef);
}, [inputRef, props.inputRef]);
var hasTooltip = ObjectUtils.isNotEmpty(props.tooltip);
var otherProps = InputSwitchBase.getOtherProps(props);
var ariaProps = ObjectUtils.reduceKeys(otherProps, DomHandler.ARIA_PROPS);
var className = classNames('p-inputswitch p-component', {
'p-inputswitch-checked': checked,
'p-disabled': props.disabled,
'p-focus': focusedState
}, props.className);
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement("div", _extends({
ref: elementRef,
id: props.id,
className: className,
style: props.style
}, otherProps, {
onClick: onClick,
role: "checkbox",
"aria-checked": checked
}), /*#__PURE__*/React__namespace.createElement("div", {
className: "p-hidden-accessible"
}, /*#__PURE__*/React__namespace.createElement("input", _extends({
ref: inputRef,
type: "checkbox",
id: props.inputId,
name: props.name,
checked: checked,
onChange: toggle,
onFocus: onFocus,
onBlur: onBlur,
disabled: props.disabled,
role: "switch",
tabIndex: props.tabIndex,
"aria-checked": checked
}, ariaProps))), /*#__PURE__*/React__namespace.createElement("span", {
className: "p-inputswitch-slider"
})), hasTooltip && /*#__PURE__*/React__namespace.createElement(Tooltip, _extends({
target: elementRef,
content: props.tooltip
}, props.tooltipOptions)));
}));
InputSwitch.displayName = 'InputSwitch';
var InputTextareaBase = {
defaultProps: {
__TYPE: 'InputTextarea',
autoResize: false,
keyfilter: null,
onBlur: null,
onFocus: null,
onInput: null,
onKeyDown: null,
onKeyUp: null,
onPaste: null,
tooltip: null,
tooltipOptions: null,
validateOnly: false,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, InputTextareaBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, InputTextareaBase.defaultProps);
}
};
var InputTextarea = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = InputTextareaBase.getProps(inProps);
var elementRef = React__namespace.useRef(ref);
var cachedScrollHeight = React__namespace.useRef(0);
var onFocus = function onFocus(event) {
if (props.autoResize) {
resize();
}
props.onFocus && props.onFocus(event);
};
var onBlur = function onBlur(event) {
if (props.autoResize) {
resize();
}
props.onBlur && props.onBlur(event);
};
var onKeyUp = function onKeyUp(event) {
if (props.autoResize) {
resize();
}
props.onKeyUp && props.onKeyUp(event);
};
var onKeyDown = function onKeyDown(event) {
props.onKeyDown && props.onKeyDown(event);
if (props.keyfilter) {
KeyFilter.onKeyPress(event, props.keyfilter, props.validateOnly);
}
};
var onPaste = function onPaste(event) {
props.onPaste && props.onPaste(event);
if (props.keyfilter) {
KeyFilter.onPaste(event, props.keyfilter, props.validateOnly);
}
};
var onInput = function onInput(event) {
if (props.autoResize) {
resize();
}
props.onInput && props.onInput(event);
var target = event.target;
ObjectUtils.isNotEmpty(target.value) ? DomHandler.addClass(target, 'p-filled') : DomHandler.removeClass(target, 'p-filled');
};
var resize = function resize(initial) {
var inputEl = elementRef.current;
if (inputEl && DomHandler.isVisible(inputEl)) {
if (!cachedScrollHeight.current) {
cachedScrollHeight.current = inputEl.scrollHeight;
inputEl.style.overflow = 'hidden';
}
if (cachedScrollHeight.current !== 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';
}
cachedScrollHeight.current = inputEl.scrollHeight;
}
}
};
var currentValue = elementRef.current && elementRef.current.value;
var isFilled = React__namespace.useMemo(function () {
return ObjectUtils.isNotEmpty(props.value) || ObjectUtils.isNotEmpty(props.defaultValue) || ObjectUtils.isNotEmpty(currentValue);
}, [props.value, props.defaultValue, currentValue]);
React__namespace.useEffect(function () {
ObjectUtils.combinedRefs(elementRef, ref);
}, [elementRef, ref]);
React__namespace.useEffect(function () {
if (props.autoResize) {
resize(true);
}
}, [props.autoResize]);
var hasTooltip = ObjectUtils.isNotEmpty(props.tooltip);
var otherProps = InputTextareaBase.getOtherProps(props);
var className = classNames('p-inputtextarea p-inputtext p-component', {
'p-disabled': props.disabled,
'p-filled': isFilled,
'p-inputtextarea-resizable': props.autoResize
}, props.className);
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement("textarea", _extends({
ref: elementRef
}, otherProps, {
className: className,
onFocus: onFocus,
onBlur: onBlur,
onKeyUp: onKeyUp,
onKeyDown: onKeyDown,
onInput: onInput,
onPaste: onPaste
})), hasTooltip && /*#__PURE__*/React__namespace.createElement(Tooltip, _extends({
target: elementRef,
content: props.tooltip
}, props.tooltipOptions)));
}));
InputTextarea.displayName = 'InputTextarea';
var KnobBase = {
defaultProps: {
__TYPE: 'Knob',
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-border, LightGray)',
textColor: 'var(--text-color-secondary, Black)',
valueTemplate: '{value}',
onChange: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, KnobBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, KnobBase.defaultProps);
}
};
var radius = 40;
var midX = 50;
var midY = 50;
var minRadians = 4 * Math.PI / 3;
var maxRadians = -Math.PI / 3;
var Knob = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = KnobBase.getProps(inProps);
var elementRef = React__namespace.useRef(null);
var enabled = !props.disabled && !props.readOnly;
var _useEventListener = useEventListener({
target: 'window',
type: 'mousemove',
listener: function listener(event) {
updateValue(event.offsetX, event.offsetY);
event.preventDefault();
},
when: enabled
}),
_useEventListener2 = _slicedToArray(_useEventListener, 2),
bindWindowMouseMoveListener = _useEventListener2[0],
unbindWindowMouseMoveListener = _useEventListener2[1];
var _useEventListener3 = useEventListener({
target: 'window',
type: 'mouseup',
listener: function listener(event) {
unbindWindowMouseMoveListener();
unbindWindowMouseUpListener();
event.preventDefault();
},
when: enabled
}),
_useEventListener4 = _slicedToArray(_useEventListener3, 2),
bindWindowMouseUpListener = _useEventListener4[0],
unbindWindowMouseUpListener = _useEventListener4[1];
var _useEventListener5 = useEventListener({
target: 'window',
type: 'touchmove',
listener: function listener(event) {
if (event.touches.length === 1) {
var rect = elementRef.current.getBoundingClientRect();
var touch = event.targetTouches.item(0);
var offsetX = touch.clientX - rect.left;
var offsetY = touch.clientY - rect.top;
updateValue(offsetX, offsetY);
event.preventDefault();
}
},
when: enabled
}),
_useEventListener6 = _slicedToArray(_useEventListener5, 2),
bindWindowTouchMoveListener = _useEventListener6[0],
unbindWindowTouchMoveListener = _useEventListener6[1];
var _useEventListener7 = useEventListener({
target: 'window',
type: 'touchend',
listener: function listener() {
unbindWindowTouchMoveListener();
unbindWindowTouchEndListener();
},
when: enabled
}),
_useEventListener8 = _slicedToArray(_useEventListener7, 2),
bindWindowTouchEndListener = _useEventListener8[0],
unbindWindowTouchEndListener = _useEventListener8[1];
var mapRange = function mapRange(x, inMin, inMax, outMin, outMax) {
return (x - inMin) * (outMax - outMin) / (inMax - inMin) + outMin;
};
var zeroRadians = function zeroRadians() {
return mapRange(props.min > 0 && props.max > 0 ? props.min : 0, props.min, props.max, minRadians, maxRadians);
};
var valueRadians = function valueRadians() {
return mapRange(props.value, props.min, props.max, minRadians, maxRadians);
};
var minX = function minX() {
return midX + Math.cos(minRadians) * radius;
};
var minY = function minY() {
return midY - Math.sin(minRadians) * radius;
};
var maxX = function maxX() {
return midX + Math.cos(maxRadians) * radius;
};
var maxY = function maxY() {
return midY - Math.sin(maxRadians) * radius;
};
var zeroX = function zeroX() {
return midX + Math.cos(zeroRadians()) * radius;
};
var zeroY = function zeroY() {
return midY - Math.sin(zeroRadians()) * radius;
};
var valueX = function valueX() {
return midX + Math.cos(valueRadians()) * radius;
};
var valueY = function valueY() {
return midY - Math.sin(valueRadians()) * radius;
};
var largeArc = function largeArc() {
return Math.abs(zeroRadians() - valueRadians()) < Math.PI ? 0 : 1;
};
var sweep = function sweep() {
return valueRadians() > zeroRadians() ? 0 : 1;
};
var rangePath = "M ".concat(minX(), " ").concat(minY(), " A ").concat(radius, " ").concat(radius, " 0 1 1 ").concat(maxX(), " ").concat(maxY());
var valuePath = "M ".concat(zeroX(), " ").concat(zeroY(), " A ").concat(radius, " ").concat(radius, " 0 ").concat(largeArc(), " ").concat(sweep(), " ").concat(valueX(), " ").concat(valueY());
var valueToDisplay = function valueToDisplay() {
return props.valueTemplate.replace('{value}', props.value.toString());
};
var updateValue = function updateValue(offsetX, offsetY) {
var dx = offsetX - props.size / 2;
var dy = props.size / 2 - offsetY;
var angle = Math.atan2(dy, dx);
var start = -Math.PI / 2 - Math.PI / 6;
updateModel(angle, start);
};
var updateModel = function updateModel(angle, start) {
var mappedValue;
if (angle > maxRadians) mappedValue = mapRange(angle, minRadians, maxRadians, props.min, props.max);else if (angle < start) mappedValue = mapRange(angle + 2 * Math.PI, minRadians, maxRadians, props.min, props.max);else return;
if (props.onChange) {
props.onChange({
value: Math.round((mappedValue - props.min) / props.step) * props.step + props.min
});
}
};
var onClick = function onClick(event) {
if (!props.disabled && !props.readOnly) {
updateValue(event.nativeEvent.offsetX, event.nativeEvent.offsetY);
}
};
var onMouseDown = function onMouseDown(event) {
bindWindowMouseMoveListener();
bindWindowMouseUpListener();
event.preventDefault();
};
var onMouseUp = function onMouseUp() {
unbindWindowMouseMoveListener();
unbindWindowMouseUpListener();
};
var onTouchStart = function onTouchStart() {
bindWindowTouchMoveListener();
bindWindowTouchEndListener();
};
var onTouchEnd = function onTouchEnd() {
unbindWindowTouchMoveListener();
unbindWindowTouchEndListener();
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
getElement: function getElement() {
return elementRef.current;
}
};
});
var otherProps = KnobBase.getOtherProps(props);
var className = classNames('p-knob p-component', {
'p-disabled': props.disabled
}, props.className);
var text = props.showValue && /*#__PURE__*/React__namespace.createElement("text", {
x: 50,
y: 57,
textAnchor: 'middle',
fill: props.textColor,
className: 'p-knob-text',
name: props.name
}, valueToDisplay());
return /*#__PURE__*/React__namespace.createElement("div", _extends({
ref: elementRef,
id: props.id,
className: className,
style: props.style
}, otherProps), /*#__PURE__*/React__namespace.createElement("svg", {
viewBox: "0 0 100 100",
width: props.size,
height: props.size,
onClick: onClick,
onMouseDown: onMouseDown,
onMouseUp: onMouseUp,
onTouchStart: onTouchStart,
onTouchEnd: onTouchEnd
}, /*#__PURE__*/React__namespace.createElement("path", {
d: rangePath,
strokeWidth: props.strokeWidth,
stroke: props.rangeColor,
className: 'p-knob-range'
}), /*#__PURE__*/React__namespace.createElement("path", {
d: valuePath,
strokeWidth: props.strokeWidth,
stroke: props.valueColor,
className: 'p-knob-value'
}), text));
}));
Knob.displayName = 'Knob';
var ListBoxBase = {
defaultProps: {
__TYPE: 'ListBox',
className: null,
dataKey: null,
disabled: null,
emptyFilterMessage: null,
emptyMessage: null,
filter: false,
filterBy: null,
filterInputProps: null,
filterLocale: undefined,
filterMatchMode: 'contains',
filterPlaceholder: null,
filterTemplate: null,
filterValue: null,
id: null,
itemTemplate: null,
listClassName: null,
listStyle: null,
metaKeySelection: false,
multiple: false,
onChange: null,
onFilterValueChange: null,
optionDisabled: null,
optionGroupChildren: null,
optionGroupLabel: null,
optionGroupTemplate: null,
optionLabel: null,
optionValue: null,
options: null,
style: null,
tabIndex: 0,
tooltip: null,
tooltipOptions: null,
value: null,
virtualScrollerOptions: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, ListBoxBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, ListBoxBase.defaultProps);
}
};
var ListBoxHeader = /*#__PURE__*/React__namespace.memo(function (props) {
var filterOptions = {
filter: function filter(e) {
return onFilter(e);
},
reset: function reset() {
return props.resetFilter();
}
};
var onFilter = function onFilter(event) {
if (props.onFilter) {
props.onFilter({
originalEvent: event,
value: event.target.value
});
}
};
var createHeader = function createHeader() {
var content = /*#__PURE__*/React__namespace.createElement("div", {
className: "p-listbox-filter-container"
}, /*#__PURE__*/React__namespace.createElement(InputText, _extends({
type: "text",
value: props.filter,
onChange: onFilter,
className: "p-listbox-filter",
disabled: props.disabled,
placeholder: props.filterPlaceholder
}, props.filterInputProps)), /*#__PURE__*/React__namespace.createElement("span", {
className: "p-listbox-filter-icon pi pi-search"
}));
if (props.filterTemplate) {
var defaultContentOptions = {
className: 'p-listbox-filter-container',
element: content,
filterOptions: filterOptions,
filterInputChange: onFilter,
filterIconClassName: 'p-dropdown-filter-icon pi pi-search',
props: props
};
content = ObjectUtils.getJSXElement(props.filterTemplate, defaultContentOptions);
}
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-listbox-header"
}, content);
};
var content = createHeader();
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, content);
});
ListBoxHeader.displayName = 'ListBoxHeader';
var ListBoxItem = /*#__PURE__*/React__namespace.memo(function (props) {
var onClick = function onClick(event) {
if (props.onClick) {
props.onClick({
originalEvent: event,
option: props.option
});
}
event.preventDefault();
};
var onTouchEnd = function onTouchEnd(event) {
if (props.onTouchEnd) {
props.onTouchEnd({
originalEvent: event,
option: props.option
});
}
};
var onKeyDown = function onKeyDown(event) {
var item = event.currentTarget;
switch (event.which) {
//down
case 40:
var nextItem = findNextItem(item);
nextItem && nextItem.focus();
event.preventDefault();
break;
//up
case 38:
var prevItem = findPrevItem(item);
prevItem && prevItem.focus();
event.preventDefault();
break;
//enter
case 13:
onClick(event);
event.preventDefault();
break;
}
};
var findNextItem = function findNextItem(item) {
var nextItem = item.nextElementSibling;
return nextItem ? DomHandler.hasClass(nextItem, 'p-disabled') || DomHandler.hasClass(nextItem, 'p-listbox-item-group') ? findNextItem(nextItem) : nextItem : null;
};
var findPrevItem = function findPrevItem(item) {
var prevItem = item.previousElementSibling;
return prevItem ? DomHandler.hasClass(prevItem, 'p-disabled') || DomHandler.hasClass(prevItem, 'p-listbox-item-group') ? findPrevItem(prevItem) : prevItem : null;
};
var className = classNames('p-listbox-item', {
'p-highlight': props.selected,
'p-disabled': props.disabled
}, props.option.className);
var content = props.template ? ObjectUtils.getJSXElement(props.template, props.option) : props.label;
return /*#__PURE__*/React__namespace.createElement("li", {
className: className,
style: props.style,
onClick: onClick,
onTouchEnd: onTouchEnd,
onKeyDown: onKeyDown,
tabIndex: "-1",
"aria-label": props.label,
key: props.label,
role: "option",
"aria-selected": props.selected,
"aria-disabled": props.disabled
}, content, /*#__PURE__*/React__namespace.createElement(Ripple, null));
});
ListBoxItem.displayName = 'ListBoxItem';
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 _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; }
var ListBox = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = ListBoxBase.getProps(inProps);
var _React$useState = React__namespace.useState(''),
_React$useState2 = _slicedToArray(_React$useState, 2),
filterValueState = _React$useState2[0],
setFilterValueState = _React$useState2[1];
var elementRef = React__namespace.useRef(null);
var virtualScrollerRef = React__namespace.useRef(null);
var optionTouched = React__namespace.useRef(false);
var filteredValue = (props.onFilterValueChange ? props.filterValue : filterValueState) || '';
var hasFilter = filteredValue && filteredValue.trim().length > 0;
var onOptionSelect = function onOptionSelect(event) {
var option = event.option;
if (props.disabled || isOptionDisabled(option)) {
return;
}
props.multiple ? onOptionSelectMultiple(event.originalEvent, option) : onOptionSelectSingle(event.originalEvent, option);
optionTouched.current = false;
};
var onOptionTouchEnd = function onOptionTouchEnd() {
if (props.disabled) {
return;
}
optionTouched.current = true;
};
var onOptionSelectSingle = function onOptionSelectSingle(event, option) {
var selected = isSelected(option);
var valueChanged = false;
var value = null;
var metaSelection = optionTouched.current ? false : props.metaKeySelection;
if (metaSelection) {
var metaKey = event.metaKey || event.ctrlKey;
if (selected) {
if (metaKey) {
value = null;
valueChanged = true;
}
} else {
value = getOptionValue(option);
valueChanged = true;
}
} else {
value = selected ? null : getOptionValue(option);
valueChanged = true;
}
if (valueChanged) {
updateModel(event, value);
}
};
var onOptionSelectMultiple = function onOptionSelectMultiple(event, option) {
var selected = isSelected(option);
var valueChanged = false;
var value = null;
var metaSelection = optionTouched ? false : props.metaKeySelection;
if (metaSelection) {
var metaKey = event.metaKey || event.ctrlKey;
if (selected) {
if (metaKey) value = removeOption(option);else value = [getOptionValue(option)];
valueChanged = true;
} else {
value = metaKey ? props.value || [] : [];
value = [].concat(_toConsumableArray(value), [getOptionValue(option)]);
valueChanged = true;
}
} else {
if (selected) value = removeOption(option);else value = [].concat(_toConsumableArray(props.value || []), [getOptionValue(option)]);
valueChanged = true;
}
if (valueChanged) {
props.onChange({
originalEvent: event,
value: value,
stopPropagation: function stopPropagation() {},
preventDefault: function preventDefault() {},
target: {
name: props.name,
id: props.id,
value: value
}
});
}
};
var onFilter = function onFilter(event) {
virtualScrollerRef.current && virtualScrollerRef.current.scrollToIndex(0);
var originalEvent = event.originalEvent,
value = event.value;
if (props.onFilterValueChange) {
props.onFilterValueChange({
originalEvent: originalEvent,
value: value
});
} else {
setFilterValueState(value);
}
};
var resetFilter = function resetFilter() {
setFilterValueState('');
props.onFilter && props.onFilter({
filter: ''
});
};
var updateModel = function updateModel(event, value) {
if (props.onChange) {
props.onChange({
originalEvent: event,
value: value,
stopPropagation: function stopPropagation() {},
preventDefault: function preventDefault() {},
target: {
name: props.name,
id: props.id,
value: value
}
});
}
};
var removeOption = function removeOption(option) {
return props.value.filter(function (val) {
return !ObjectUtils.equals(val, getOptionValue(option), props.dataKey);
});
};
var getSelectedOptionIndex = function getSelectedOptionIndex() {
if (props.value != null && visibleOptions) {
if (props.optionGroupLabel) {
for (var i = 0; i < visibleOptions.length; i++) {
var selectedOptionIndex = findOptionIndexInList(props.value, getOptionGroupChildren(visibleOptions[i]));
if (selectedOptionIndex !== -1) {
return {
group: i,
option: selectedOptionIndex
};
}
}
} else {
return findOptionIndexInList(props.value, visibleOptions);
}
}
return -1;
};
var equalityKey = function equalityKey() {
return props.optionValue ? null : props.dataKey;
};
var findOptionIndexInList = function findOptionIndexInList(value, list) {
var key = equalityKey();
return list.findIndex(function (item) {
return ObjectUtils.equals(value, getOptionValue(item), key);
});
};
var isSelected = function isSelected(option) {
var optionValue = getOptionValue(option);
var key = equalityKey();
return props.multiple && props.value ? props.value.some(function (val) {
return ObjectUtils.equals(val, optionValue, key);
}) : ObjectUtils.equals(props.value, optionValue, key);
};
var getOptionLabel = function getOptionLabel(option) {
return props.optionLabel ? ObjectUtils.resolveFieldData(option, props.optionLabel) : option && option['label'] !== undefined ? option['label'] : option;
};
var getOptionValue = function getOptionValue(option) {
return props.optionValue ? ObjectUtils.resolveFieldData(option, props.optionValue) : option && option['value'] !== undefined ? option['value'] : option;
};
var getOptionRenderKey = function getOptionRenderKey(option) {
return props.dataKey ? ObjectUtils.resolveFieldData(option, props.dataKey) : getOptionLabel(option);
};
var isOptionDisabled = function isOptionDisabled(option) {
if (props.optionDisabled) {
return ObjectUtils.isFunction(props.optionDisabled) ? props.optionDisabled(option) : ObjectUtils.resolveFieldData(option, props.optionDisabled);
}
return option && option['disabled'] !== undefined ? option['disabled'] : false;
};
var getOptionGroupRenderKey = function getOptionGroupRenderKey(optionGroup) {
return ObjectUtils.resolveFieldData(optionGroup, props.optionGroupLabel);
};
var getOptionGroupLabel = function getOptionGroupLabel(optionGroup) {
return ObjectUtils.resolveFieldData(optionGroup, props.optionGroupLabel);
};
var getOptionGroupChildren = function getOptionGroupChildren(optionGroup) {
return ObjectUtils.resolveFieldData(optionGroup, props.optionGroupChildren);
};
var getVisibleOptions = function getVisibleOptions() {
if (hasFilter) {
var filterValue = filteredValue.trim().toLocaleLowerCase(props.filterLocale);
var searchFields = props.filterBy ? props.filterBy.split(',') : [props.optionLabel || 'label'];
if (props.optionGroupLabel) {
var filteredGroups = [];
var _iterator = _createForOfIteratorHelper$8(props.options),
_step;
try {
for (_iterator.s(); !(_step = _iterator.n()).done;) {
var optgroup = _step.value;
var filteredSubOptions = FilterService.filter(getOptionGroupChildren(optgroup), searchFields, filterValue, props.filterMatchMode, props.filterLocale);
if (filteredSubOptions && filteredSubOptions.length) {
filteredGroups.push(_objectSpread$e(_objectSpread$e({}, optgroup), {
items: filteredSubOptions
}));
}
}
} catch (err) {
_iterator.e(err);
} finally {
_iterator.f();
}
return filteredGroups;
} else {
return FilterService.filter(props.options, searchFields, filterValue, props.filterMatchMode, props.filterLocale);
}
} else {
return props.options;
}
};
var scrollToSelectedIndex = function scrollToSelectedIndex() {
if (virtualScrollerRef.current) {
var selectedIndex = getSelectedOptionIndex();
if (selectedIndex !== -1) {
setTimeout(function () {
return virtualScrollerRef.current.scrollToIndex(selectedIndex);
}, 0);
}
}
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
focus: function focus() {
return DomHandler.focusFirstElement(elementRef.current);
},
getElement: function getElement() {
return elementRef.current;
},
getVirtualScroller: function getVirtualScroller() {
return virtualScrollerRef.current;
}
};
});
useMountEffect(function () {
scrollToSelectedIndex();
});
var createHeader = function createHeader() {
return props.filter ? /*#__PURE__*/React__namespace.createElement(ListBoxHeader, {
filter: filteredValue,
onFilter: onFilter,
resetFilter: resetFilter,
filterTemplate: props.filterTemplate,
disabled: props.disabled,
filterPlaceholder: props.filterPlaceholder,
filterInputProps: props.filterInputProps
}) : null;
};
var createGroupChildren = function createGroupChildren(optionGroup, style) {
var groupChildren = getOptionGroupChildren(optionGroup);
return groupChildren.map(function (option, j) {
var optionLabel = getOptionLabel(option);
var optionKey = j + '_' + getOptionRenderKey(option);
var disabled = isOptionDisabled(option);
var tabIndex = disabled ? null : props.tabIndex || 0;
return /*#__PURE__*/React__namespace.createElement(ListBoxItem, {
key: optionKey,
label: optionLabel,
option: option,
style: style,
template: props.itemTemplate,
selected: isSelected(option),
onClick: onOptionSelect,
onTouchEnd: onOptionTouchEnd,
tabIndex: tabIndex,
disabled: disabled
});
});
};
var createItem = function createItem(option, index) {
var scrollerOptions = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
var style = {
height: scrollerOptions.props ? scrollerOptions.props.itemSize : undefined
};
if (props.optionGroupLabel) {
var groupContent = props.optionGroupTemplate ? ObjectUtils.getJSXElement(props.optionGroupTemplate, option, index) : getOptionGroupLabel(option);
var groupChildrenContent = createGroupChildren(option, style);
var key = index + '_' + getOptionGroupRenderKey(option);
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, {
key: key
}, /*#__PURE__*/React__namespace.createElement("li", {
className: "p-listbox-item-group",
style: style,
role: "group"
}, groupContent), groupChildrenContent);
} else {
var optionLabel = getOptionLabel(option);
var optionKey = index + '_' + getOptionRenderKey(option);
var disabled = isOptionDisabled(option);
var tabIndex = disabled ? null : props.tabIndex || 0;
return /*#__PURE__*/React__namespace.createElement(ListBoxItem, {
key: optionKey,
label: optionLabel,
option: option,
style: style,
template: props.itemTemplate,
selected: isSelected(option),
onClick: onOptionSelect,
onTouchEnd: onOptionTouchEnd,
tabIndex: tabIndex,
disabled: disabled
});
}
};
var createItems = function createItems() {
if (ObjectUtils.isNotEmpty(visibleOptions)) {
return visibleOptions.map(createItem);
} else if (hasFilter) {
return createEmptyMessage(props.emptyFilterMessage, true);
}
return createEmptyMessage(props.emptyMessage);
};
var createEmptyMessage = function createEmptyMessage(emptyMessage, isFilter) {
var message = ObjectUtils.getJSXElement(emptyMessage, props) || localeOption(isFilter ? 'emptyFilterMessage' : 'emptyMessage');
return /*#__PURE__*/React__namespace.createElement("li", {
className: "p-listbox-empty-message"
}, message);
};
var createList = function createList() {
if (props.virtualScrollerOptions) {
var virtualScrollerProps = _objectSpread$e(_objectSpread$e({}, props.virtualScrollerOptions), {
items: visibleOptions,
onLazyLoad: function onLazyLoad(event) {
return props.virtualScrollerOptions.onLazyLoad(_objectSpread$e(_objectSpread$e({}, event), {
filter: visibleOptions
}));
},
itemTemplate: function itemTemplate(item, options) {
return item && createItem(item, options.index, options);
},
contentTemplate: function contentTemplate(options) {
var className = classNames('p-listbox-list', options.className);
return /*#__PURE__*/React__namespace.createElement("ul", _extends({
ref: options.contentRef,
style: options.style,
className: className,
role: "listbox",
"aria-multiselectable": props.multiple
}, ariaProps), options.children);
}
});
return /*#__PURE__*/React__namespace.createElement(VirtualScroller, _extends({
ref: virtualScrollerRef
}, virtualScrollerProps));
} else {
var items = createItems();
return /*#__PURE__*/React__namespace.createElement("ul", _extends({
className: "p-listbox-list",
role: "listbox",
"aria-multiselectable": props.multiple
}, ariaProps), items);
}
};
var visibleOptions = getVisibleOptions();
var hasTooltip = ObjectUtils.isNotEmpty(props.tooltip);
var otherProps = ListBoxBase.getOtherProps(props);
var ariaProps = ObjectUtils.reduceKeys(otherProps, DomHandler.ARIA_PROPS);
var className = classNames('p-listbox p-component', {
'p-disabled': props.disabled
}, props.className);
var listClassName = classNames('p-listbox-list-wrapper', props.listClassName);
var list = createList();
var header = createHeader();
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement("div", _extends({
ref: elementRef,
id: props.id,
className: className,
style: props.style
}, otherProps), header, /*#__PURE__*/React__namespace.createElement("div", {
className: listClassName,
style: props.listStyle
}, list)), hasTooltip && /*#__PURE__*/React__namespace.createElement(Tooltip, _extends({
target: elementRef,
content: props.tooltip
}, props.tooltipOptions)));
}));
ListBox.displayName = 'ListBox';
var MegaMenuBase = {
defaultProps: {
__TYPE: 'MegaMenu',
id: null,
model: null,
style: null,
className: null,
orientation: 'horizontal',
breakpoint: undefined,
scrollHeight: '400px',
start: null,
end: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, MegaMenuBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, MegaMenuBase.defaultProps);
}
};
var MegaMenu = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = MegaMenuBase.getProps(inProps);
var _React$useState = React__namespace.useState(null),
_React$useState2 = _slicedToArray(_React$useState, 2),
activeItemState = _React$useState2[0],
setActiveItemState = _React$useState2[1];
var _React$useState3 = React__namespace.useState(null),
_React$useState4 = _slicedToArray(_React$useState3, 2),
attributeSelectorState = _React$useState4[0],
setAttributeSelectorState = _React$useState4[1];
var _React$useState5 = React__namespace.useState(false),
_React$useState6 = _slicedToArray(_React$useState5, 2),
mobileActiveState = _React$useState6[0],
setMobileActiveState = _React$useState6[1];
var elementRef = React__namespace.useRef(null);
var styleElementRef = React__namespace.useRef(null);
var menuButtonRef = React__namespace.useRef(null);
var horizontal = props.orientation === 'horizontal';
var vertical = props.orientation === 'vertical';
var isMobileMode = useMatchMedia("screen and (max-width: ".concat(props.breakpoint, ")"), !!props.breakpoint);
var _useEventListener = useEventListener({
type: 'click',
listener: function listener(event) {
if ((!isMobileMode || mobileActiveState) && isOutsideClicked(event)) {
setActiveItemState(null);
setMobileActiveState(false);
}
}
}),
_useEventListener2 = _slicedToArray(_useEventListener, 1),
bindDocumentClickListener = _useEventListener2[0];
var _useResizeListener = useResizeListener({
listener: function listener() {
if (!isMobileMode || mobileActiveState) {
setActiveItemState(null);
setMobileActiveState(false);
}
}
}),
_useResizeListener2 = _slicedToArray(_useResizeListener, 1),
bindDocumentResizeListener = _useResizeListener2[0];
var onLeafClick = function onLeafClick(event, item) {
if (item.disabled) {
event.preventDefault();
return;
}
if (!item.url) {
event.preventDefault();
}
if (item.command) {
item.command({
originalEvent: event,
item: item
});
}
setActiveItemState(null);
setMobileActiveState(false);
};
var onCategoryMouseEnter = function onCategoryMouseEnter(event, item) {
if (item.disabled || isMobileMode) {
event.preventDefault();
return;
}
if (activeItemState) {
setActiveItemState(item);
}
};
var onCategoryClick = function onCategoryClick(event, item) {
if (item.disabled) {
event.preventDefault();
return;
}
if (!item.url) {
event.preventDefault();
}
if (item.command) {
item.command({
originalEvent: event,
item: props.item
});
}
if (item.items) {
activeItemState && activeItemState === item ? setActiveItemState(null) : setActiveItemState(item);
}
event.preventDefault();
};
var onCategoryKeyDown = function onCategoryKeyDown(event, item) {
var listItem = event.currentTarget.parentElement;
switch (event.which) {
//down
case 40:
horizontal ? expandMenu(item) : navigateToNextItem(listItem);
event.preventDefault();
break;
//up
case 38:
vertical ? navigateToPrevItem(listItem) : item.items && item === activeItemState && collapseMenu();
event.preventDefault();
break;
//right
case 39:
horizontal ? navigateToNextItem(listItem) : expandMenu(item);
event.preventDefault();
break;
//left
case 37:
horizontal ? navigateToPrevItem(listItem) : item.items && item === activeItemState && collapseMenu();
event.preventDefault();
break;
}
};
var expandMenu = function expandMenu(item) {
if (item.items) {
setActiveItemState(item);
}
};
var collapseMenu = function collapseMenu(item) {
setActiveItemState(null);
};
var toggle = function toggle(event) {
event.preventDefault();
setMobileActiveState(function (prevMobileActive) {
return !prevMobileActive;
});
setActiveItemState(null);
};
var findNextItem = function findNextItem(item) {
var nextItem = item.nextElementSibling;
return nextItem ? DomHandler.hasClass(nextItem, 'p-disabled') || !DomHandler.hasClass(nextItem, 'p-menuitem') ? findNextItem(nextItem) : nextItem : null;
};
var findPrevItem = function findPrevItem(item) {
var prevItem = item.previousElementSibling;
return prevItem ? DomHandler.hasClass(prevItem, 'p-disabled') || !DomHandler.hasClass(prevItem, 'p-menuitem') ? findPrevItem(prevItem) : prevItem : null;
};
var navigateToNextItem = function navigateToNextItem(listItem) {
var nextItem = findNextItem(listItem);
nextItem && nextItem.children[0].focus();
};
var navigateToPrevItem = function navigateToPrevItem(listItem) {
var prevItem = findPrevItem(listItem);
prevItem && prevItem.children[0].focus();
};
var isOutsideClicked = function isOutsideClicked(event) {
return elementRef.current && !(elementRef.current.isSameNode(event.target) || elementRef.current.contains(event.target) || menuButtonRef.current && menuButtonRef.current.contains(event.target));
};
var getColumnClassName = 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;
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
getElement: function getElement() {
return elementRef.current;
}
};
});
useMountEffect(function () {
if (props.breakpoint) {
!attributeSelectorState && setAttributeSelectorState(UniqueComponentId());
}
bindDocumentClickListener();
bindDocumentResizeListener();
});
useUpdateEffect(function () {
var currentPanel = DomHandler.findSingle(elementRef.current, '.p-menuitem-active > .p-megamenu-panel');
if (activeItemState && !isMobileMode) {
ZIndexUtils.set('menu', currentPanel, PrimeReact.autoZIndex, PrimeReact.zIndex['menu']);
}
if (isMobileMode) {
currentPanel && currentPanel.previousElementSibling.scrollIntoView({
block: 'nearest',
inline: 'nearest'
});
}
return function () {
ZIndexUtils.clear(currentPanel);
};
}, [activeItemState]);
var createSeparator = function createSeparator(index) {
var key = 'separator_' + index;
return /*#__PURE__*/React__namespace.createElement("li", {
key: key,
className: "p-menu-separator",
role: "separator"
});
};
var createSubmenuIcon = function createSubmenuIcon(item) {
if (item.items) {
var _className = classNames('p-submenu-icon pi', {
'pi-angle-down': horizontal,
'pi-angle-right': vertical
});
return /*#__PURE__*/React__namespace.createElement("span", {
className: _className
});
}
return null;
};
var createSubmenuItem = function createSubmenuItem(item, index) {
if (item.visible === false) {
return null;
}
if (item.separator) {
return createSeparator(index);
} else {
var key = item.label + '_' + index;
var _className2 = 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 = IconUtils.getJSXIcon(item.icon, {
className: 'p-menuitem-icon'
}, {
props: props
});
var label = item.label && /*#__PURE__*/React__namespace.createElement("span", {
className: "p-menuitem-text"
}, item.label);
var content = /*#__PURE__*/React__namespace.createElement("a", {
href: item.url || '#',
className: linkClassName,
target: item.target,
onClick: function onClick(event) {
return onLeafClick(event, item);
},
role: "menuitem",
"aria-disabled": item.disabled
}, icon, label, /*#__PURE__*/React__namespace.createElement(Ripple, null));
if (item.template) {
var defaultContentOptions = {
onClick: function onClick(event) {
return onLeafClick(event, item);
},
className: linkClassName,
labelClassName: 'p-menuitem-text',
iconClassName: iconClassName,
element: content,
props: props
};
content = ObjectUtils.getJSXElement(item.template, item, defaultContentOptions);
}
return /*#__PURE__*/React__namespace.createElement("li", {
key: key,
id: item.id,
className: _className2,
style: item.style,
role: "none"
}, content);
}
};
var createSubmenu = function createSubmenu(submenu) {
if (submenu.visible === false) {
return null;
}
var className = classNames('p-megamenu-submenu-header', {
'p-disabled': submenu.disabled
}, submenu.className);
var items = submenu.items.map(createSubmenuItem);
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, {
key: submenu.label
}, /*#__PURE__*/React__namespace.createElement("li", {
id: submenu.id,
className: className,
style: submenu.style,
role: "presentation"
}, submenu.label), items);
};
var createSubmenus = function createSubmenus(column) {
return column.map(createSubmenu);
};
var createColumn = function createColumn(category, column, index, columnClassName) {
var key = category.label + '_column_' + index;
var submenus = createSubmenus(column);
return /*#__PURE__*/React__namespace.createElement("div", {
key: key,
className: columnClassName
}, /*#__PURE__*/React__namespace.createElement("ul", {
className: "p-megamenu-submenu",
role: "menu"
}, submenus));
};
var createColumns = function createColumns(category) {
if (category.items) {
var columnClassName = getColumnClassName(category);
return category.items.map(function (column, index) {
return createColumn(category, column, index, columnClassName);
});
}
return null;
};
var createCategoryPanel = function createCategoryPanel(category) {
if (category.items) {
var columns = createColumns(category);
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-megamenu-panel"
}, /*#__PURE__*/React__namespace.createElement("div", {
className: "p-megamenu-grid"
}, columns));
}
return null;
};
var createStyle = function createStyle() {
if (!styleElementRef.current) {
styleElementRef.current = DomHandler.createInlineStyle(PrimeReact.nonce);
var selector = "".concat(attributeSelectorState);
var innerHTML = "\n@media screen and (max-width: ".concat(props.breakpoint, ") {\n .p-megamenu[").concat(selector, "] > .p-megamenu-root-list .p-menuitem-active .p-megamenu-panel {\n position: relative;\n left: 0 !important;\n box-shadow: none;\n border-radius: 0;\n background: inherit;\n }\n\n .p-megamenu[").concat(selector, "] .p-menuitem-active > .p-menuitem-link > .p-submenu-icon {\n transform: rotate(-180deg);\n }\n\n .p-megamenu[").concat(selector, "] .p-megamenu-grid {\n flex-wrap: wrap;\n }\n\n ").concat(horizontal ? "\n.p-megamenu[".concat(selector, "] .p-megamenu-button {\n display: flex;\n}\n\n.p-megamenu[").concat(selector, "].p-megamenu-horizontal {\n position: relative;\n}\n\n.p-megamenu[").concat(selector, "].p-megamenu-horizontal .p-megamenu-root-list {\n display: none;\n}\n\n.p-megamenu-horizontal[").concat(selector, "] div[class*=\"p-megamenu-col-\"] {\n width: auto;\n flex: 1;\n padding: 0;\n}\n\n.p-megamenu[").concat(selector, "].p-megamenu-mobile-active .p-megamenu-root-list {\n display: flex;\n flex-direction: column;\n position: absolute;\n width: 100%;\n top: 100%;\n left: 0;\n z-index: 1;\n}\n ") : '', "\n\n ").concat(vertical ? "\n.p-megamenu-vertical[".concat(selector, "] {\n width: 100%;\n}\n\n.p-megamenu-vertical[").concat(selector, "] .p-megamenu-root-list {\n max-height: ").concat(props.scrollHeight, ";\n overflow: ").concat(props.scrollHeight ? 'auto' : '', ";\n}\n.p-megamenu-vertical[").concat(selector, "] div[class*=\"p-megamenu-col-\"] {\n width: 100%;\n padding: 0;\n}\n\n.p-megamenu-vertical[").concat(selector, "] .p-megamenu-submenu {\n width: 100%;\n}\n\n.p-megamenu-vertical[").concat(selector, "] div[class*=\"p-megamenu-col-\"] .p-megamenu-submenu-header {\n background: inherit;\n}\n\n.p-megamenu-vertical[").concat(selector, "] .p-submenu-icon:before {\n content: \"\\e930\";\n}\n ") : '', "\n}\n");
styleElementRef.current.innerHTML = innerHTML;
}
};
var destroyStyle = function destroyStyle() {
styleElementRef.current = DomHandler.removeInlineStyle(styleElementRef.current);
};
useUpdateEffect(function () {
if (attributeSelectorState && elementRef.current) {
elementRef.current.setAttribute(attributeSelectorState, '');
createStyle();
}
return function () {
destroyStyle();
};
}, [attributeSelectorState, props.breakpoint]);
var createCategory = function createCategory(category, index) {
var className = classNames('p-menuitem', {
'p-menuitem-active': category === activeItemState
}, category.className);
var linkClassName = classNames('p-menuitem-link', {
'p-disabled': category.disabled
});
var icon = IconUtils.getJSXIcon(category.icon, {
className: 'p-menuitem-icon'
}, {
props: props
});
var label = category.label && /*#__PURE__*/React__namespace.createElement("span", {
className: "p-menuitem-text"
}, category.label);
var itemContent = category.template ? ObjectUtils.getJSXElement(category.template, category) : null;
var submenuIcon = createSubmenuIcon(category);
var panel = createCategoryPanel(category);
return /*#__PURE__*/React__namespace.createElement("li", {
key: category.label + '_' + index,
id: category.id,
className: className,
style: category.style,
onMouseEnter: function onMouseEnter(e) {
return onCategoryMouseEnter(e, category);
},
role: "none"
}, /*#__PURE__*/React__namespace.createElement("a", {
href: category.url || '#',
className: linkClassName,
target: category.target,
onClick: function onClick(e) {
return onCategoryClick(e, category);
},
onKeyDown: function onKeyDown(e) {
return onCategoryKeyDown(e, category);
},
role: "menuitem",
"aria-haspopup": category.items != null
}, icon, label, itemContent, submenuIcon, /*#__PURE__*/React__namespace.createElement(Ripple, null)), panel);
};
var createMenu = function createMenu() {
if (props.model) {
return /*#__PURE__*/React__namespace.createElement("ul", {
className: "p-megamenu-root-list",
role: "menubar"
}, props.model.map(function (item, index) {
return createCategory(item, index);
}));
}
return null;
};
var createStartContent = function createStartContent() {
if (props.start) {
var _start = ObjectUtils.getJSXElement(props.start, props);
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-megamenu-start"
}, _start);
}
return null;
};
var createEndContent = function createEndContent() {
if (props.end) {
var _end = ObjectUtils.getJSXElement(props.end, props);
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-megamenu-end"
}, _end);
}
return null;
};
var createMenuButton = function createMenuButton() {
if (props.orientation === 'vertical' || props.model && props.model.length < 1) {
return null;
}
/* eslint-disable */
var button = /*#__PURE__*/React__namespace.createElement("a", {
ref: menuButtonRef,
href: '#',
role: "button",
tabIndex: 0,
className: "p-megamenu-button",
onClick: toggle
}, /*#__PURE__*/React__namespace.createElement("i", {
className: "pi pi-bars"
}));
/* eslint-enable */
return button;
};
var otherProps = MegaMenuBase.getOtherProps(props);
var className = classNames('p-megamenu p-component', {
'p-megamenu-horizontal': props.orientation === 'horizontal',
'p-megamenu-vertical': props.orientation === 'vertical',
'p-megamenu-mobile-active': mobileActiveState
}, props.className);
var menu = createMenu();
var start = createStartContent();
var end = createEndContent();
var menuButton = createMenuButton();
return /*#__PURE__*/React__namespace.createElement("div", _extends({
ref: elementRef,
id: props.id,
className: className,
style: props.style
}, otherProps), start, menuButton, menu, end);
}));
MegaMenu.displayName = 'MegaMenu';
var MentionBase = {
defaultProps: {
__TYPE: 'Mention',
autoHighlight: true,
className: null,
delay: 0,
field: null,
footerTemplate: null,
headerTemplate: null,
id: null,
inputClassName: null,
inputId: null,
inputRef: null,
inputStyle: null,
itemTemplate: null,
panelClassName: null,
panelStyle: null,
scrollHeight: '200px',
style: null,
suggestions: null,
transitionOptions: null,
trigger: '@',
onBlur: null,
onChange: null,
onFocus: null,
onHide: null,
onInput: null,
onSearch: null,
onSelect: null,
onShow: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, MentionBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, MentionBase.defaultProps);
}
};
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; }
var Mention = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = MentionBase.getProps(inProps);
var _React$useState = React__namespace.useState(false),
_React$useState2 = _slicedToArray(_React$useState, 2),
overlayVisibleState = _React$useState2[0],
setOverlayVisibleState = _React$useState2[1];
var _React$useState3 = React__namespace.useState(false),
_React$useState4 = _slicedToArray(_React$useState3, 2),
focusedState = _React$useState4[0],
setFocusedState = _React$useState4[1];
var _React$useState5 = React__namespace.useState(false),
_React$useState6 = _slicedToArray(_React$useState5, 2),
searchingState = _React$useState6[0],
setSearchingState = _React$useState6[1];
var _React$useState7 = React__namespace.useState(null),
_React$useState8 = _slicedToArray(_React$useState7, 2),
triggerState = _React$useState8[0],
setTriggerState = _React$useState8[1];
var elementRef = React__namespace.useRef(null);
var overlayRef = React__namespace.useRef(null);
var inputRef = React__namespace.useRef(props.inputRef);
var listRef = React__namespace.useRef(null);
var timeout = React__namespace.useRef(null);
var _useOverlayListener = useOverlayListener({
target: elementRef,
overlay: overlayRef,
listener: function listener(event, _ref) {
var valid = _ref.valid;
valid && hide();
},
when: overlayVisibleState
}),
_useOverlayListener2 = _slicedToArray(_useOverlayListener, 2),
bindOverlayListener = _useOverlayListener2[0],
unbindOverlayListener = _useOverlayListener2[1];
var show = function show() {
setOverlayVisibleState(true);
};
var hide = function hide() {
setOverlayVisibleState(false);
setSearchingState(false);
setTriggerState(null);
};
var onOverlayEnter = function onOverlayEnter() {
ZIndexUtils.set('overlay', overlayRef.current, PrimeReact.autoZIndex, PrimeReact.zIndex['overlay']);
alignOverlay();
};
var onOverlayEntering = function onOverlayEntering() {
if (props.autoHighlight && props.suggestions && props.suggestions.length) {
DomHandler.addClass(listRef.current.firstChild, 'p-highlight');
}
};
var onOverlayEntered = function onOverlayEntered() {
bindOverlayListener();
props.onShow && props.onShow();
};
var onOverlayExit = function onOverlayExit() {
unbindOverlayListener();
};
var onOverlayExited = function onOverlayExited() {
ZIndexUtils.clear(overlayRef.current);
props.onHide && props.onHide();
};
var alignOverlay = function alignOverlay() {
var key = triggerState.key,
index = triggerState.index;
var value = inputRef.current.value;
var position = DomHandler.getCursorOffset(inputRef.current, value.substring(0, index - 1), value.substring(index), key);
overlayRef.current.style.transformOrigin = 'top';
overlayRef.current.style.left = "calc(".concat(position.left, "px + 1rem)");
overlayRef.current.style.top = "calc(".concat(position.top, "px + 1.2rem)");
};
var onPanelClick = function onPanelClick(event) {
OverlayService.emit('overlay-click', {
originalEvent: event,
target: elementRef.current
});
};
var getTrigger = function getTrigger(value, key, start) {
if (!triggerState) {
var triggerKey = Array.isArray(props.trigger) ? props.trigger.find(function (t) {
return t === key;
}) : props.trigger === key ? props.trigger : null;
if (triggerKey) {
return {
key: triggerKey,
index: start
};
}
var latestSpaceIndex = value.substring(0, start).lastIndexOf(' ');
var latestTrigger = getLatestTrigger(value, start);
if (latestTrigger.index > latestSpaceIndex) {
return latestTrigger;
}
}
return triggerState;
};
var getLatestTrigger = function getLatestTrigger(value, start) {
if (Array.isArray(props.trigger)) {
var latestTrigger = {};
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(props.trigger);
return {
key: props.trigger,
index: index !== -1 ? index + 1 : -1
};
};
var onSearch = function onSearch(event) {
if (timeout.current) {
clearTimeout(timeout.current);
}
var _event$target = event.target,
value = _event$target.value,
selectionStart = _event$target.selectionStart;
var key = value.substring(selectionStart - 1, selectionStart);
if (key === ' ') {
hide();
return;
}
var currentTrigger = getTrigger(value, key, selectionStart);
if (currentTrigger && currentTrigger.index > -1) {
var query = value.substring(currentTrigger.index, selectionStart);
timeout.current = setTimeout(function () {
search(event, query, currentTrigger);
}, props.delay);
}
};
var search = function search(event, query, trigger) {
if (props.onSearch) {
setSearchingState(true);
setTriggerState(trigger);
props.onSearch({
originalEvent: event,
trigger: trigger.key,
query: query
});
}
};
var selectItem = function selectItem(event, suggestion) {
var value = inputRef.current.value;
var selectionStart = event.target.selectionStart;
var spaceIndex = value.indexOf(' ', triggerState.index);
var currentText = value.substring(triggerState.index, spaceIndex > -1 ? spaceIndex : selectionStart);
var selectedText = 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, triggerState.index);
var nextText = value.substring(triggerState.index + diff);
inputRef.current.value = "".concat(prevText).concat(selectedText, " ").concat(nextText);
props.onChange && props.onChange(event);
}
var cursorStart = triggerState.index + selectedText.length + 1;
inputRef.current.setSelectionRange(cursorStart, cursorStart);
hide();
props.onSelect && props.onSelect({
originalEvent: event,
suggestion: suggestion
});
};
var formatValue = function formatValue(value) {
if (value) {
var field = Array.isArray(props.field) ? props.field[props.trigger.findIndex(function (f) {
return f === triggerState.key;
})] : props.field;
return field ? ObjectUtils.resolveFieldData(value, field) : value;
}
return '';
};
var onItemClick = function onItemClick(event, suggestion) {
DomHandler.focus(inputRef.current);
selectItem(event, suggestion);
};
var onFocus = function onFocus(event) {
setFocusedState(true);
props.onFocus && props.onFocus(event);
};
var onBlur = function onBlur(event) {
setFocusedState(false);
props.onBlur && props.onBlur(event);
};
var onInput = function onInput(event) {
props.onInput && props.onInput(event);
if (event.target.value.length > 0) DomHandler.addClass(elementRef.current, 'p-inputwrapper-filled');else DomHandler.removeClass(elementRef.current, 'p-inputwrapper-filled');
};
var onKeyUp = function onKeyUp(event) {
if (event.which === 37 || event.which === 39) {
onSearch(event);
}
};
var onChange = function onChange(event) {
props.onChange && props.onChange(event);
onSearch(event);
};
var onKeyDown = function onKeyDown(event) {
if (overlayVisibleState) {
var highlightItem = DomHandler.findSingle(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(overlayRef.current, nextElement);
}
} else {
highlightItem = DomHandler.findSingle(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(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 === triggerState.key) {
hide();
}
break;
//enter
case 13:
if (highlightItem) {
selectItem(event, props.suggestions[DomHandler.index(highlightItem)]);
}
event.preventDefault();
break;
//escape
case 27:
hide();
event.preventDefault();
break;
}
}
};
var currentValue = inputRef.current && inputRef.current.value;
var isFilled = React__namespace.useMemo(function () {
return ObjectUtils.isNotEmpty(props.value) || ObjectUtils.isNotEmpty(props.defaultValue) || ObjectUtils.isNotEmpty(currentValue);
}, [props.value, props.defaultValue, currentValue]);
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
show: show,
hide: hide,
focus: function focus() {
return DomHandler.focus(inputRef.current);
},
getElement: function getElement() {
return elementRef.current;
},
getOverlay: function getOverlay() {
return overlayRef.current;
},
getInput: function getInput() {
return inputRef.current;
}
};
});
React__namespace.useEffect(function () {
ObjectUtils.combinedRefs(inputRef, props.inputRef);
}, [inputRef, props.inputRef]);
useUpdateEffect(function () {
if (searchingState) {
props.suggestions && props.suggestions.length ? show() : hide();
overlayVisibleState && alignOverlay();
setSearchingState(false);
}
}, [props.suggestions]);
useUpdateEffect(function () {
if (!isFilled && DomHandler.hasClass(elementRef.current, 'p-inputwrapper-filled')) {
DomHandler.removeClass(elementRef.current, 'p-inputwrapper-filled');
}
}, [isFilled]);
useUnmountEffect(function () {
ZIndexUtils.clear(overlayRef.current);
});
var createItem = function createItem(suggestion, index) {
var key = index + '_item';
var content = props.itemTemplate ? ObjectUtils.getJSXElement(props.itemTemplate, suggestion, {
trigger: triggerState ? triggerState.key : '',
index: index
}) : formatValue(suggestion);
return /*#__PURE__*/React__namespace.createElement("li", {
key: key,
className: "p-mention-item",
onClick: function onClick(e) {
return onItemClick(e, suggestion);
}
}, content, /*#__PURE__*/React__namespace.createElement(Ripple, null));
};
var createList = function createList() {
if (props.suggestions) {
var items = props.suggestions.map(createItem);
return /*#__PURE__*/React__namespace.createElement("ul", {
ref: listRef,
className: "p-mention-items"
}, items);
}
return null;
};
var createPanel = function createPanel() {
var panelClassName = classNames('p-mention-panel p-component', props.panelClassName);
var panelStyle = _objectSpread$d({
maxHeight: props.scrollHeight
}, props.panelStyle);
var header = ObjectUtils.getJSXElement(props.headerTemplate, props);
var footer = ObjectUtils.getJSXElement(props.footerTemplate, props);
var list = createList();
var panel = /*#__PURE__*/React__namespace.createElement(CSSTransition, {
nodeRef: overlayRef,
classNames: "p-connected-overlay",
"in": overlayVisibleState,
timeout: {
enter: 120,
exit: 100
},
options: props.transitionOptions,
unmountOnExit: true,
onEnter: onOverlayEnter,
onEntering: onOverlayEntering,
onEntered: onOverlayEntered,
onExit: onOverlayExit,
onExited: onOverlayExited
}, /*#__PURE__*/React__namespace.createElement("div", {
ref: overlayRef,
className: panelClassName,
style: panelStyle,
onClick: onPanelClick
}, header, list, footer));
return /*#__PURE__*/React__namespace.createElement(Portal, {
element: panel,
appendTo: "self"
});
};
var className = classNames('p-mention p-component p-inputwrapper', {
'p-inputwrapper-filled': isFilled,
'p-inputwrapper-focus': focusedState
}, props.className);
var inputClassName = classNames('p-mention-input', props.inputClassName);
var inputProps = MentionBase.getOtherProps(props);
var panel = createPanel();
return /*#__PURE__*/React__namespace.createElement("div", {
ref: elementRef,
id: props.id,
className: className,
style: props.style
}, /*#__PURE__*/React__namespace.createElement(InputTextarea, _extends({
ref: inputRef,
id: props.inputId,
className: inputClassName,
style: props.inputStyle
}, inputProps, {
onFocus: onFocus,
onBlur: onBlur,
onKeyDown: onKeyDown,
onInput: onInput,
onKeyUp: onKeyUp,
onChange: onChange
})), panel);
}));
Mention.displayName = 'Mention';
var MenuBase = {
defaultProps: {
__TYPE: 'Menu',
id: null,
model: null,
popup: false,
style: null,
className: null,
autoZIndex: true,
baseZIndex: 0,
appendTo: null,
transitionOptions: null,
onShow: null,
onHide: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, MenuBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, MenuBase.defaultProps);
}
};
var Menu = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = MenuBase.getProps(inProps);
var _React$useState = React__namespace.useState(!props.popup),
_React$useState2 = _slicedToArray(_React$useState, 2),
visibleState = _React$useState2[0],
setVisibleState = _React$useState2[1];
var menuRef = React__namespace.useRef(null);
var targetRef = React__namespace.useRef(null);
var _useOverlayListener = useOverlayListener({
target: targetRef,
overlay: menuRef,
listener: function listener(event, _ref) {
var valid = _ref.valid;
valid && hide(event);
},
when: visibleState
}),
_useOverlayListener2 = _slicedToArray(_useOverlayListener, 2),
bindOverlayListener = _useOverlayListener2[0],
unbindOverlayListener = _useOverlayListener2[1];
var onPanelClick = function onPanelClick(event) {
if (props.popup) {
OverlayService.emit('overlay-click', {
originalEvent: event,
target: targetRef.current
});
}
};
var onItemClick = 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 (props.popup) {
hide(event);
}
};
var onItemKeyDown = function onItemKeyDown(event, item) {
var listItem = event.currentTarget.parentElement;
switch (event.which) {
//down
case 40:
var nextItem = findNextItem(listItem);
nextItem && nextItem.children[0].focus();
event.preventDefault();
break;
//up
case 38:
var prevItem = findPrevItem(listItem);
prevItem && prevItem.children[0].focus();
event.preventDefault();
break;
}
};
var findNextItem = function findNextItem(item) {
var nextItem = item.nextElementSibling;
return nextItem ? DomHandler.hasClass(nextItem, 'p-disabled') || !DomHandler.hasClass(nextItem, 'p-menuitem') ? findNextItem(nextItem) : nextItem : null;
};
var findPrevItem = function findPrevItem(item) {
var prevItem = item.previousElementSibling;
return prevItem ? DomHandler.hasClass(prevItem, 'p-disabled') || !DomHandler.hasClass(prevItem, 'p-menuitem') ? findPrevItem(prevItem) : prevItem : null;
};
var toggle = function toggle(event) {
if (props.popup) {
visibleState ? hide(event) : show(event);
}
};
var show = function show(event) {
targetRef.current = event.currentTarget;
setVisibleState(true);
props.onShow && props.onShow(event);
};
var hide = function hide(event) {
targetRef.current = event.currentTarget;
setVisibleState(false);
props.onHide && props.onHide(event);
};
var onEnter = function onEnter() {
ZIndexUtils.set('menu', menuRef.current, PrimeReact.autoZIndex, props.baseZIndex || PrimeReact.zIndex['menu']);
DomHandler.absolutePosition(menuRef.current, targetRef.current);
};
var onEntered = function onEntered() {
bindOverlayListener();
};
var onExit = function onExit() {
targetRef.current = null;
unbindOverlayListener();
};
var onExited = function onExited() {
ZIndexUtils.clear(menuRef.current);
};
useUnmountEffect(function () {
ZIndexUtils.clear(menuRef.current);
});
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
toggle: toggle,
show: show,
hide: hide,
getElement: function getElement() {
return menuRef.current;
},
getTarget: function getTarget() {
return targetRef.current;
}
};
});
var createSubmenu = function createSubmenu(submenu, index) {
var key = submenu.label + '_' + index;
var className = classNames('p-submenu-header', {
'p-disabled': submenu.disabled
}, submenu.className);
var items = submenu.items.map(createMenuItem);
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, {
key: key
}, /*#__PURE__*/React__namespace.createElement("li", {
className: className,
style: submenu.style,
role: "presentation"
}, submenu.label), items);
};
var createSeparator = function createSeparator(index) {
var key = 'separator_' + index;
return /*#__PURE__*/React__namespace.createElement("li", {
key: key,
className: "p-menu-separator",
role: "separator"
});
};
var createMenuItem = function createMenuItem(item, index) {
if (item.visible === false) {
return null;
}
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 = IconUtils.getJSXIcon(item.icon, {
className: 'p-menuitem-icon'
}, {
props: props
});
var label = item.label && /*#__PURE__*/React__namespace.createElement("span", {
className: "p-menuitem-text"
}, item.label);
var tabIndex = item.disabled ? null : 0;
var key = item.label + '_' + index;
var content = /*#__PURE__*/React__namespace.createElement("a", {
href: item.url || '#',
className: linkClassName,
role: "menuitem",
target: item.target,
onClick: function onClick(event) {
return onItemClick(event, item);
},
onKeyDown: function onKeyDown(event) {
return onItemKeyDown(event);
},
tabIndex: tabIndex,
"aria-disabled": item.disabled
}, icon, label);
if (item.template) {
var defaultContentOptions = {
onClick: function onClick(event) {
return onItemClick(event, item);
},
onKeyDown: function onKeyDown(event) {
return onItemKeyDown(event);
},
className: linkClassName,
tabIndex: tabIndex,
labelClassName: 'p-menuitem-text',
iconClassName: iconClassName,
element: content,
props: props
};
content = ObjectUtils.getJSXElement(item.template, item, defaultContentOptions);
}
return /*#__PURE__*/React__namespace.createElement("li", {
key: key,
className: className,
style: item.style,
role: "none"
}, content);
};
var createItem = function createItem(item, index) {
return item.separator ? createSeparator(index) : item.items ? createSubmenu(item, index) : createMenuItem(item, index);
};
var createMenu = function createMenu() {
return props.model.map(createItem);
};
var createElement = function createElement() {
if (props.model) {
var otherProps = MenuBase.getOtherProps(props);
var className = classNames('p-menu p-component', {
'p-menu-overlay': props.popup,
'p-input-filled': PrimeReact.inputStyle === 'filled',
'p-ripple-disabled': PrimeReact.ripple === false
}, props.className);
var menuitems = createMenu();
return /*#__PURE__*/React__namespace.createElement(CSSTransition, {
nodeRef: menuRef,
classNames: "p-connected-overlay",
"in": visibleState,
timeout: {
enter: 120,
exit: 100
},
options: props.transitionOptions,
unmountOnExit: true,
onEnter: onEnter,
onEntered: onEntered,
onExit: onExit,
onExited: onExited
}, /*#__PURE__*/React__namespace.createElement("div", _extends({
ref: menuRef,
id: props.id,
className: className,
style: props.style
}, otherProps, {
onClick: onPanelClick
}), /*#__PURE__*/React__namespace.createElement("ul", {
className: "p-menu-list p-reset",
role: "menu"
}, menuitems)));
}
return null;
};
var element = createElement();
return props.popup ? /*#__PURE__*/React__namespace.createElement(Portal, {
element: element,
appendTo: props.appendTo
}) : element;
}));
Menu.displayName = 'Menu';
var MenubarBase = {
defaultProps: {
__TYPE: 'Menubar',
id: null,
model: null,
style: null,
className: null,
start: null,
end: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, MenubarBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, MenubarBase.defaultProps);
}
};
var MenubarSub = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (props, ref) {
var _React$useState = React__namespace.useState(null),
_React$useState2 = _slicedToArray(_React$useState, 2),
activeItemState = _React$useState2[0],
setActiveItemState = _React$useState2[1];
var _useEventListener = useEventListener({
type: 'click',
listener: function listener(event) {
if (ref && ref.current && !ref.current.contains(event.target)) {
setActiveItemState(null);
}
}
}),
_useEventListener2 = _slicedToArray(_useEventListener, 1),
bindDocumentClickListener = _useEventListener2[0];
var onItemMouseEnter = function onItemMouseEnter(event, item) {
if (item.disabled || props.mobileActive) {
event.preventDefault();
return;
}
if (props.root) {
if (activeItemState || props.popup) {
setActiveItemState(item);
}
} else {
setActiveItemState(item);
}
};
var onItemClick = 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) activeItemState && item === activeItemState ? setActiveItemState(null) : setActiveItemState(item);else onLeafClick();
};
var onItemKeyDown = function onItemKeyDown(event, item) {
var listItem = event.currentTarget.parentElement;
switch (event.which) {
//down
case 40:
if (props.root) item.items && expandSubmenu(item, listItem);else navigateToNextItem(listItem);
event.preventDefault();
break;
//up
case 38:
!props.root && navigateToPrevItem(listItem);
event.preventDefault();
break;
//right
case 39:
if (props.root) {
var nextItem = findNextItem(listItem);
nextItem && nextItem.children[0].focus();
} else {
item.items && expandSubmenu(item, listItem);
}
event.preventDefault();
break;
//left
case 37:
props.root && navigateToPrevItem(listItem);
event.preventDefault();
break;
}
props.onKeyDown && props.onKeyDown(event, listItem);
};
var onChildItemKeyDown = function onChildItemKeyDown(event, childListItem) {
if (props.root) {
//up
if (event.which === 38 && childListItem.previousElementSibling == null) {
collapseMenu(childListItem);
}
} else {
//left
if (event.which === 37) {
collapseMenu(childListItem);
}
}
};
var expandSubmenu = function expandSubmenu(item, listItem) {
setActiveItemState(item);
setTimeout(function () {
listItem.children[1].children[0].children[0].focus();
}, 50);
};
var collapseMenu = function collapseMenu(listItem) {
setActiveItemState(null);
listItem.parentElement.previousElementSibling.focus();
};
var navigateToNextItem = function navigateToNextItem(listItem) {
var nextItem = findNextItem(listItem);
nextItem && nextItem.children[0].focus();
};
var navigateToPrevItem = function navigateToPrevItem(listItem) {
var prevItem = findPrevItem(listItem);
prevItem && prevItem.children[0].focus();
};
var findNextItem = function findNextItem(item) {
var nextItem = item.nextElementSibling;
return nextItem ? DomHandler.hasClass(nextItem, 'p-disabled') || !DomHandler.hasClass(nextItem, 'p-menuitem') ? findNextItem(nextItem) : nextItem : null;
};
var findPrevItem = function findPrevItem(item) {
var prevItem = item.previousElementSibling;
return prevItem ? DomHandler.hasClass(prevItem, 'p-disabled') || !DomHandler.hasClass(prevItem, 'p-menuitem') ? findPrevItem(prevItem) : prevItem : null;
};
var onLeafClick = function onLeafClick() {
setActiveItemState(null);
props.onLeafClick && props.onLeafClick();
};
useMountEffect(function () {
bindDocumentClickListener();
});
useUpdateEffect(function () {
!props.parentActive && setActiveItemState(null);
}, [props.parentActive]);
var createSeparator = function createSeparator(index) {
var key = 'separator_' + index;
return /*#__PURE__*/React__namespace.createElement("li", {
key: key,
className: "p-menu-separator",
role: "separator"
});
};
var createSubmenu = function createSubmenu(item) {
if (item.items) {
return /*#__PURE__*/React__namespace.createElement(MenubarSub, {
menuProps: props.menuProps,
model: item.items,
mobileActive: props.mobileActive,
onLeafClick: onLeafClick,
onKeyDown: onChildItemKeyDown,
parentActive: item === activeItemState
});
}
return null;
};
var createMenuitem = function createMenuitem(item, index) {
if (item.visible === false) {
return null;
}
var key = item.label + '_' + index;
var className = classNames('p-menuitem', {
'p-menuitem-active': activeItemState === 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': props.root,
'pi-angle-right': !props.root
});
var icon = IconUtils.getJSXIcon(item.icon, {
className: 'p-menuitem-icon'
}, {
props: props.menuProps
});
var label = item.label && /*#__PURE__*/React__namespace.createElement("span", {
className: "p-menuitem-text"
}, item.label);
var submenuIcon = item.items && /*#__PURE__*/React__namespace.createElement("span", {
className: submenuIconClassName
});
var submenu = createSubmenu(item);
var content = /*#__PURE__*/React__namespace.createElement("a", {
href: item.url || '#',
role: "menuitem",
className: linkClassName,
target: item.target,
"aria-haspopup": item.items != null,
onClick: function onClick(event) {
return onItemClick(event, item);
},
onKeyDown: function onKeyDown(event) {
return onItemKeyDown(event, item);
}
}, icon, label, submenuIcon, /*#__PURE__*/React__namespace.createElement(Ripple, null));
if (item.template) {
var defaultContentOptions = {
onClick: function onClick(event) {
return onItemClick(event, item);
},
onKeyDown: function onKeyDown(event) {
return onItemKeyDown(event, item);
},
className: linkClassName,
labelClassName: 'p-menuitem-text',
iconClassName: iconClassName,
submenuIconClassName: submenuIconClassName,
element: content,
props: props
};
content = ObjectUtils.getJSXElement(item.template, item, defaultContentOptions);
}
return /*#__PURE__*/React__namespace.createElement("li", {
key: key,
role: "none",
id: item.id,
className: className,
style: item.style,
onMouseEnter: function onMouseEnter(event) {
return onItemMouseEnter(event, item);
}
}, content, submenu);
};
var createItem = function createItem(item, index) {
return item.separator ? createSeparator(index) : createMenuitem(item, index);
};
var createMenu = function createMenu() {
return props.model ? props.model.map(createItem) : null;
};
var role = props.root ? 'menubar' : 'menu';
var className = classNames({
'p-submenu-list': !props.root,
'p-menubar-root-list': props.root
});
var submenu = createMenu();
return /*#__PURE__*/React__namespace.createElement("ul", {
ref: ref,
className: className,
role: role
}, submenu);
}));
MenubarSub.displayName = 'MenubarSub';
var Menubar = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = MenubarBase.getProps(inProps);
var _React$useState = React__namespace.useState(false),
_React$useState2 = _slicedToArray(_React$useState, 2),
mobileActiveState = _React$useState2[0],
setMobileActiveState = _React$useState2[1];
var elementRef = React__namespace.useRef(null);
var rootMenuRef = React__namespace.useRef(null);
var menuButtonRef = React__namespace.useRef(null);
var _useEventListener = useEventListener({
type: 'click',
listener: function listener(event) {
if (mobileActiveState && isOutsideClicked(event)) {
setMobileActiveState(false);
}
}
}),
_useEventListener2 = _slicedToArray(_useEventListener, 2),
bindDocumentClickListener = _useEventListener2[0],
unbindDocumentClickListener = _useEventListener2[1];
var toggle = function toggle(event) {
event.preventDefault();
setMobileActiveState(function (prevMobileActive) {
return !prevMobileActive;
});
};
var onLeafClick = function onLeafClick() {
setMobileActiveState(false);
};
var isOutsideClicked = function isOutsideClicked(event) {
return rootMenuRef.current !== event.target && !rootMenuRef.current.contains(event.target) && menuButtonRef.current !== event.target && !menuButtonRef.current.contains(event.target);
};
useUpdateEffect(function () {
if (mobileActiveState) {
ZIndexUtils.set('menu', rootMenuRef.current, PrimeReact.autoZIndex, PrimeReact.zIndex['menu']);
bindDocumentClickListener();
} else {
unbindDocumentClickListener();
ZIndexUtils.clear(rootMenuRef.current);
}
}, [mobileActiveState]);
useUnmountEffect(function () {
ZIndexUtils.clear(rootMenuRef.current);
});
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
toggle: toggle,
useCustomContent: useCustomContent,
getElement: function getElement() {
return elementRef.current;
},
getRootMenu: function getRootMenu() {
return rootMenuRef.current;
},
getMenuButton: function getMenuButton() {
return menuButtonRef.current;
}
};
});
var createStartContent = function createStartContent() {
if (props.start) {
var _start = ObjectUtils.getJSXElement(props.start, props);
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-menubar-start"
}, _start);
}
return null;
};
var createEndContent = function createEndContent() {
if (props.end) {
var _end = ObjectUtils.getJSXElement(props.end, props);
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-menubar-end"
}, _end);
}
return null;
};
var createMenuButton = function createMenuButton() {
if (props.model && props.model.length < 1) {
return null;
}
/* eslint-disable */
var button = /*#__PURE__*/React__namespace.createElement("a", {
ref: menuButtonRef,
href: '#',
role: "button",
tabIndex: 0,
className: "p-menubar-button",
onClick: toggle
}, /*#__PURE__*/React__namespace.createElement("i", {
className: "pi pi-bars"
}));
/* eslint-enable */
return button;
};
var otherProps = MenubarBase.getOtherProps(props);
var className = classNames('p-menubar p-component', {
'p-menubar-mobile-active': mobileActiveState
}, props.className);
var start = createStartContent();
var end = createEndContent();
var menuButton = createMenuButton();
var submenu = /*#__PURE__*/React__namespace.createElement(MenubarSub, {
ref: rootMenuRef,
menuProps: props,
model: props.model,
root: true,
mobileActive: mobileActiveState,
onLeafClick: onLeafClick
});
return /*#__PURE__*/React__namespace.createElement("div", _extends({
id: props.id,
className: className,
style: props.style
}, otherProps), start, menuButton, submenu, end);
}));
Menubar.displayName = 'Menubar';
var MessageBase = {
defaultProps: {
__TYPE: 'Message',
id: null,
className: null,
style: null,
text: null,
icon: null,
severity: 'info',
content: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, MessageBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, MessageBase.defaultProps);
}
};
var Message = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = MessageBase.getProps(inProps);
var elementRef = React__namespace.useRef(null);
var createContent = function createContent() {
if (props.content) {
return ObjectUtils.getJSXElement(props.content, props);
}
var text = ObjectUtils.getJSXElement(props.text, props);
var iconValue = props.icon;
if (!iconValue) {
iconValue = classNames('pi', {
'pi-info-circle': props.severity === 'info',
'pi-exclamation-triangle': props.severity === 'warn',
'pi-times-circle': props.severity === 'error',
'pi-check': props.severity === 'success'
});
}
var icon = IconUtils.getJSXIcon(iconValue, {
className: 'p-inline-message-icon'
}, {
props: props
});
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, icon, /*#__PURE__*/React__namespace.createElement("span", {
className: "p-inline-message-text"
}, text));
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
getElement: function getElement() {
return elementRef.current;
}
};
});
var otherProps = MessageBase.getOtherProps(props);
var className = classNames('p-inline-message p-component', {
'p-inline-message-info': props.severity === 'info',
'p-inline-message-warn': props.severity === 'warn',
'p-inline-message-error': props.severity === 'error',
'p-inline-message-success': props.severity === 'success',
'p-inline-message-icon-only': !props.text
}, props.className);
var content = createContent();
return /*#__PURE__*/React__namespace.createElement("div", _extends({
id: props.id,
ref: elementRef,
className: className,
style: props.style
}, otherProps, {
role: "alert",
"aria-live": "polite"
}), content);
}));
Message.displayName = 'Message';
var MultiSelectBase = {
defaultProps: {
__TYPE: 'MultiSelect',
appendTo: null,
ariaLabelledBy: null,
className: null,
dataKey: null,
disabled: false,
display: 'comma',
dropdownIcon: 'pi pi-chevron-down',
emptyFilterMessage: null,
filter: false,
filterBy: null,
filterLocale: undefined,
filterMatchMode: 'contains',
filterPlaceholder: null,
filterTemplate: null,
fixedPlaceholder: false,
flex: false,
id: null,
inline: false,
inputId: null,
inputRef: null,
itemClassName: null,
itemTemplate: null,
maxSelectedLabels: null,
name: null,
onBlur: null,
onChange: null,
onFilter: null,
onFocus: null,
onHide: null,
onSelectAll: null,
onShow: null,
optionDisabled: null,
optionGroupChildren: null,
optionGroupLabel: null,
optionGroupTemplate: null,
optionLabel: null,
optionValue: null,
options: null,
overlayVisible: false,
panelClassName: null,
panelFooterTemplate: null,
panelHeaderTemplate: null,
panelStyle: null,
placeholder: null,
removeIcon: 'pi pi-times-circle',
resetFilterOnHide: false,
scrollHeight: '200px',
selectAll: false,
selectedItemTemplate: null,
selectedItemsLabel: '{0} items selected',
selectionLimit: null,
showClear: false,
showSelectAll: true,
style: null,
tabIndex: 0,
tooltip: null,
tooltipOptions: null,
transitionOptions: null,
useOptionAsValue: false,
value: null,
virtualScrollerOptions: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, MultiSelectBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, MultiSelectBase.defaultProps);
}
};
var MultiSelectHeader = /*#__PURE__*/React__namespace.memo(function (props) {
var filterOptions = {
filter: function filter(e) {
return onFilter(e);
},
reset: function reset() {
return props.resetFilter();
}
};
var onFilter = function onFilter(event) {
if (props.onFilter) {
props.onFilter({
originalEvent: event,
query: event.target.value
});
}
};
var onSelectAll = function onSelectAll(event) {
if (props.onSelectAll) {
props.onSelectAll({
originalEvent: event,
checked: props.selectAll
});
}
event.preventDefault();
};
var createFilterElement = function createFilterElement() {
if (props.filter) {
var containerClassName = classNames('p-multiselect-filter-container');
var content = /*#__PURE__*/React__namespace.createElement("div", {
className: containerClassName
}, /*#__PURE__*/React__namespace.createElement(InputText, {
ref: props.filterRef,
type: "text",
role: "textbox",
value: props.filterValue,
onChange: onFilter,
className: "p-multiselect-filter",
placeholder: props.filterPlaceholder
}), /*#__PURE__*/React__namespace.createElement("span", {
className: "p-multiselect-filter-icon pi pi-search"
}));
if (props.filterTemplate) {
var defaultContentOptions = {
className: containerClassName,
element: content,
filterOptions: filterOptions,
onFilter: onFilter,
filterIconClassName: 'p-multeselect-filter-icon pi pi-search',
props: props
};
content = ObjectUtils.getJSXElement(props.filterTemplate, defaultContentOptions);
}
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, content);
}
return null;
};
var filterElement = createFilterElement();
var checkboxElement = props.showSelectAll && /*#__PURE__*/React__namespace.createElement(Checkbox, {
checked: props.selectAll,
onChange: onSelectAll,
role: "checkbox",
"aria-checked": props.selectAll
});
var closeElement = /*#__PURE__*/React__namespace.createElement("button", {
type: "button",
className: "p-multiselect-close p-link",
"aria-label": localeOption('close'),
onClick: props.onClose
}, /*#__PURE__*/React__namespace.createElement("span", {
className: "p-multiselect-close-icon pi pi-times",
"aria-hidden": "true"
}), /*#__PURE__*/React__namespace.createElement(Ripple, null));
var element = /*#__PURE__*/React__namespace.createElement("div", {
className: "p-multiselect-header"
}, checkboxElement, filterElement, closeElement);
if (props.template) {
var defaultOptions = {
className: 'p-multiselect-header',
checkboxElement: checkboxElement,
checked: props.selectAll,
onChange: onSelectAll,
filterElement: filterElement,
closeElement: closeElement,
closeElementClassName: 'p-multiselect-close p-link',
closeIconClassName: 'p-multiselect-close-icon pi pi-times',
onCloseClick: props.onClose,
element: element,
props: props
};
return ObjectUtils.getJSXElement(props.template, defaultOptions);
}
return element;
});
MultiSelectHeader.displayName = 'MultiSelectHeader';
var MultiSelectItem = /*#__PURE__*/React__namespace.memo(function (props) {
var onClick = function onClick(event) {
if (props.onClick) {
props.onClick({
originalEvent: event,
option: props.option
});
}
event.preventDefault();
};
var onKeyDown = function onKeyDown(event) {
if (props.onKeyDown) {
props.onKeyDown({
originalEvent: event,
option: props.option
});
}
};
var className = classNames('p-multiselect-item', {
'p-highlight': props.selected,
'p-disabled': props.disabled
}, props.className, props.option.className);
var checkboxClassName = classNames('p-checkbox-box', {
'p-highlight': props.selected
});
var checkboxIcon = classNames('p-checkbox-icon p-c', {
'pi pi-check': props.selected
});
var content = props.template ? ObjectUtils.getJSXElement(props.template, props.option) : props.label;
var tabIndex = props.disabled ? null : props.tabIndex || 0;
return /*#__PURE__*/React__namespace.createElement("li", {
className: className,
style: props.style,
onClick: onClick,
tabIndex: tabIndex,
onKeyDown: onKeyDown,
role: "option",
"aria-selected": props.selected
}, /*#__PURE__*/React__namespace.createElement("div", {
className: "p-checkbox p-component"
}, /*#__PURE__*/React__namespace.createElement("div", {
className: checkboxClassName
}, /*#__PURE__*/React__namespace.createElement("span", {
className: checkboxIcon
}))), /*#__PURE__*/React__namespace.createElement("span", null, content), /*#__PURE__*/React__namespace.createElement(Ripple, null));
});
MultiSelectItem.displayName = 'MultiSelectItem';
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; }
var MultiSelectPanel = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (props, ref) {
var virtualScrollerRef = React__namespace.useRef(null);
var filterInputRef = React__namespace.useRef(null);
var onEnter = function onEnter() {
props.onEnter(function () {
if (virtualScrollerRef.current) {
var selectedIndex = props.getSelectedOptionIndex();
if (selectedIndex !== -1) {
setTimeout(function () {
return virtualScrollerRef.current.scrollToIndex(selectedIndex);
}, 0);
}
}
});
};
var onEntered = function onEntered() {
props.onEntered(function () {
if (props.filter && filterInputRef.current) {
DomHandler.focus(filterInputRef.current, false);
}
});
};
var onFilterInputChange = function onFilterInputChange(event) {
if (virtualScrollerRef.current) {
virtualScrollerRef.current.scrollToIndex(0);
}
props.onFilterInputChange && props.onFilterInputChange(event);
};
var isEmptyFilter = function isEmptyFilter() {
return !(props.visibleOptions && props.visibleOptions.length) && props.hasFilter;
};
var createHeader = function createHeader() {
return /*#__PURE__*/React__namespace.createElement(MultiSelectHeader, {
filter: props.filter,
filterRef: filterInputRef,
filterValue: props.filterValue,
filterTemplate: props.filterTemplate,
onFilter: onFilterInputChange,
filterPlaceholder: props.filterPlaceholder,
onClose: props.onCloseClick,
showSelectAll: props.showSelectAll,
selectAll: props.isAllSelected(),
onSelectAll: props.onSelectAll,
template: props.panelHeaderTemplate,
resetFilter: props.resetFilter
});
};
var createFooter = function createFooter() {
if (props.panelFooterTemplate) {
var content = ObjectUtils.getJSXElement(props.panelFooterTemplate, props, props.onOverlayHide);
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-multiselect-footer"
}, content);
}
return null;
};
var createGroupChildren = function createGroupChildren(optionGroup, style) {
var groupChildren = props.getOptionGroupChildren(optionGroup);
return groupChildren.map(function (option, j) {
var optionLabel = props.getOptionLabel(option);
var optionKey = j + '_' + props.getOptionRenderKey(option);
var disabled = props.isOptionDisabled(option);
var tabIndex = disabled ? null : props.tabIndex || 0;
var selected = props.isSelected(option);
return /*#__PURE__*/React__namespace.createElement(MultiSelectItem, {
key: optionKey,
label: optionLabel,
option: option,
style: style,
template: props.itemTemplate,
selected: selected,
onClick: props.onOptionSelect,
onKeyDown: props.onOptionKeyDown,
tabIndex: tabIndex,
disabled: disabled,
className: props.itemClassName
});
});
};
var createEmptyFilter = function createEmptyFilter() {
var emptyFilterMessage = ObjectUtils.getJSXElement(props.emptyFilterMessage, props) || localeOption('emptyFilterMessage');
return /*#__PURE__*/React__namespace.createElement("li", {
className: "p-multiselect-empty-message"
}, emptyFilterMessage);
};
var createItem = function createItem(option, index) {
var scrollerOptions = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
var style = {
height: scrollerOptions.props ? scrollerOptions.props.itemSize : undefined
};
if (props.optionGroupLabel) {
var groupContent = props.optionGroupTemplate ? ObjectUtils.getJSXElement(props.optionGroupTemplate, option, index) : props.getOptionGroupLabel(option);
var groupChildrenContent = createGroupChildren(option, style);
var key = index + '_' + props.getOptionGroupRenderKey(option);
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, {
key: key
}, /*#__PURE__*/React__namespace.createElement("li", {
className: "p-multiselect-item-group",
style: style
}, groupContent), groupChildrenContent);
} else {
var optionLabel = props.getOptionLabel(option);
var optionKey = index + '_' + props.getOptionRenderKey(option);
var disabled = props.isOptionDisabled(option);
var tabIndex = disabled ? null : props.tabIndex || 0;
var selected = props.isSelected(option);
return /*#__PURE__*/React__namespace.createElement(MultiSelectItem, {
key: optionKey,
label: optionLabel,
option: option,
style: style,
template: props.itemTemplate,
selected: selected,
onClick: props.onOptionSelect,
onKeyDown: props.onOptionKeyDown,
tabIndex: tabIndex,
disabled: disabled,
className: props.itemClassName
});
}
};
var createItems = function createItems() {
if (ObjectUtils.isNotEmpty(props.visibleOptions)) {
return props.visibleOptions.map(createItem);
} else if (props.hasFilter) {
return createEmptyFilter();
}
return null;
};
var createContent = function createContent() {
if (props.virtualScrollerOptions) {
var virtualScrollerProps = _objectSpread$c(_objectSpread$c({}, props.virtualScrollerOptions), {
style: _objectSpread$c(_objectSpread$c({}, props.virtualScrollerOptions.style), {
height: props.scrollHeight
}),
className: classNames('p-multiselect-items-wrapper', props.virtualScrollerOptions.className),
items: props.visibleOptions,
autoSize: true,
onLazyLoad: function onLazyLoad(event) {
return props.virtualScrollerOptions.onLazyLoad(_objectSpread$c(_objectSpread$c({}, event), {
filter: props.filterValue
}));
},
itemTemplate: function itemTemplate(item, options) {
return item && createItem(item, options.index, options);
},
contentTemplate: function contentTemplate(options) {
var className = classNames('p-multiselect-items p-component', options.className);
var content = isEmptyFilter() ? createEmptyFilter() : options.children;
return /*#__PURE__*/React__namespace.createElement("ul", {
ref: options.contentRef,
style: options.style,
className: className,
role: "listbox",
"aria-multiselectable": true
}, content);
}
});
return /*#__PURE__*/React__namespace.createElement(VirtualScroller, _extends({
ref: virtualScrollerRef
}, virtualScrollerProps));
} else {
var items = createItems();
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-multiselect-items-wrapper",
style: {
maxHeight: props.scrollHeight
}
}, /*#__PURE__*/React__namespace.createElement("ul", {
className: "p-multiselect-items p-component",
role: "listbox",
"aria-multiselectable": true
}, items));
}
};
var createElement = function createElement() {
var allowOptionSelect = props.allowOptionSelect();
var panelClassName = classNames('p-multiselect-panel p-component', {
'p-multiselect-inline': props.inline,
'p-multiselect-flex': props.flex,
'p-multiselect-limited': !allowOptionSelect,
'p-input-filled': PrimeReact.inputStyle === 'filled',
'p-ripple-disabled': PrimeReact.ripple === false
}, props.panelClassName);
var header = createHeader();
var content = createContent();
var footer = createFooter();
if (props.inline) {
return /*#__PURE__*/React__namespace.createElement("div", {
ref: ref,
className: panelClassName,
style: props.panelStyle,
onClick: props.onClick
}, content, footer);
}
return /*#__PURE__*/React__namespace.createElement(CSSTransition, {
nodeRef: ref,
classNames: "p-connected-overlay",
"in": props["in"],
timeout: {
enter: 120,
exit: 100
},
options: props.transitionOptions,
unmountOnExit: true,
onEnter: onEnter,
onEntered: onEntered,
onExit: props.onExit,
onExited: props.onExited
}, /*#__PURE__*/React__namespace.createElement("div", {
ref: ref,
className: panelClassName,
style: props.panelStyle,
onClick: props.onClick
}, header, content, footer));
};
var element = createElement();
if (props.inline) return element;
return /*#__PURE__*/React__namespace.createElement(Portal, {
element: element,
appendTo: props.appendTo
});
}));
MultiSelectPanel.displayName = 'MultiSelectPanel';
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 _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; }
var MultiSelect = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = MultiSelectBase.getProps(inProps);
var _React$useState = React__namespace.useState(''),
_React$useState2 = _slicedToArray(_React$useState, 2),
filterState = _React$useState2[0],
setFilterState = _React$useState2[1];
var _React$useState3 = React__namespace.useState(false),
_React$useState4 = _slicedToArray(_React$useState3, 2),
focusedState = _React$useState4[0],
setFocusedState = _React$useState4[1];
var _React$useState5 = React__namespace.useState(props.inline),
_React$useState6 = _slicedToArray(_React$useState5, 2),
overlayVisibleState = _React$useState6[0],
setOverlayVisibleState = _React$useState6[1];
var elementRef = React__namespace.useRef(null);
var inputRef = React__namespace.useRef(props.inputRef);
var labelRef = React__namespace.useRef(null);
var overlayRef = React__namespace.useRef(null);
var hasFilter = filterState && filterState.trim().length > 0;
var empty = ObjectUtils.isEmpty(props.value);
var equalityKey = props.optionValue ? null : props.dataKey;
var _useOverlayListener = useOverlayListener({
target: elementRef,
overlay: overlayRef,
listener: function listener(event, _ref) {
var type = _ref.type,
valid = _ref.valid;
if (valid) {
type === 'outside' ? !isClearClicked(event) && hide() : hide();
}
},
when: overlayVisibleState
}),
_useOverlayListener2 = _slicedToArray(_useOverlayListener, 2),
bindOverlayListener = _useOverlayListener2[0],
unbindOverlayListener = _useOverlayListener2[1];
var onPanelClick = function onPanelClick(event) {
OverlayService.emit('overlay-click', {
originalEvent: event,
target: elementRef.current
});
};
var allowOptionSelect = function allowOptionSelect() {
return !props.selectionLimit || !props.value || props.value && props.value.length < props.selectionLimit;
};
var onOptionSelect = function onOptionSelect(event) {
var originalEvent = event.originalEvent,
option = event.option;
if (props.disabled || isOptionDisabled(option)) {
return;
}
var optionValue = getOptionValue(option);
var isUsed = isOptionValueUsed(option);
var selected = isSelected(option);
var allowSelect = allowOptionSelect();
if (selected) updateModel(originalEvent, props.value.filter(function (val) {
return !ObjectUtils.equals(isUsed ? val : getOptionValue(val), optionValue, equalityKey);
}));else if (allowSelect) updateModel(originalEvent, [].concat(_toConsumableArray(props.value || []), [optionValue]));
};
var onOptionKeyDown = function onOptionKeyDown(event) {
var originalEvent = event.originalEvent;
var listItem = originalEvent.currentTarget;
switch (originalEvent.which) {
//down
case 40:
var nextItem = findNextItem(listItem);
nextItem && nextItem.focus();
originalEvent.preventDefault();
break;
//up
case 38:
var prevItem = findPrevItem(listItem);
prevItem && prevItem.focus();
originalEvent.preventDefault();
break;
//enter and space
case 13:
case 32:
onOptionSelect(event);
originalEvent.preventDefault();
break;
//escape
case 27:
hide();
DomHandler.focus(inputRef.current);
break;
}
};
var findNextItem = function findNextItem(item) {
var nextItem = item.nextElementSibling;
return nextItem ? DomHandler.hasClass(nextItem, 'p-disabled') || DomHandler.hasClass(nextItem, 'p-multiselect-item-group') ? findNextItem(nextItem) : nextItem : null;
};
var findPrevItem = function findPrevItem(item) {
var prevItem = item.previousElementSibling;
return prevItem ? DomHandler.hasClass(prevItem, 'p-disabled') || DomHandler.hasClass(prevItem, 'p-multiselect-item-group') ? findPrevItem(prevItem) : prevItem : null;
};
var onClick = function onClick(event) {
if (!props.inline && !props.disabled && !isPanelClicked(event) && !DomHandler.hasClass(event.target, 'p-multiselect-token-icon') && !isClearClicked(event)) {
overlayVisibleState ? hide() : show();
DomHandler.focus(inputRef.current);
event.preventDefault();
}
};
var onKeyDown = function onKeyDown(event) {
switch (event.which) {
//down
case 40:
if (props.inline) break;
if (!overlayVisibleState && event.altKey) {
show();
event.preventDefault();
}
break;
//space
case 32:
if (props.inline) break;
overlayVisibleState ? hide() : show();
event.preventDefault();
break;
//escape
case 27:
if (props.inline) break;
hide();
break;
//tab
case 9:
if (overlayVisibleState) {
var firstFocusableElement = DomHandler.getFirstFocusableElement(overlayRef.current);
if (firstFocusableElement) {
firstFocusableElement.focus();
event.preventDefault();
}
}
break;
}
};
var onSelectAll = function onSelectAll(event) {
if (props.onSelectAll) {
props.onSelectAll(event);
} else {
var value = null;
if (event.checked) {
value = [];
if (visibleOptions) {
var selectedOptions = visibleOptions.filter(function (option) {
return isOptionDisabled(option) && isSelected(option);
});
value = selectedOptions.map(function (option) {
return getOptionValue(option);
});
}
} else if (visibleOptions) {
var options = visibleOptions.filter(function (option) {
return !isOptionDisabled(option);
});
if (props.optionGroupLabel) {
value = [];
options.forEach(function (optionGroup) {
return value = [].concat(_toConsumableArray(value), _toConsumableArray(getOptionGroupChildren(optionGroup).filter(function (option) {
return !isOptionDisabled(option);
}).map(function (option) {
return getOptionValue(option);
})));
});
} else {
value = options.map(function (option) {
return getOptionValue(option);
});
}
}
updateModel(event.originalEvent, value);
}
};
var updateModel = function updateModel(event, value) {
if (props.onChange) {
props.onChange({
originalEvent: event,
value: value,
stopPropagation: function stopPropagation() {},
preventDefault: function preventDefault() {},
target: {
name: props.name,
id: props.id,
value: value
}
});
}
};
var onFilterInputChange = function onFilterInputChange(event) {
var filter = event.query;
setFilterState(filter);
if (props.onFilter) {
props.onFilter({
originalEvent: event,
filter: filter
});
}
};
var resetFilter = function resetFilter() {
setFilterState('');
props.onFilter && props.onFilter({
filter: ''
});
};
var scrollInView = function scrollInView() {
var highlightItem = DomHandler.findSingle(overlayRef.current, 'li.p-highlight');
if (highlightItem && highlightItem.scrollIntoView) {
highlightItem.scrollIntoView({
block: 'nearest',
inline: 'nearest'
});
}
};
var show = function show() {
setOverlayVisibleState(true);
};
var hide = function hide() {
setOverlayVisibleState(false);
};
var onOverlayEnter = function onOverlayEnter(callback) {
ZIndexUtils.set('overlay', overlayRef.current, PrimeReact.autoZIndex, PrimeReact.zIndex['overlay']);
alignOverlay();
scrollInView();
callback && callback();
};
var onOverlayEntered = function onOverlayEntered(callback) {
callback && callback();
bindOverlayListener();
props.onShow && props.onShow();
};
var onOverlayExit = function onOverlayExit() {
unbindOverlayListener();
};
var onOverlayExited = function onOverlayExited() {
if (props.filter && props.resetFilterOnHide) {
resetFilter();
}
ZIndexUtils.clear(overlayRef.current);
props.onHide && props.onHide();
};
var alignOverlay = function alignOverlay() {
DomHandler.alignOverlay(overlayRef.current, labelRef.current.parentElement, props.appendTo || PrimeReact.appendTo);
};
var isClearClicked = function isClearClicked(event) {
return DomHandler.hasClass(event.target, 'p-multiselect-clear-icon');
};
var isPanelClicked = function isPanelClicked(event) {
return overlayRef.current && overlayRef.current.contains(event.target);
};
var onCloseClick = function onCloseClick(event) {
hide();
DomHandler.focus(inputRef.current);
event.preventDefault();
event.stopPropagation();
};
var getSelectedOptionIndex = function getSelectedOptionIndex() {
if (props.value != null && props.options) {
if (props.optionGroupLabel) {
var groupIndex = 0;
var optionIndex = props.options.findIndex(function (optionGroup, i) {
return (groupIndex = i) && findOptionIndexInList(props.value, getOptionGroupChildren(optionGroup)) !== -1;
});
return optionIndex !== -1 ? {
group: groupIndex,
option: optionIndex
} : -1;
} else {
return findOptionIndexInList(props.value, props.options);
}
}
return -1;
};
var findOptionIndexInList = function findOptionIndexInList(value, list) {
return list.findIndex(function (item) {
return value.some(function (val) {
return ObjectUtils.equals(val, getOptionValue(item), equalityKey);
});
});
};
var isSelected = function isSelected(option) {
if (props.value) {
var optionValue = getOptionValue(option);
var isUsed = isOptionValueUsed(option);
return props.value.some(function (val) {
return ObjectUtils.equals(isUsed ? val : getOptionValue(val), optionValue, equalityKey);
});
}
return false;
};
var getLabelByValue = function getLabelByValue(val) {
var option;
if (props.options) {
if (props.optionGroupLabel) {
var _iterator = _createForOfIteratorHelper$7(props.options),
_step;
try {
for (_iterator.s(); !(_step = _iterator.n()).done;) {
var optionGroup = _step.value;
option = findOptionByValue(val, getOptionGroupChildren(optionGroup));
if (option) {
break;
}
}
} catch (err) {
_iterator.e(err);
} finally {
_iterator.f();
}
} else {
option = findOptionByValue(val, props.options);
}
}
return option ? getOptionLabel(option) : null;
};
var findOptionByValue = function findOptionByValue(val, list) {
return list.find(function (option) {
return ObjectUtils.equals(getOptionValue(option), val, equalityKey);
});
};
var onFocus = function onFocus(event) {
setFocusedState(true);
props.onFocus && props.onFocus(event);
};
var onBlur = function onBlur(event) {
setFocusedState(false);
props.onBlur && props.onBlur(event);
};
var isAllSelected = function isAllSelected() {
if (props.onSelectAll) {
return props.selectAll;
} else {
if (ObjectUtils.isEmpty(visibleOptions)) {
return false;
}
var options = visibleOptions.filter(function (option) {
return !isOptionDisabled(option);
});
if (props.optionGroupLabel) {
var _iterator2 = _createForOfIteratorHelper$7(options),
_step2;
try {
for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
var optionGroup = _step2.value;
var visibleOptionsGroupChildren = getOptionGroupChildren(optionGroup).filter(function (option) {
return !isOptionDisabled(option);
});
return !visibleOptionsGroupChildren.some(function (option) {
return !isSelected(option);
});
}
} catch (err) {
_iterator2.e(err);
} finally {
_iterator2.f();
}
} else {
return !options.some(function (option) {
return !isSelected(option);
});
}
}
return true;
};
var getOptionLabel = function getOptionLabel(option) {
return props.optionLabel ? ObjectUtils.resolveFieldData(option, props.optionLabel) : option && option['label'] !== undefined ? option['label'] : option;
};
var getOptionValue = function getOptionValue(option) {
if (props.useOptionAsValue) {
return option;
}
if (props.optionValue) {
var data = ObjectUtils.resolveFieldData(option, props.optionValue);
return data !== null ? data : option;
}
return option && option['value'] !== undefined ? option['value'] : option;
};
var getOptionRenderKey = function getOptionRenderKey(option) {
return props.dataKey ? ObjectUtils.resolveFieldData(option, props.dataKey) : getOptionLabel(option);
};
var getOptionGroupRenderKey = function getOptionGroupRenderKey(optionGroup) {
return ObjectUtils.resolveFieldData(optionGroup, props.optionGroupLabel);
};
var getOptionGroupLabel = function getOptionGroupLabel(optionGroup) {
return ObjectUtils.resolveFieldData(optionGroup, props.optionGroupLabel);
};
var getOptionGroupChildren = function getOptionGroupChildren(optionGroup) {
return ObjectUtils.resolveFieldData(optionGroup, props.optionGroupChildren);
};
var isOptionDisabled = function isOptionDisabled(option) {
if (props.optionDisabled) {
return ObjectUtils.isFunction(props.optionDisabled) ? props.optionDisabled(option) : ObjectUtils.resolveFieldData(option, props.optionDisabled);
}
return option && option['disabled'] !== undefined ? option['disabled'] : false;
};
var isOptionValueUsed = function isOptionValueUsed(option) {
return !props.useOptionAsValue && props.optionValue || option && option['value'] !== undefined;
};
var removeChip = function removeChip(event, item) {
var value = props.value.filter(function (val) {
return !ObjectUtils.equals(val, item, equalityKey);
});
updateModel(event, value);
};
var getSelectedItemsLabel = function getSelectedItemsLabel() {
var pattern = /{(.*?)}/;
if (pattern.test(props.selectedItemsLabel)) {
return props.selectedItemsLabel.replace(props.selectedItemsLabel.match(pattern)[0], props.value.length + '');
}
return props.selectedItemsLabel;
};
var getLabel = function getLabel() {
var label;
if (!empty && !props.fixedPlaceholder) {
if (ObjectUtils.isNotEmpty(props.maxSelectedLabels) && props.value.length > props.maxSelectedLabels) {
return getSelectedItemsLabel();
} else {
return props.value.reduce(function (acc, value, index) {
return acc + (index !== 0 ? ',' : '') + getLabelByValue(value);
}, '');
}
}
return label;
};
var getLabelContent = function getLabelContent() {
if (props.selectedItemTemplate) {
if (!empty) {
if (ObjectUtils.isNotEmpty(props.maxSelectedLabels) && props.value.length > props.maxSelectedLabels) {
return getSelectedItemsLabel();
} else {
return props.value.map(function (val, index) {
var item = ObjectUtils.getJSXElement(props.selectedItemTemplate, val);
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, {
key: index
}, item);
});
}
} else {
return ObjectUtils.getJSXElement(props.selectedItemTemplate);
}
} else {
if (props.display === 'chip' && !empty) {
var value = props.value.slice(0, props.maxSelectedLabels || props.value.length);
return value.map(function (val) {
var label = getLabelByValue(val);
var icon = !props.disabled && IconUtils.getJSXIcon(props.removeIcon, {
className: 'p-multiselect-token-icon',
onClick: function onClick(e) {
return removeChip(e, val);
}
}, {
props: props
});
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-multiselect-token",
key: label
}, /*#__PURE__*/React__namespace.createElement("span", {
className: "p-multiselect-token-label"
}, label), icon);
});
}
return getLabel();
}
};
var getVisibleOptions = function getVisibleOptions() {
if (hasFilter) {
var filterValue = filterState.trim().toLocaleLowerCase(props.filterLocale);
var searchFields = props.filterBy ? props.filterBy.split(',') : [props.optionLabel || 'label'];
if (props.optionGroupLabel) {
var filteredGroups = [];
var _iterator3 = _createForOfIteratorHelper$7(props.options),
_step3;
try {
for (_iterator3.s(); !(_step3 = _iterator3.n()).done;) {
var optgroup = _step3.value;
var filteredSubOptions = FilterService.filter(getOptionGroupChildren(optgroup), searchFields, filterValue, props.filterMatchMode, props.filterLocale);
if (filteredSubOptions && filteredSubOptions.length) {
filteredGroups.push(_objectSpread$b(_objectSpread$b({}, optgroup), _defineProperty({}, props.optionGroupChildren, filteredSubOptions)));
}
}
} catch (err) {
_iterator3.e(err);
} finally {
_iterator3.f();
}
return filteredGroups;
} else {
return FilterService.filter(props.options, searchFields, filterValue, props.filterMatchMode, props.filterLocale);
}
} else {
return props.options;
}
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
show: show,
hide: hide,
focus: function focus() {
return DomHandler.focus(inputRef.current);
},
getElement: function getElement() {
return elementRef.current;
},
getOverlay: function getOverlay() {
return overlayRef.current;
},
getInput: function getInput() {
return inputRef.current;
}
};
});
React__namespace.useEffect(function () {
ObjectUtils.combinedRefs(inputRef, props.inputRef);
}, [inputRef, props.inputRef]);
React__namespace.useEffect(function () {
setTimeout(function () {
props.overlayVisible ? show() : hide();
}, 100);
}, [props.overlayVisible]);
useUpdateEffect(function () {
if (overlayVisibleState && hasFilter) {
alignOverlay();
}
}, [overlayVisibleState, hasFilter]);
useUnmountEffect(function () {
ZIndexUtils.clear(overlayRef.current);
});
var createClearIcon = function createClearIcon() {
if (!empty && props.showClear && !props.disabled) {
return /*#__PURE__*/React__namespace.createElement("i", {
className: "p-multiselect-clear-icon pi pi-times",
onClick: function onClick(e) {
return updateModel(e, null);
}
});
}
return null;
};
var createLabel = function createLabel() {
var content = getLabelContent();
var className = classNames('p-multiselect-label', {
'p-placeholder': empty && props.placeholder,
'p-multiselect-label-empty': empty && !props.placeholder && !props.selectedItemTemplate,
'p-multiselect-items-label': !empty && props.display !== 'chip' && props.value.length > props.maxSelectedLabels
});
return /*#__PURE__*/React__namespace.createElement("div", {
ref: labelRef,
className: "p-multiselect-label-container"
}, /*#__PURE__*/React__namespace.createElement("div", {
className: className
}, content || props.placeholder || 'empty'));
};
var visibleOptions = getVisibleOptions();
var hasTooltip = ObjectUtils.isNotEmpty(props.tooltip);
var otherProps = MultiSelectBase.getOtherProps(props);
var ariaProps = ObjectUtils.reduceKeys(otherProps, DomHandler.ARIA_PROPS);
var className = classNames('p-multiselect p-component p-inputwrapper', {
'p-multiselect-chip': props.display === 'chip',
'p-disabled': props.disabled,
'p-multiselect-clearable': props.showClear && !props.disabled,
'p-focus': focusedState,
'p-inputwrapper-filled': ObjectUtils.isNotEmpty(props.value),
'p-inputwrapper-focus': focusedState || overlayVisibleState
}, props.className);
var label = !props.inline && createLabel();
var clearIcon = !props.inline && createClearIcon();
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement("div", _extends({
ref: elementRef,
id: props.id,
style: props.style,
className: className
}, otherProps, {
onClick: onClick
}), /*#__PURE__*/React__namespace.createElement("div", {
className: "p-hidden-accessible"
}, /*#__PURE__*/React__namespace.createElement("input", _extends({
ref: inputRef,
id: props.inputId,
name: props.name,
readOnly: true,
type: "text",
onFocus: onFocus,
onBlur: onBlur,
onKeyDown: onKeyDown,
role: "listbox",
"aria-expanded": overlayVisibleState,
disabled: props.disabled,
tabIndex: props.tabIndex
}, ariaProps))), !props.inline && /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, label, clearIcon, /*#__PURE__*/React__namespace.createElement("div", {
className: "p-multiselect-trigger"
}, IconUtils.getJSXIcon(props.dropdownIcon, {
className: 'p-multiselect-trigger-icon p-c'
}, {
props: props
}))), /*#__PURE__*/React__namespace.createElement(MultiSelectPanel, _extends({
ref: overlayRef,
visibleOptions: visibleOptions
}, props, {
onClick: onPanelClick,
onOverlayHide: hide,
filterValue: filterState,
hasFilter: hasFilter,
onFilterInputChange: onFilterInputChange,
resetFilter: resetFilter,
onCloseClick: onCloseClick,
onSelectAll: onSelectAll,
getOptionLabel: getOptionLabel,
getOptionRenderKey: getOptionRenderKey,
isOptionDisabled: isOptionDisabled,
getOptionGroupChildren: getOptionGroupChildren,
getOptionGroupLabel: getOptionGroupLabel,
getOptionGroupRenderKey: getOptionGroupRenderKey,
isSelected: isSelected,
getSelectedOptionIndex: getSelectedOptionIndex,
isAllSelected: isAllSelected,
onOptionSelect: onOptionSelect,
allowOptionSelect: allowOptionSelect,
onOptionKeyDown: onOptionKeyDown,
"in": overlayVisibleState,
onEnter: onOverlayEnter,
onEntered: onOverlayEntered,
onExit: onOverlayExit,
onExited: onOverlayExited
}))), hasTooltip && /*#__PURE__*/React__namespace.createElement(Tooltip, _extends({
target: elementRef,
content: props.tooltip
}, props.tooltipOptions)));
}));
MultiSelect.displayName = 'MultiSelect';
var MultiStateCheckboxBase = {
defaultProps: {
__TYPE: 'MultiStateCheckbox',
id: null,
value: null,
options: null,
optionValue: null,
optionLabel: null,
optionIcon: null,
iconTemplate: null,
dataKey: null,
style: null,
className: null,
disabled: false,
readOnly: false,
empty: true,
tabIndex: '0',
tooltip: null,
tooltipOptions: null,
onChange: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, MultiStateCheckboxBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, MultiStateCheckboxBase.defaultProps);
}
};
var MultiStateCheckbox = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = MultiStateCheckboxBase.getProps(inProps);
var _React$useState = React__namespace.useState(false),
_React$useState2 = _slicedToArray(_React$useState, 2),
focusedState = _React$useState2[0],
setFocusedState = _React$useState2[1];
var elementRef = React__namespace.useRef(null);
var equalityKey = props.optionValue ? null : props.dataKey;
var onClick = function onClick(event) {
if (!props.disabled && !props.readOnly) {
toggle(event);
}
};
var getOptionValue = function getOptionValue(option) {
return props.optionValue ? ObjectUtils.resolveFieldData(option, props.optionValue) : option;
};
var getOptionIcon = function getOptionIcon(option) {
return ObjectUtils.resolveFieldData(option, props.optionIcon || 'icon');
};
var getOptionAriaLabel = function getOptionAriaLabel(option) {
var ariaField = props.optionLabel || props.optionValue;
return ariaField ? ObjectUtils.resolveFieldData(option, ariaField) : option;
};
var findNextOption = function findNextOption() {
if (props.options) {
return selectedOptionIndex === props.options.length - 1 ? props.empty ? null : props.options[0] : props.options[selectedOptionIndex + 1];
}
return null;
};
var toggle = function toggle(event) {
if (props.onChange) {
var newValue = getOptionValue(findNextOption());
props.onChange({
originalEvent: event,
value: newValue,
stopPropagation: function stopPropagation() {},
preventDefault: function preventDefault() {},
target: {
name: props.name,
id: props.id,
value: newValue
}
});
}
};
var onFocus = function onFocus() {
setFocusedState(true);
};
var onBlur = function onBlur() {
setFocusedState(false);
};
var onKeyDown = function onKeyDown(e) {
if (e.keyCode === 32) {
toggle(e);
e.preventDefault();
}
};
var getSelectedOptionMap = function getSelectedOptionMap() {
var option, index;
if (props.options) {
index = props.options.findIndex(function (option) {
return ObjectUtils.equals(props.value, getOptionValue(option), equalityKey);
});
option = props.options[index];
}
return {
option: option,
index: index
};
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
focus: function focus() {
return DomHandler.focusFirstElement(elementRef.current);
},
getElement: function getElement() {
return elementRef.current;
}
};
});
useMountEffect(function () {
if (!props.empty && props.value === null) {
toggle();
}
});
var createIcon = function createIcon() {
var icon = selectedOption && getOptionIcon(selectedOption) || '';
var className = classNames('p-checkbox-icon p-c', _defineProperty({}, "".concat(icon), true));
var content = /*#__PURE__*/React__namespace.createElement("span", {
className: className
});
if (props.iconTemplate) {
var defaultOptions = {
option: selectedOption,
className: className,
element: content,
props: props
};
return ObjectUtils.getJSXElement(props.iconTemplate, defaultOptions);
}
return content;
};
var _getSelectedOptionMap = getSelectedOptionMap(),
selectedOption = _getSelectedOptionMap.option,
selectedOptionIndex = _getSelectedOptionMap.index;
var hasTooltip = ObjectUtils.isNotEmpty(props.tooltip);
var otherProps = MultiStateCheckboxBase.getOtherProps(props);
var ariaProps = ObjectUtils.reduceKeys(otherProps, DomHandler.ARIA_PROPS);
var className = classNames('p-multistatecheckbox p-checkbox p-component', props.className, {
'p-checkbox-disabled': props.disabled
});
var boxClassName = classNames('p-checkbox-box', {
'p-highlight': !!selectedOption,
'p-disabled': props.disabled,
'p-focus': focusedState
}, selectedOption && selectedOption.className);
var icon = createIcon();
var ariaValueLabel = !!selectedOption ? getOptionAriaLabel(selectedOption) : ariaLabel('nullLabel');
var ariaChecked = !!selectedOption ? 'true' : 'false';
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement("div", _extends({
ref: elementRef,
id: props.id,
className: className,
style: props.style
}, otherProps, {
onClick: onClick
}), /*#__PURE__*/React__namespace.createElement("div", _extends({
className: boxClassName,
style: selectedOption && selectedOption.style,
tabIndex: props.tabIndex,
onFocus: onFocus,
onBlur: onBlur,
onKeyDown: onKeyDown,
role: "checkbox",
"aria-checked": ariaChecked
}, ariaProps), icon), focusedState && /*#__PURE__*/React__namespace.createElement("span", {
className: "p-sr-only",
"aria-live": "polite"
}, ariaValueLabel)), hasTooltip && /*#__PURE__*/React__namespace.createElement(Tooltip, _extends({
target: elementRef,
content: props.tooltip
}, props.tooltipOptions)));
}));
MultiStateCheckbox.displayName = 'MultiStateCheckbox';
var OrderListBase = {
defaultProps: {
__TYPE: 'OrderList',
id: null,
value: null,
header: null,
style: null,
className: null,
listStyle: null,
dragdrop: false,
tabIndex: 0,
dataKey: null,
breakpoint: '960px',
onChange: null,
itemTemplate: null,
filter: false,
filterBy: null,
filterMatchMode: 'contains',
filterLocale: undefined,
filterPlaceholder: null,
filterTemplate: null,
onFilter: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, OrderListBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, OrderListBase.defaultProps);
}
};
var OrderListControls = /*#__PURE__*/React__namespace.memo(function (props) {
var moveUp = function moveUp(event) {
if (props.selection) {
var value = _toConsumableArray(props.value);
for (var i = 0; i < props.selection.length; i++) {
var selectedItem = props.selection[i];
var selectedItemIndex = ObjectUtils.findIndexInList(selectedItem, value, props.dataKey);
if (selectedItemIndex !== 0) {
var movedItem = value[selectedItemIndex];
var temp = value[selectedItemIndex - 1];
value[selectedItemIndex - 1] = movedItem;
value[selectedItemIndex] = temp;
} else {
break;
}
}
if (props.onReorder) {
props.onReorder({
originalEvent: event,
value: value,
direction: 'up'
});
}
}
};
var moveTop = function moveTop(event) {
if (props.selection) {
var value = _toConsumableArray(props.value);
for (var i = 0; i < props.selection.length; i++) {
var selectedItem = props.selection[i];
var selectedItemIndex = ObjectUtils.findIndexInList(selectedItem, value, props.dataKey);
if (selectedItemIndex !== 0) {
var movedItem = value.splice(selectedItemIndex, 1)[0];
value.unshift(movedItem);
} else {
break;
}
}
if (props.onReorder) {
props.onReorder({
originalEvent: event,
value: value,
direction: 'top'
});
}
}
};
var moveDown = function moveDown(event) {
if (props.selection) {
var value = _toConsumableArray(props.value);
for (var i = props.selection.length - 1; i >= 0; i--) {
var selectedItem = props.selection[i];
var selectedItemIndex = ObjectUtils.findIndexInList(selectedItem, value, 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 (props.onReorder) {
props.onReorder({
originalEvent: event,
value: value,
direction: 'down'
});
}
}
};
var moveBottom = function moveBottom(event) {
if (props.selection) {
var value = _toConsumableArray(props.value);
for (var i = props.selection.length - 1; i >= 0; i--) {
var selectedItem = props.selection[i];
var selectedItemIndex = ObjectUtils.findIndexInList(selectedItem, value, props.dataKey);
if (selectedItemIndex !== value.length - 1) {
var movedItem = value.splice(selectedItemIndex, 1)[0];
value.push(movedItem);
} else {
break;
}
}
if (props.onReorder) {
props.onReorder({
originalEvent: event,
value: value,
direction: 'bottom'
});
}
}
};
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-orderlist-controls"
}, /*#__PURE__*/React__namespace.createElement(Button, {
type: "button",
icon: "pi pi-angle-up",
onClick: moveUp
}), /*#__PURE__*/React__namespace.createElement(Button, {
type: "button",
icon: "pi pi-angle-double-up",
onClick: moveTop
}), /*#__PURE__*/React__namespace.createElement(Button, {
type: "button",
icon: "pi pi-angle-down",
onClick: moveDown
}), /*#__PURE__*/React__namespace.createElement(Button, {
type: "button",
icon: "pi pi-angle-double-down",
onClick: moveBottom
}));
});
OrderListControls.displayName = 'OrderListControls';
var OrderListSubList = /*#__PURE__*/React__namespace.memo(function (props) {
var dragging = React__namespace.useRef(null);
var draggedItemIndex = React__namespace.useRef(null);
var dragOverItemIndex = React__namespace.useRef(null);
var listElementRef = React__namespace.useRef(null);
var filterOptions = {
filter: function filter(e) {
return props.onFilterInputChange(e);
},
reset: function reset() {
return props.resetFilter();
}
};
var isSelected = function isSelected(item) {
return ObjectUtils.findIndexInList(item, props.selection, props.dataKey) !== -1;
};
var _onDragStart = function onDragStart(event, index) {
dragging.current = true;
draggedItemIndex.current = index;
if (props.dragdropScope) {
event.dataTransfer.setData('text', 'orderlist');
}
};
var _onDragOver = function onDragOver(event, index) {
if (draggedItemIndex.current !== index && draggedItemIndex.current + 1 !== index) {
dragOverItemIndex.current = index;
DomHandler.addClass(event.target, 'p-orderlist-droppoint-highlight');
event.preventDefault();
}
};
var onDragLeave = function onDragLeave(event) {
dragOverItemIndex.current = null;
DomHandler.removeClass(event.target, 'p-orderlist-droppoint-highlight');
};
var onDrop = function onDrop(event) {
var dropIndex = draggedItemIndex.current > dragOverItemIndex.current ? dragOverItemIndex.current : dragOverItemIndex.current === 0 ? 0 : dragOverItemIndex.current - 1;
var value = _toConsumableArray(props.value);
ObjectUtils.reorderArray(value, draggedItemIndex.current, dropIndex);
dragOverItemIndex.current = null;
DomHandler.removeClass(event.target, 'p-orderlist-droppoint-highlight');
if (props.onChange) {
props.onChange({
originalEvent: event,
value: value
});
}
};
var onDragEnd = function onDragEnd(event) {
dragging.current = false;
};
var onListMouseMove = function onListMouseMove(event) {
if (dragging.current) {
var offsetY = listElementRef.current.getBoundingClientRect().top + DomHandler.getWindowScrollTop();
var bottomDiff = offsetY + listElementRef.current.clientHeight - event.pageY;
var topDiff = event.pageY - offsetY;
if (bottomDiff < 25 && bottomDiff > 0) listElementRef.current.scrollTop += 15;else if (topDiff < 25 && topDiff > 0) listElementRef.current.scrollTop -= 15;
}
};
var onFilterInputKeyDown = function onFilterInputKeyDown(event) {
//enter
if (event.which === 13) {
event.preventDefault();
}
};
var createDropPoint = function createDropPoint(index, key) {
return /*#__PURE__*/React__namespace.createElement("li", {
key: key,
className: "p-orderlist-droppoint",
onDragOver: function onDragOver(e) {
return _onDragOver(e, index + 1);
},
onDragLeave: onDragLeave,
onDrop: onDrop
});
};
var createHeader = function createHeader() {
return props.header ? /*#__PURE__*/React__namespace.createElement("div", {
className: "p-orderlist-header"
}, props.header) : null;
};
var createItems = function createItems() {
if (props.value) {
return props.value.map(function (item, i) {
var content = props.itemTemplate ? props.itemTemplate(item) : item;
var itemClassName = classNames('p-orderlist-item', {
'p-highlight': isSelected(item)
}, props.className);
var key = JSON.stringify(item);
if (props.dragdrop) {
var items = [];
if (i === 0) {
items.push(createDropPoint(item, i));
}
items.push( /*#__PURE__*/React__namespace.createElement("li", {
key: key,
className: itemClassName,
onClick: function onClick(e) {
return props.onItemClick({
originalEvent: e,
value: item,
index: i
});
},
onKeyDown: function onKeyDown(e) {
return props.onItemKeyDown({
originalEvent: e,
value: item,
index: i
});
},
role: "option",
"aria-selected": isSelected(item),
draggable: "true",
onDragStart: function onDragStart(e) {
return _onDragStart(e, i);
},
onDragEnd: onDragEnd,
tabIndex: props.tabIndex
}, content, /*#__PURE__*/React__namespace.createElement(Ripple, null)));
items.push(createDropPoint(i, key + '_droppoint'));
return items;
} else {
return /*#__PURE__*/React__namespace.createElement("li", {
key: key,
className: itemClassName,
role: "option",
"aria-selected": isSelected(item),
onClick: function onClick(e) {
return props.onItemClick({
originalEvent: e,
value: item,
index: i
});
},
onKeyDown: function onKeyDown(e) {
return props.onItemKeyDown({
originalEvent: e,
value: item,
index: i
});
},
tabIndex: props.tabIndex
}, content);
}
});
}
return null;
};
var createList = function createList() {
var items = createItems();
return /*#__PURE__*/React__namespace.createElement("ul", {
ref: listElementRef,
className: "p-orderlist-list",
style: props.listStyle,
onDragOver: onListMouseMove,
role: "listbox",
"aria-multiselectable": true
}, items);
};
var createFilter = function createFilter() {
if (props.filter) {
var content = /*#__PURE__*/React__namespace.createElement("div", {
className: "p-orderlist-filter"
}, /*#__PURE__*/React__namespace.createElement("input", {
type: "text",
value: props.filterValue,
onChange: props.onFilter,
onKeyDown: onFilterInputKeyDown,
placeholder: props.placeholder,
className: "p-orderlist-filter-input p-inputtext p-component"
}), /*#__PURE__*/React__namespace.createElement("span", {
className: "p-orderlist-filter-icon pi pi-search"
}));
if (props.filterTemplate) {
var defaultContentOptions = {
className: 'p-orderlist-filter',
inputProps: {
inputClassName: 'p-orderlist-filter-input p-inputtext p-component',
onChange: props.onFilter,
onKeyDown: onFilterInputKeyDown
},
filterOptions: filterOptions,
iconClassName: 'p-orderlist-filter-icon pi pi-search',
element: content,
props: props
};
content = ObjectUtils.getJSXElement(props.filterTemplate, defaultContentOptions);
}
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-orderlist-filter-container"
}, content);
}
return null;
};
var header = createHeader();
var filter = createFilter();
var list = createList();
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-orderlist-list-container"
}, header, filter, list);
});
OrderListSubList.displayName = 'OrderListSubList';
var OrderList = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = OrderListBase.getProps(inProps);
var _React$useState = React__namespace.useState([]),
_React$useState2 = _slicedToArray(_React$useState, 2),
selectionState = _React$useState2[0],
setSelectionState = _React$useState2[1];
var _React$useState3 = React__namespace.useState(''),
_React$useState4 = _slicedToArray(_React$useState3, 2),
filterValueState = _React$useState4[0],
setFilterValueState = _React$useState4[1];
var _React$useState5 = React__namespace.useState(null),
_React$useState6 = _slicedToArray(_React$useState5, 2),
attributeSelectorState = _React$useState6[0],
setAttributeSelectorState = _React$useState6[1];
var hasFilter = ObjectUtils.isNotEmpty(filterValueState);
var elementRef = React__namespace.useRef(null);
var styleElementRef = React__namespace.useRef(null);
var reorderDirection = React__namespace.useRef(null);
var onItemClick = function onItemClick(event) {
var metaKey = event.originalEvent.metaKey || event.originalEvent.ctrlKey;
var index = ObjectUtils.findIndexInList(event.value, selectionState, props.dataKey);
var selected = index !== -1;
var newSelection;
if (selected) newSelection = metaKey ? selectionState.filter(function (_, i) {
return i !== index;
}) : [event.value];else newSelection = metaKey ? [].concat(_toConsumableArray(selectionState), [event.value]) : [event.value];
setSelectionState(newSelection);
};
var onItemKeyDown = function onItemKeyDown(event) {
var originalEvent = event.originalEvent;
var listItem = originalEvent.currentTarget;
switch (originalEvent.which) {
//down
case 40:
var nextItem = findNextItem(listItem);
nextItem && nextItem.focus();
originalEvent.preventDefault();
break;
//up
case 38:
var prevItem = findPrevItem(listItem);
prevItem && prevItem.focus();
originalEvent.preventDefault();
break;
//enter
case 13:
onItemClick(event);
originalEvent.preventDefault();
break;
}
};
var onFilter = function onFilter(event) {
var _filterValue = event.target.value;
setFilterValueState(_filterValue);
if (props.onFilter) {
props.onFilter({
originalEvent: event,
value: _filterValue
});
}
};
var resetFilter = function resetFilter() {
setFilterValueState('');
props.onFilter && props.onFilter({
filter: ''
});
};
var onFilterInputChange = function onFilterInputChange(event) {
var filter = event.target.value;
setFilterValueState(filter);
if (props.onFilter) {
props.onFilter({
originalEvent: event,
filter: filter
});
}
};
var getVisibleList = function getVisibleList() {
if (hasFilter) {
var filterValue = filterValueState.trim().toLocaleLowerCase(props.filterLocale);
var searchFields = props.filterBy ? props.filterBy.split(',') : [];
return FilterService.filter(props.value, searchFields, filterValue, props.filterMatchMode, props.filterLocale);
}
return props.value;
};
var findNextItem = function findNextItem(item) {
var nextItem = item.nextElementSibling;
return nextItem ? !DomHandler.hasClass(nextItem, 'p-orderlist-item') ? findNextItem(nextItem) : nextItem : null;
};
var findPrevItem = function findPrevItem(item) {
var prevItem = item.previousElementSibling;
return prevItem ? !DomHandler.hasClass(prevItem, 'p-orderlist-item') ? findPrevItem(prevItem) : prevItem : null;
};
var onReorder = function onReorder(event) {
if (props.onChange) {
props.onChange({
event: event.originalEvent,
value: event.value
});
}
reorderDirection.current = event.direction;
};
var updateListScroll = function updateListScroll() {
var list = DomHandler.findSingle(elementRef.current, '.p-orderlist-list');
var listItems = DomHandler.find(list, '.p-orderlist-item.p-highlight');
if (listItems && listItems.length) {
switch (reorderDirection.current) {
case 'up':
DomHandler.scrollInView(list, listItems[0]);
break;
case 'top':
list.scrollTop = 0;
break;
case 'down':
DomHandler.scrollInView(list, listItems[listItems.length - 1]);
break;
case 'bottom':
/* TODO: improve this code block */
setTimeout(function () {
return list.scrollTop = list.scrollHeight;
}, 100);
break;
}
}
};
var createStyle = function createStyle() {
if (!styleElementRef.current) {
styleElementRef.current = DomHandler.createInlineStyle(PrimeReact.nonce);
var innerHTML = "\n@media screen and (max-width: ".concat(props.breakpoint, ") {\n .p-orderlist[").concat(attributeSelectorState, "] {\n flex-direction: column;\n }\n\n .p-orderlist[").concat(attributeSelectorState, "] .p-orderlist-controls {\n padding: var(--content-padding);\n flex-direction: row;\n }\n\n .p-orderlist[").concat(attributeSelectorState, "] .p-orderlist-controls .p-button {\n margin-right: var(--inline-spacing);\n margin-bottom: 0;\n }\n\n .p-orderlist[").concat(attributeSelectorState, "] .p-orderlist-controls .p-button:last-child {\n margin-right: 0;\n }\n}\n");
styleElementRef.current.innerHTML = innerHTML;
}
};
var destroyStyle = function destroyStyle() {
styleElementRef.current = DomHandler.removeInlineStyle(styleElementRef.current);
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
getElement: function getElement() {
return elementRef.current;
}
};
});
useMountEffect(function () {
!attributeSelectorState && setAttributeSelectorState(UniqueComponentId());
});
useUpdateEffect(function () {
if (attributeSelectorState) {
elementRef.current.setAttribute(attributeSelectorState, '');
createStyle();
}
return function () {
destroyStyle();
};
}, [attributeSelectorState, props.breakpoint]);
useUpdateEffect(function () {
if (reorderDirection.current) {
updateListScroll();
reorderDirection.current = null;
}
});
var otherProps = OrderListBase.getOtherProps(props);
var className = classNames('p-orderlist p-component', props.className);
var visibleList = getVisibleList();
return /*#__PURE__*/React__namespace.createElement("div", _extends({
ref: elementRef,
id: props.id,
className: className,
style: props.style
}, otherProps), /*#__PURE__*/React__namespace.createElement(OrderListControls, {
value: visibleList,
selection: selectionState,
onReorder: onReorder,
dataKey: props.dataKey
}), /*#__PURE__*/React__namespace.createElement(OrderListSubList, {
value: visibleList,
selection: selectionState,
onItemClick: onItemClick,
onItemKeyDown: onItemKeyDown,
onFilterInputChange: onFilterInputChange,
itemTemplate: props.itemTemplate,
filter: props.filter,
onFilter: onFilter,
resetFilter: resetFilter,
filterTemplate: props.filterTemplate,
header: props.header,
listStyle: props.listStyle,
dataKey: props.dataKey,
dragdrop: props.dragdrop,
onChange: props.onChange,
tabIndex: props.tabIndex
}));
}));
OrderList.displayName = 'OrderList';
var OrganizationChartBase = {
defaultProps: {
__TYPE: 'OrganizationChart',
id: null,
value: null,
style: null,
className: null,
selectionMode: null,
selection: null,
nodeTemplate: null,
onSelectionChange: null,
onNodeSelect: null,
onNodeUnselect: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, OrganizationChartBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, OrganizationChartBase.defaultProps);
}
};
var OrganizationChartNode = /*#__PURE__*/React__namespace.memo(function (props) {
var node = props.node;
var _React$useState = React__namespace.useState(node.expanded),
_React$useState2 = _slicedToArray(_React$useState, 2),
expandedState = _React$useState2[0],
setExpandedState = _React$useState2[1];
var leaf = node.leaf === false ? false : !(node.children && node.children.length);
var colspan = node.children && node.children.length ? node.children.length * 2 : null;
var selected = props.isSelected(node);
var visibility = !leaf && expandedState ? 'inherit' : 'hidden';
var onNodeClick = function onNodeClick(event, node) {
props.onNodeClick(event, node);
};
var toggleNode = function toggleNode(event, node) {
setExpandedState(function (prevExpanded) {
return !prevExpanded;
});
event.preventDefault();
};
var createChildNodes = function createChildNodes() {
return /*#__PURE__*/React__namespace.createElement("tr", {
style: {
visibility: visibility
},
className: "p-organizationchart-nodes"
}, node.children && node.children.map(function (child, index) {
return /*#__PURE__*/React__namespace.createElement("td", {
key: index,
colSpan: "2"
}, /*#__PURE__*/React__namespace.createElement(OrganizationChartNode, {
node: child,
nodeTemplate: props.nodeTemplate,
selectionMode: props.selectionMode,
onNodeClick: props.onNodeClick,
isSelected: props.isSelected
}));
}));
};
var createLinesMiddle = function createLinesMiddle() {
var nodeChildLength = node.children && node.children.length;
return /*#__PURE__*/React__namespace.createElement("tr", {
style: {
visibility: visibility
},
className: "p-organizationchart-lines"
}, node.children && node.children.length === 1 && /*#__PURE__*/React__namespace.createElement("td", {
colSpan: colspan
}, /*#__PURE__*/React__namespace.createElement("div", {
className: "p-organizationchart-line-down"
})), node.children && node.children.length > 1 && node.children.map(function (_, index) {
var leftClassName = classNames('p-organizationchart-line-left', {
'p-organizationchart-line-top': index !== 0
});
var rightClassName = classNames('p-organizationchart-line-right', {
'p-organizationchart-line-top': index !== nodeChildLength - 1
});
return [/*#__PURE__*/React__namespace.createElement("td", {
key: index + '_lineleft',
className: leftClassName
}, "\xA0"), /*#__PURE__*/React__namespace.createElement("td", {
key: index + '_lineright',
className: rightClassName
}, "\xA0")];
}));
};
var createLinesDown = function createLinesDown() {
return /*#__PURE__*/React__namespace.createElement("tr", {
style: {
visibility: visibility
},
className: "p-organizationchart-lines"
}, /*#__PURE__*/React__namespace.createElement("td", {
colSpan: colspan
}, /*#__PURE__*/React__namespace.createElement("div", {
className: "p-organizationchart-line-down"
})));
};
var createToggler = function createToggler() {
if (!leaf) {
var toggleIconClassName = classNames('p-node-toggler-icon', {
'pi pi-chevron-down': expandedState,
'pi pi-chevron-up': !expandedState
});
return (
/*#__PURE__*/
/* eslint-disable */
React__namespace.createElement("a", {
href: "#",
className: "p-node-toggler",
onClick: function onClick(e) {
return toggleNode(e);
}
}, /*#__PURE__*/React__namespace.createElement("i", {
className: toggleIconClassName
}))
/* eslint-enable */
);
}
return null;
};
var createNodeLabel = function createNodeLabel() {
var label = props.nodeTemplate && ObjectUtils.getJSXElement(props.nodeTemplate, node) || node.label;
return /*#__PURE__*/React__namespace.createElement("div", null, label);
};
var createNodeContent = function createNodeContent() {
var nodeClassName = classNames('p-organizationchart-node-content', {
'p-organizationchart-selectable-node': props.selectionMode && node.selectable !== false,
'p-highlight': selected
}, node.className);
var label = createNodeLabel();
var toggler = createToggler();
return /*#__PURE__*/React__namespace.createElement("tr", null, /*#__PURE__*/React__namespace.createElement("td", {
colSpan: colspan
}, /*#__PURE__*/React__namespace.createElement("div", {
className: nodeClassName,
style: node.style,
onClick: function onClick(e) {
return onNodeClick(e, node);
}
}, label, toggler)));
};
var nodeContent = createNodeContent();
var linesDown = createLinesDown();
var linesMiddle = createLinesMiddle();
var childNodes = createChildNodes();
return /*#__PURE__*/React__namespace.createElement("table", {
className: "p-organizationchart-table"
}, /*#__PURE__*/React__namespace.createElement("tbody", null, nodeContent, linesDown, linesMiddle, childNodes));
});
OrganizationChartNode.displayName = 'OrganizationChartNode';
var OrganizationChart = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = OrganizationChartBase.getProps(inProps);
var elementRef = React__namespace.useRef(null);
var root = props.value && props.value.length ? props.value[0] : null;
var onNodeClick = function onNodeClick(event, node) {
if (props.selectionMode) {
var target = event.target;
if (node.selectable === false || DomHandler.hasClass(target, 'p-node-toggler') || DomHandler.hasClass(target, 'p-node-toggler-icon')) {
return;
}
var index = findIndexInSelection(node);
var selected = index >= 0;
var selection;
if (props.selectionMode === 'single') {
if (selected) {
selection = null;
props.onNodeUnselect && props.onNodeUnselect({
originalEvent: event,
node: node
});
} else {
selection = node;
props.onNodeSelect && props.onNodeSelect({
originalEvent: event,
node: node
});
}
} else if (props.selectionMode === 'multiple') {
if (selected) {
selection = props.selection.filter(function (_, i) {
return i !== index;
});
props.onNodeUnselect && props.onNodeUnselect({
originalEvent: event,
node: node
});
} else {
selection = [].concat(_toConsumableArray(props.selection || []), [node]);
props.onNodeSelect && props.onNodeSelect({
originalEvent: event,
node: node
});
}
}
if (props.onSelectionChange) {
props.onSelectionChange({
originalEvent: event,
data: selection
});
}
}
};
var findIndexInSelection = function findIndexInSelection(node) {
if (props.selectionMode && props.selection) {
if (props.selectionMode === 'single') return props.selection === node ? 0 : -1;else if (props.selectionMode === 'multiple') return props.selection.findIndex(function (selectedNode) {
return selectedNode === node;
});
}
return -1;
};
var isSelected = function isSelected(node) {
return findIndexInSelection(node) !== -1;
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
getElement: function getElement() {
return elementRef.current;
}
};
});
var otherProps = OrganizationChartBase.getOtherProps(props);
var className = classNames('p-organizationchart p-component', props.className);
return /*#__PURE__*/React__namespace.createElement("div", _extends({
id: props.id,
ref: elementRef,
style: props.style,
className: className
}, otherProps), /*#__PURE__*/React__namespace.createElement(OrganizationChartNode, {
node: root,
nodeTemplate: props.nodeTemplate,
selectionMode: props.selectionMode,
onNodeClick: onNodeClick,
isSelected: isSelected
}));
}));
OrganizationChart.displayName = 'OrganizationChart';
var OverlayPanelBase = {
defaultProps: {
__TYPE: 'OverlayPanel',
id: null,
dismissable: true,
showCloseIcon: false,
style: null,
className: null,
appendTo: null,
breakpoints: null,
ariaCloseLabel: null,
transitionOptions: null,
onShow: null,
onHide: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, OverlayPanelBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, OverlayPanelBase.defaultProps);
}
};
var OverlayPanel = /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = OverlayPanelBase.getProps(inProps);
var _React$useState = React__namespace.useState(false),
_React$useState2 = _slicedToArray(_React$useState, 2),
visibleState = _React$useState2[0],
setVisibleState = _React$useState2[1];
var attributeSelector = React__namespace.useRef('');
var overlayRef = React__namespace.useRef(null);
var currentTargetRef = React__namespace.useRef(null);
var isPanelClicked = React__namespace.useRef(false);
var styleElement = React__namespace.useRef(null);
var overlayEventListener = React__namespace.useRef(null);
var _useOverlayListener = useOverlayListener({
target: currentTargetRef,
overlay: overlayRef,
listener: function listener(event, _ref) {
var type = _ref.type,
valid = _ref.valid;
if (valid) {
type === 'outside' ? props.dismissable && !isPanelClicked.current && hide() : hide();
}
isPanelClicked.current = false;
},
when: visibleState
}),
_useOverlayListener2 = _slicedToArray(_useOverlayListener, 2),
bindOverlayListener = _useOverlayListener2[0],
unbindOverlayListener = _useOverlayListener2[1];
var isOutsideClicked = function isOutsideClicked(target) {
return overlayRef && overlayRef.current && !(overlayRef.current.isSameNode(target) || overlayRef.current.contains(target));
};
var hasTargetChanged = function hasTargetChanged(event, target) {
return currentTargetRef.current != null && currentTargetRef.current !== (target || event.currentTarget || event.target);
};
var onCloseClick = function onCloseClick(event) {
hide();
event.preventDefault();
};
var onPanelClick = function onPanelClick(event) {
isPanelClicked.current = true;
OverlayService.emit('overlay-click', {
originalEvent: event,
target: currentTargetRef.current
});
};
var onContentClick = function onContentClick() {
isPanelClicked.current = true;
};
var toggle = function toggle(event, target) {
if (visibleState) {
hide();
if (hasTargetChanged(event, target)) {
currentTargetRef.current = target || event.currentTarget || event.target;
setTimeout(function () {
show(event, currentTargetRef.current);
}, 200);
}
} else {
show(event, target);
}
};
var show = function show(event, target) {
currentTargetRef.current = target || event.currentTarget || event.target;
if (visibleState) {
align();
} else {
setVisibleState(true);
overlayEventListener.current = function (e) {
!isOutsideClicked(e.target) && (isPanelClicked.current = true);
};
OverlayService.on('overlay-click', overlayEventListener.current);
}
};
var hide = function hide() {
setVisibleState(false);
OverlayService.off('overlay-click', overlayEventListener.current);
overlayEventListener.current = null;
};
var onEnter = function onEnter() {
overlayRef.current.setAttribute(attributeSelector.current, '');
ZIndexUtils.set('overlay', overlayRef.current, PrimeReact.autoZIndex, PrimeReact.zIndex['overlay']);
align();
};
var onEntered = function onEntered() {
bindOverlayListener();
props.onShow && props.onShow();
};
var onExit = function onExit() {
unbindOverlayListener();
};
var onExited = function onExited() {
ZIndexUtils.clear(overlayRef.current);
props.onHide && props.onHide();
};
var align = function align() {
if (currentTargetRef.current && overlayRef.current) {
DomHandler.absolutePosition(overlayRef.current, currentTargetRef.current);
var containerOffset = DomHandler.getOffset(overlayRef.current);
var targetOffset = DomHandler.getOffset(currentTargetRef.current);
var arrowLeft = 0;
if (containerOffset.left < targetOffset.left) {
arrowLeft = targetOffset.left - containerOffset.left;
}
overlayRef.current.style.setProperty('--overlayArrowLeft', "".concat(arrowLeft, "px"));
if (containerOffset.top < targetOffset.top) {
DomHandler.addClass(overlayRef.current, 'p-overlaypanel-flipped');
}
}
};
var createStyle = function createStyle() {
if (!styleElement.current) {
styleElement.current = DomHandler.createInlineStyle(PrimeReact.nonce);
var innerHTML = '';
for (var breakpoint in props.breakpoints) {
innerHTML += "\n @media screen and (max-width: ".concat(breakpoint, ") {\n .p-overlaypanel[").concat(attributeSelector.current, "] {\n width: ").concat(props.breakpoints[breakpoint], " !important;\n }\n }\n ");
}
styleElement.current.innerHTML = innerHTML;
}
};
useMountEffect(function () {
attributeSelector.current = UniqueComponentId();
if (props.breakpoints) {
createStyle();
}
});
useUnmountEffect(function () {
styleElement.current = DomHandler.removeInlineStyle(styleElement.current);
if (overlayEventListener.current) {
OverlayService.off('overlay-click', overlayEventListener.current);
overlayEventListener.current = null;
}
ZIndexUtils.clear(overlayRef.current);
});
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
toggle: toggle,
show: show,
hide: hide,
getElement: function getElement() {
return overlayRef.current;
}
};
});
var createCloseIcon = function createCloseIcon() {
if (props.showCloseIcon) {
var ariaLabel = props.ariaCloseLabel || localeOption('close');
return /*#__PURE__*/React__namespace.createElement("button", {
type: "button",
className: "p-overlaypanel-close p-link",
onClick: onCloseClick,
"aria-label": ariaLabel
}, /*#__PURE__*/React__namespace.createElement("span", {
className: "p-overlaypanel-close-icon pi pi-times",
"aria-hidden": "true"
}), /*#__PURE__*/React__namespace.createElement(Ripple, null));
}
return null;
};
var createElement = function createElement() {
var otherProps = OverlayPanelBase.getOtherProps(props);
var className = classNames('p-overlaypanel p-component', props.className, {
'p-input-filled': PrimeReact.inputStyle === 'filled',
'p-ripple-disabled': PrimeReact.ripple === false
});
var closeIcon = createCloseIcon();
return /*#__PURE__*/React__namespace.createElement(CSSTransition, {
nodeRef: overlayRef,
classNames: "p-overlaypanel",
"in": visibleState,
timeout: {
enter: 120,
exit: 100
},
options: props.transitionOptions,
unmountOnExit: true,
onEnter: onEnter,
onEntered: onEntered,
onExit: onExit,
onExited: onExited
}, /*#__PURE__*/React__namespace.createElement("div", _extends({
ref: overlayRef,
id: props.id,
className: className,
style: props.style
}, otherProps, {
onClick: onPanelClick
}), /*#__PURE__*/React__namespace.createElement("div", {
className: "p-overlaypanel-content",
onClick: onContentClick,
onMouseDown: onContentClick
}, props.children), closeIcon));
};
var element = createElement();
return /*#__PURE__*/React__namespace.createElement(Portal, {
element: element,
appendTo: props.appendTo
});
});
OverlayPanel.displayName = 'OverlayPanel';
var PanelBase = {
defaultProps: {
__TYPE: 'Panel',
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,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, PanelBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, PanelBase.defaultProps);
}
};
var Panel = /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = PanelBase.getProps(inProps);
var _React$useState = React__namespace.useState(props.id),
_React$useState2 = _slicedToArray(_React$useState, 2),
idState = _React$useState2[0],
setIdState = _React$useState2[1];
var _React$useState3 = React__namespace.useState(props.collapsed),
_React$useState4 = _slicedToArray(_React$useState3, 2),
collapsedState = _React$useState4[0],
setCollapsedState = _React$useState4[1];
var elementRef = React__namespace.useRef(ref);
var contentRef = React__namespace.useRef(null);
var collapsed = props.toggleable ? props.onToggle ? props.collapsed : collapsedState : false;
var headerId = idState + '_header';
var contentId = idState + '_content';
var toggle = function toggle(event) {
if (props.toggleable) {
collapsed ? expand(event) : collapse(event);
if (props.onToggle) {
props.onToggle({
originalEvent: event,
value: !collapsed
});
}
}
event.preventDefault();
};
var expand = function expand(event) {
if (!props.onToggle) {
setCollapsedState(false);
}
props.onExpand && props.onExpand(event);
};
var collapse = function collapse(event) {
if (!props.onToggle) {
setCollapsedState(true);
}
props.onCollapse && props.onCollapse(event);
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
getElement: function getElement() {
return elementRef.current;
},
getContent: function getContent() {
return contentRef.current;
}
};
});
React__namespace.useEffect(function () {
ObjectUtils.combinedRefs(elementRef, ref);
}, [elementRef, ref]);
useMountEffect(function () {
if (!idState) {
setIdState(UniqueComponentId());
}
});
var createToggleIcon = function createToggleIcon() {
if (props.toggleable) {
var buttonId = idState + '_label';
var toggleIcon = collapsed ? props.expandIcon : props.collapseIcon;
return /*#__PURE__*/React__namespace.createElement("button", {
className: "p-panel-header-icon p-panel-toggler p-link",
onClick: toggle,
id: buttonId,
"aria-controls": contentId,
"aria-expanded": !collapsed,
role: "tab"
}, IconUtils.getJSXIcon(toggleIcon, undefined, {
props: props,
collapsed: collapsed
}), /*#__PURE__*/React__namespace.createElement(Ripple, null));
}
return null;
};
var createHeader = function createHeader() {
var header = ObjectUtils.getJSXElement(props.header, props);
var icons = ObjectUtils.getJSXElement(props.icons, props);
var togglerElement = createToggleIcon();
var titleElement = /*#__PURE__*/React__namespace.createElement("span", {
className: "p-panel-title",
id: headerId
}, header);
var iconsElement = /*#__PURE__*/React__namespace.createElement("div", {
className: "p-panel-icons"
}, icons, togglerElement);
var content = /*#__PURE__*/React__namespace.createElement("div", {
className: "p-panel-header"
}, titleElement, iconsElement);
if (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 ? props.expandIcon : props.collapseIcon,
onTogglerClick: toggle,
titleElement: titleElement,
iconsElement: iconsElement,
togglerElement: togglerElement,
element: content,
props: props,
collapsed: collapsed
};
return ObjectUtils.getJSXElement(props.headerTemplate, defaultContentOptions);
} else if (props.header || props.toggleable) {
return content;
}
return null;
};
var createContent = function createContent() {
return /*#__PURE__*/React__namespace.createElement(CSSTransition, {
nodeRef: contentRef,
classNames: "p-toggleable-content",
timeout: {
enter: 1000,
exit: 450
},
"in": !collapsed,
unmountOnExit: true,
options: props.transitionOptions
}, /*#__PURE__*/React__namespace.createElement("div", {
ref: contentRef,
className: "p-toggleable-content",
"aria-hidden": collapsed,
role: "region",
id: contentId,
"aria-labelledby": headerId
}, /*#__PURE__*/React__namespace.createElement("div", {
className: "p-panel-content"
}, props.children)));
};
var otherProps = PanelBase.getOtherProps(props);
var className = classNames('p-panel p-component', {
'p-panel-toggleable': props.toggleable
}, props.className);
var header = createHeader();
var content = createContent();
return /*#__PURE__*/React__namespace.createElement("div", _extends({
id: props.id,
ref: elementRef,
className: className,
style: props.style
}, otherProps), header, content);
});
Panel.displayName = 'Panel';
var PanelMenuBase = {
defaultProps: {
__TYPE: 'Panel',
id: null,
model: null,
style: null,
className: null,
multiple: false,
transitionOptions: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, PanelMenuBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, PanelMenuBase.defaultProps);
}
};
var PanelMenuSub = /*#__PURE__*/React__namespace.memo(function (props) {
var _React$useState = React__namespace.useState(null),
_React$useState2 = _slicedToArray(_React$useState, 2),
activeItemState = _React$useState2[0],
setActiveItemState = _React$useState2[1];
var findActiveItem = function findActiveItem() {
if (props.model) {
if (props.multiple) {
return props.model.filter(function (item) {
return item.expanded;
});
} else {
var activeItem = null;
props.model.forEach(function (item) {
if (item.expanded) {
if (!activeItem) activeItem = item;else item.expanded = false;
}
});
return activeItem;
}
}
return null;
};
var onItemClick = 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 = activeItemState;
var active = isItemActive(item);
if (active) {
item.expanded = false;
setActiveItemState(props.multiple ? activeItem.filter(function (a_item) {
return a_item !== item;
}) : null);
} else {
if (!props.multiple && activeItem) {
activeItem.expanded = false;
}
item.expanded = true;
setActiveItemState(props.multiple ? [].concat(_toConsumableArray(activeItem || []), [item]) : item);
}
};
var isItemActive = function isItemActive(item) {
return activeItemState && (props.multiple ? activeItemState.indexOf(item) > -1 : activeItemState === item);
};
useMountEffect(function () {
setActiveItemState(findActiveItem());
});
var createSeparator = function createSeparator(index) {
var key = 'separator_' + index;
return /*#__PURE__*/React__namespace.createElement("li", {
key: key,
className: "p-menu-separator"
});
};
var createSubmenu = function createSubmenu(item, active) {
var className = classNames('p-toggleable-content', {
'p-toggleable-content-collapsed': !active
});
var submenuRef = /*#__PURE__*/React__namespace.createRef();
if (item.items) {
return /*#__PURE__*/React__namespace.createElement(CSSTransition, {
nodeRef: submenuRef,
classNames: "p-toggleable-content",
timeout: {
enter: 1000,
exit: 450
},
"in": active,
unmountOnExit: true
}, /*#__PURE__*/React__namespace.createElement("div", {
ref: submenuRef,
className: className
}, /*#__PURE__*/React__namespace.createElement(PanelMenuSub, {
menuProps: props.menuProps,
model: item.items,
multiple: props.multiple
})));
}
return null;
};
var createMenuItem = function createMenuItem(item, index) {
if (item.visible === false) {
return null;
}
var key = item.label + '_' + index;
var active = 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 = IconUtils.getJSXIcon(item.icon, {
className: 'p-menuitem-icon'
}, {
props: props.menuProps
});
var label = item.label && /*#__PURE__*/React__namespace.createElement("span", {
className: "p-menuitem-text"
}, item.label);
var submenuIcon = item.items && /*#__PURE__*/React__namespace.createElement("span", {
className: submenuIconClassName
});
var submenu = createSubmenu(item, active);
var content = /*#__PURE__*/React__namespace.createElement("a", {
href: item.url || '#',
className: linkClassName,
target: item.target,
onClick: function onClick(event) {
return onItemClick(event, item);
},
role: "menuitem",
"aria-disabled": item.disabled
}, submenuIcon, icon, label);
if (item.template) {
var defaultContentOptions = {
onClick: function onClick(event) {
return onItemClick(event, item);
},
className: linkClassName,
labelClassName: 'p-menuitem-text',
iconClassName: iconClassName,
submenuIconClassName: submenuIconClassName,
element: content,
props: props,
leaf: !item.items,
active: active
};
content = ObjectUtils.getJSXElement(item.template, item, defaultContentOptions);
}
return /*#__PURE__*/React__namespace.createElement("li", {
key: key,
id: item.id,
className: className,
style: item.style,
role: "none"
}, content, submenu);
};
var createItem = function createItem(item, index) {
return item.separator ? createSeparator(index) : createMenuItem(item, index);
};
var createMenu = function createMenu() {
return props.model ? props.model.map(createItem) : null;
};
var className = classNames('p-submenu-list', props.className);
var menu = createMenu();
return /*#__PURE__*/React__namespace.createElement("ul", {
className: className,
role: "tree"
}, menu);
});
PanelMenuSub.displayName = 'PanelMenuSub';
var PanelMenu = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = PanelMenuBase.getProps(inProps);
var _React$useState = React__namespace.useState(props.id),
_React$useState2 = _slicedToArray(_React$useState, 2),
idState = _React$useState2[0],
setIdState = _React$useState2[1];
var _React$useState3 = React__namespace.useState(null),
_React$useState4 = _slicedToArray(_React$useState3, 2),
activeItemState = _React$useState4[0],
setActiveItemState = _React$useState4[1];
var _React$useState5 = React__namespace.useState(false),
_React$useState6 = _slicedToArray(_React$useState5, 2),
animationDisabled = _React$useState6[0],
setAnimationDisabled = _React$useState6[1];
var elementRef = React__namespace.useRef(null);
var headerId = idState + '_header';
var contentId = idState + '_content';
var findActiveItem = function findActiveItem() {
if (props.model) {
if (props.multiple) {
return props.model.filter(function (item) {
return item.expanded;
});
} else {
var activeItem = null;
props.model.forEach(function (item) {
if (item.expanded) {
if (!activeItem) activeItem = item;else item.expanded = false;
}
});
return activeItem;
}
}
return null;
};
var onItemClick = 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 = activeItemState;
var active = isItemActive(item);
if (active) {
item.expanded = false;
setActiveItemState(props.multiple ? activeItem.filter(function (a_item) {
return a_item !== item;
}) : null);
} else {
if (!props.multiple && activeItem) {
activeItem.expanded = false;
}
item.expanded = true;
setActiveItemState(props.multiple ? [].concat(_toConsumableArray(activeItem || []), [item]) : item);
}
};
var isItemActive = function isItemActive(item) {
return activeItemState && (props.multiple ? activeItemState.indexOf(item) > -1 : activeItemState === item);
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
getElement: function getElement() {
return elementRef.current;
}
};
});
useMountEffect(function () {
if (!idState) {
setIdState(UniqueComponentId());
}
setActiveItemState(findActiveItem());
});
useUpdateEffect(function () {
setAnimationDisabled(true);
setActiveItemState(findActiveItem());
}, [props.model]);
var onEnter = function onEnter() {
setAnimationDisabled(false);
};
var createPanel = function createPanel(item, index) {
if (item.visible === false) {
return null;
}
var key = item.label + '_' + index;
var active = 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 icon = IconUtils.getJSXIcon(item.icon, {
className: 'p-menuitem-icon'
}, {
props: props
});
var submenuIcon = item.items && /*#__PURE__*/React__namespace.createElement("span", {
className: submenuIconClassName
});
var label = item.label && /*#__PURE__*/React__namespace.createElement("span", {
className: "p-menuitem-text"
}, item.label);
var contentWrapperClassName = classNames('p-toggleable-content', {
'p-toggleable-content-collapsed': !active
});
var menuContentRef = /*#__PURE__*/React__namespace.createRef();
var content = /*#__PURE__*/React__namespace.createElement("a", {
href: item.url || '#',
className: "p-panelmenu-header-link",
onClick: function onClick(e) {
return onItemClick(e, item);
},
"aria-expanded": active,
id: headerId,
"aria-controls": contentId,
"aria-disabled": item.disabled
}, submenuIcon, icon, label);
if (item.template) {
var defaultContentOptions = {
onClick: function onClick(event) {
return onItemClick(event, item);
},
className: 'p-panelmenu-header-link',
labelClassName: 'p-menuitem-text',
submenuIconClassName: submenuIconClassName,
iconClassName: iconClassName,
element: content,
props: props,
leaf: !item.items,
active: active
};
content = ObjectUtils.getJSXElement(item.template, item, defaultContentOptions);
}
return /*#__PURE__*/React__namespace.createElement("div", {
key: key,
className: className,
style: item.style
}, /*#__PURE__*/React__namespace.createElement("div", {
className: headerClassName,
style: item.style
}, content), /*#__PURE__*/React__namespace.createElement(CSSTransition, {
nodeRef: menuContentRef,
classNames: "p-toggleable-content",
timeout: {
enter: 1000,
exit: 450
},
onEnter: onEnter,
disabled: animationDisabled,
"in": active,
unmountOnExit: true,
options: props.transitionOptions
}, /*#__PURE__*/React__namespace.createElement("div", {
ref: menuContentRef,
className: contentWrapperClassName,
role: "region",
id: contentId,
"aria-labelledby": headerId
}, /*#__PURE__*/React__namespace.createElement("div", {
className: "p-panelmenu-content"
}, /*#__PURE__*/React__namespace.createElement(PanelMenuSub, {
menuProps: props,
model: item.items,
className: "p-panelmenu-root-submenu",
multiple: props.multiple
})))));
};
var createPanels = function createPanels() {
return props.model ? props.model.map(createPanel) : null;
};
var otherProps = PanelMenuBase.getOtherProps(props);
var className = classNames('p-panelmenu p-component', props.className);
var panels = createPanels();
return /*#__PURE__*/React__namespace.createElement("div", _extends({
id: props.id,
ref: elementRef,
className: className,
style: props.style
}, otherProps), panels);
}));
PanelMenu.displayName = 'PanelMenu';
var PasswordBase = {
defaultProps: {
__TYPE: 'Password',
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,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, PasswordBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, PasswordBase.defaultProps);
}
};
var Password = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = PasswordBase.getProps(inProps);
var promptLabel = props.promptLabel || localeOption('passwordPrompt');
var weakLabel = props.weakLabel || localeOption('weak');
var mediumLabel = props.mediumLabel || localeOption('medium');
var strongLabel = props.strongLabel || localeOption('strong');
var _React$useState = React__namespace.useState(false),
_React$useState2 = _slicedToArray(_React$useState, 2),
overlayVisibleState = _React$useState2[0],
setOverlayVisibleState = _React$useState2[1];
var _React$useState3 = React__namespace.useState(null),
_React$useState4 = _slicedToArray(_React$useState3, 2),
meterState = _React$useState4[0],
setMeterState = _React$useState4[1];
var _React$useState5 = React__namespace.useState(promptLabel),
_React$useState6 = _slicedToArray(_React$useState5, 2),
infoTextState = _React$useState6[0],
setInfoTextState = _React$useState6[1];
var _React$useState7 = React__namespace.useState(false),
_React$useState8 = _slicedToArray(_React$useState7, 2),
focusedState = _React$useState8[0],
setFocusedState = _React$useState8[1];
var _React$useState9 = React__namespace.useState(false),
_React$useState10 = _slicedToArray(_React$useState9, 2),
unmaskedState = _React$useState10[0],
setUnmaskedState = _React$useState10[1];
var elementRef = React__namespace.useRef(null);
var overlayRef = React__namespace.useRef(null);
var inputRef = React__namespace.useRef(props.inputRef);
var mediumCheckRegExp = React__namespace.useRef(new RegExp(props.mediumRegex));
var strongCheckRegExp = React__namespace.useRef(new RegExp(props.strongRegex));
var type = unmaskedState ? 'text' : 'password';
var _useOverlayListener = useOverlayListener({
target: elementRef,
overlay: overlayRef,
listener: function listener(event, _ref) {
var valid = _ref.valid;
valid && hide();
},
when: overlayVisibleState
}),
_useOverlayListener2 = _slicedToArray(_useOverlayListener, 2),
bindOverlayListener = _useOverlayListener2[0],
unbindOverlayListener = _useOverlayListener2[1];
var currentValue = inputRef.current && inputRef.current.value;
var isFilled = React__namespace.useMemo(function () {
return ObjectUtils.isNotEmpty(props.value) || ObjectUtils.isNotEmpty(props.defaultValue) || ObjectUtils.isNotEmpty(currentValue);
}, [props.value, props.defaultValue, currentValue]);
var updateLabels = function updateLabels() {
if (meterState) {
var label = null;
switch (meterState.strength) {
case 'weak':
label = weakLabel;
break;
case 'medium':
label = mediumLabel;
break;
case 'strong':
label = strongLabel;
break;
}
if (label && infoTextState !== label) {
setInfoTextState(label);
}
} else {
if (infoTextState !== promptLabel) {
setInfoTextState(promptLabel);
}
}
};
var onPanelClick = function onPanelClick(event) {
if (props.feedback) {
OverlayService.emit('overlay-click', {
originalEvent: event,
target: elementRef.current
});
}
};
var onMaskToggle = function onMaskToggle() {
setUnmaskedState(function (prevUnmasked) {
return !prevUnmasked;
});
};
var show = function show() {
updateLabels();
setOverlayVisibleState(true);
};
var hide = function hide() {
setOverlayVisibleState(false);
};
var alignOverlay = function alignOverlay() {
if (inputRef.current) {
DomHandler.alignOverlay(overlayRef.current, inputRef.current.parentElement, props.appendTo || PrimeReact.appendTo);
}
};
var onOverlayEnter = function onOverlayEnter() {
ZIndexUtils.set('overlay', overlayRef.current, PrimeReact.autoZIndex, PrimeReact.zIndex['overlay']);
alignOverlay();
};
var onOverlayEntered = function onOverlayEntered() {
bindOverlayListener();
props.onShow && props.onShow();
};
var onOverlayExit = function onOverlayExit() {
unbindOverlayListener();
};
var onOverlayExited = function onOverlayExited() {
ZIndexUtils.clear(overlayRef.current);
props.onHide && props.onHide();
};
var onFocus = function onFocus(event) {
setFocusedState(true);
if (props.feedback) {
show();
}
props.onFocus && props.onFocus(event);
};
var onBlur = function onBlur(event) {
setFocusedState(false);
if (props.feedback) {
hide();
}
props.onBlur && props.onBlur(event);
};
var onKeyup = function onKeyup(e) {
var keyCode = e.keyCode || e.which;
if (props.feedback) {
var value = e.target.value;
var label = null;
var meter = null;
switch (testStrength(value)) {
case 1:
label = weakLabel;
meter = {
strength: 'weak',
width: '33.33%'
};
break;
case 2:
label = mediumLabel;
meter = {
strength: 'medium',
width: '66.66%'
};
break;
case 3:
label = strongLabel;
meter = {
strength: 'strong',
width: '100%'
};
break;
default:
label = promptLabel;
meter = null;
break;
}
setMeterState(meter);
setInfoTextState(label);
if (!!keyCode && !overlayVisibleState) {
show();
}
}
props.onKeyUp && props.onKeyUp(e);
};
var onInput = function onInput(event, validatePattern) {
if (props.onInput) {
props.onInput(event, validatePattern);
}
if (!props.onChange) {
ObjectUtils.isNotEmpty(event.target.value) ? DomHandler.addClass(elementRef.current, 'p-inputwrapper-filled') : DomHandler.removeClass(elementRef.current, 'p-inputwrapper-filled');
}
};
var testStrength = function testStrength(str) {
if (strongCheckRegExp.current.test(str)) return 3;else if (mediumCheckRegExp.current.test(str)) return 2;else if (str.length) return 1;
return 0;
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
focus: function focus() {
return DomHandler.focus(inputRef.current);
},
getElement: function getElement() {
return elementRef.current;
},
getOverlay: function getOverlay() {
return overlayRef.current;
},
getInput: function getInput() {
return inputRef.current;
}
};
});
React__namespace.useEffect(function () {
ObjectUtils.combinedRefs(inputRef, props.inputRef);
}, [inputRef, props.inputRef]);
React__namespace.useEffect(function () {
mediumCheckRegExp.current = new RegExp(props.mediumRegex);
}, [props.mediumRegex]);
React__namespace.useEffect(function () {
strongCheckRegExp.current = new RegExp(props.strongRegex);
}, [props.strongRegex]);
React__namespace.useEffect(function () {
if (!isFilled && DomHandler.hasClass(elementRef.current, 'p-inputwrapper-filled')) {
DomHandler.removeClass(elementRef.current, 'p-inputwrapper-filled');
}
}, [isFilled]);
useUnmountEffect(function () {
ZIndexUtils.clear(overlayRef.current);
});
var createIcon = function createIcon() {
if (props.toggleMask) {
var iconClassName = unmaskedState ? 'pi pi-eye-slash' : 'pi pi-eye';
var content = /*#__PURE__*/React__namespace.createElement("i", {
className: iconClassName,
onClick: onMaskToggle
});
if (props.icon) {
var defaultIconOptions = {
onClick: onMaskToggle,
className: iconClassName,
element: content,
props: props
};
content = ObjectUtils.getJSXElement(props.icon, defaultIconOptions);
}
return content;
}
return null;
};
var createPanel = function createPanel() {
var panelClassName = classNames('p-password-panel p-component', props.panelClassName, {
'p-input-filled': PrimeReact.inputStyle === 'filled',
'p-ripple-disabled': PrimeReact.ripple === false
});
var _ref2 = meterState || {
strength: '',
width: '0%'
},
strength = _ref2.strength,
width = _ref2.width;
var header = ObjectUtils.getJSXElement(props.header, props);
var footer = ObjectUtils.getJSXElement(props.footer, props);
var content = props.content ? ObjectUtils.getJSXElement(props.content, props) : /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement("div", {
className: "p-password-meter"
}, /*#__PURE__*/React__namespace.createElement("div", {
className: "p-password-strength ".concat(strength),
style: {
width: width
}
})), /*#__PURE__*/React__namespace.createElement("div", {
className: "p-password-info ".concat(strength)
}, infoTextState));
var panel = /*#__PURE__*/React__namespace.createElement(CSSTransition, {
nodeRef: overlayRef,
classNames: "p-connected-overlay",
"in": overlayVisibleState,
timeout: {
enter: 120,
exit: 100
},
options: props.transitionOptions,
unmountOnExit: true,
onEnter: onOverlayEnter,
onEntered: onOverlayEntered,
onExit: onOverlayExit,
onExited: onOverlayExited
}, /*#__PURE__*/React__namespace.createElement("div", {
ref: overlayRef,
className: panelClassName,
style: props.panelStyle,
onClick: onPanelClick
}, header, content, footer));
return /*#__PURE__*/React__namespace.createElement(Portal, {
element: panel,
appendTo: props.appendTo
});
};
var className = classNames('p-password p-component p-inputwrapper', {
'p-inputwrapper-filled': isFilled,
'p-inputwrapper-focus': focusedState,
'p-input-icon-right': props.toggleMask
}, props.className);
var inputClassName = classNames('p-password-input', props.inputClassName);
var inputProps = PasswordBase.getOtherProps(props);
var icon = createIcon();
var panel = createPanel();
return /*#__PURE__*/React__namespace.createElement("div", {
ref: elementRef,
id: props.id,
className: className,
style: props.style
}, /*#__PURE__*/React__namespace.createElement(InputText, _extends({
ref: inputRef,
id: props.inputId
}, inputProps, {
type: type,
className: inputClassName,
style: props.inputStyle,
onFocus: onFocus,
onBlur: onBlur,
onKeyUp: onKeyup,
onInput: onInput,
tooltip: props.tooltip,
tooltipOptions: props.tooltipOptions
})), icon, panel);
}));
Password.displayName = 'Password';
var PickListBase = {
defaultProps: {
__TYPE: 'PickList',
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,
filter: false,
filterBy: null,
filterMatchMode: 'contains',
filterLocale: undefined,
sourceFilterValue: null,
targetFilterValue: null,
showSourceFilter: true,
showTargetFilter: true,
sourceFilterPlaceholder: null,
targetFilterPlaceholder: null,
sourceFilterTemplate: null,
targetFilterTemplate: null,
tabIndex: 0,
dataKey: null,
breakpoint: '960px',
itemTemplate: null,
sourceItemTemplate: null,
targetItemTemplate: null,
onChange: null,
onMoveToSource: null,
onMoveAllToSource: null,
onMoveToTarget: null,
onMoveAllToTarget: null,
onSourceSelectionChange: null,
onTargetSelectionChange: null,
onSourceFilterChange: null,
onTargetFilterChange: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, PickListBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, PickListBase.defaultProps);
}
};
var PickListControls = /*#__PURE__*/React__namespace.memo(function (props) {
var moveDisabled = !props.selection || !props.selection.length;
var moveUp = function moveUp(event) {
var selectedItems = props.selection;
if (selectedItems && selectedItems.length) {
var list = _toConsumableArray(props.list);
for (var i = 0; i < selectedItems.length; i++) {
var selectedItem = selectedItems[i];
var selectedItemIndex = ObjectUtils.findIndexInList(selectedItem, list, props.dataKey);
if (selectedItemIndex !== 0) {
var movedItem = list[selectedItemIndex];
var temp = list[selectedItemIndex - 1];
list[selectedItemIndex - 1] = movedItem;
list[selectedItemIndex] = temp;
} else {
break;
}
}
if (props.onReorder) {
props.onReorder({
originalEvent: event,
value: list,
direction: 'up'
});
}
}
};
var moveTop = function moveTop(event) {
var selectedItems = props.selection;
if (selectedItems && selectedItems.length) {
var list = _toConsumableArray(props.list);
for (var i = 0; i < selectedItems.length; i++) {
var selectedItem = selectedItems[i];
var selectedItemIndex = ObjectUtils.findIndexInList(selectedItem, list, props.dataKey);
if (selectedItemIndex !== 0) {
var movedItem = list.splice(selectedItemIndex, 1)[0];
list.unshift(movedItem);
} else {
break;
}
}
if (props.onReorder) {
props.onReorder({
originalEvent: event,
value: list,
direction: 'top'
});
}
}
};
var moveDown = function moveDown(event) {
var selectedItems = props.selection;
if (selectedItems && selectedItems.length) {
var list = _toConsumableArray(props.list);
for (var i = selectedItems.length - 1; i >= 0; i--) {
var selectedItem = selectedItems[i];
var selectedItemIndex = ObjectUtils.findIndexInList(selectedItem, list, 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 (props.onReorder) {
props.onReorder({
originalEvent: event,
value: list,
direction: 'down'
});
}
}
};
var moveBottom = function moveBottom(event) {
var selectedItems = props.selection;
if (selectedItems && selectedItems.length) {
var list = _toConsumableArray(props.list);
for (var i = selectedItems.length - 1; i >= 0; i--) {
var selectedItem = selectedItems[i];
var selectedItemIndex = ObjectUtils.findIndexInList(selectedItem, list, props.dataKey);
if (selectedItemIndex !== list.length - 1) {
var movedItem = list.splice(selectedItemIndex, 1)[0];
list.push(movedItem);
} else {
break;
}
}
if (props.onReorder) {
props.onReorder({
originalEvent: event,
value: list,
direction: 'bottom'
});
}
}
};
var className = classNames('p-picklist-buttons', props.className);
return /*#__PURE__*/React__namespace.createElement("div", {
className: className
}, /*#__PURE__*/React__namespace.createElement(Button, {
disabled: moveDisabled,
type: "button",
icon: "pi pi-angle-up",
onClick: moveUp
}), /*#__PURE__*/React__namespace.createElement(Button, {
disabled: moveDisabled,
type: "button",
icon: "pi pi-angle-double-up",
onClick: moveTop
}), /*#__PURE__*/React__namespace.createElement(Button, {
disabled: moveDisabled,
type: "button",
icon: "pi pi-angle-down",
onClick: moveDown
}), /*#__PURE__*/React__namespace.createElement(Button, {
disabled: moveDisabled,
type: "button",
icon: "pi pi-angle-double-down",
onClick: moveBottom
}));
});
PickListControls.displayName = 'PickListControls';
var PickListItem = /*#__PURE__*/React__namespace.memo(function (props) {
var onClick = function onClick(event) {
if (props.onClick) {
props.onClick({
originalEvent: event,
value: props.value
});
}
};
var onKeyDown = function onKeyDown(event) {
if (props.onKeyDown) {
props.onKeyDown({
originalEvent: event,
value: props.value
});
}
};
var content = props.template ? props.template(props.value) : props.value;
var className = classNames('p-picklist-item', {
'p-highlight': props.selected
}, props.className);
return /*#__PURE__*/React__namespace.createElement("li", {
className: className,
onClick: onClick,
onKeyDown: onKeyDown,
tabIndex: props.tabIndex,
role: "option",
"aria-selected": props.selected
}, content, /*#__PURE__*/React__namespace.createElement(Ripple, null));
});
PickListItem.displayName = 'PickListItem';
var PickListSubList = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (props, ref) {
var listElementRef = React__namespace.useRef(null);
var onItemClick = function onItemClick(event) {
var originalEvent = event.originalEvent;
var item = event.value;
var selection = _toConsumableArray(props.selection);
var index = ObjectUtils.findIndexInList(item, selection, props.dataKey);
var selected = index !== -1;
var metaSelection = 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 (props.onSelectionChange) {
props.onSelectionChange({
event: originalEvent,
value: selection
});
}
};
var onItemKeyDown = function onItemKeyDown(event) {
var originalEvent = event.originalEvent;
var listItem = originalEvent.currentTarget;
switch (originalEvent.which) {
//down
case 40:
var nextItem = findNextItem(listItem);
nextItem && nextItem.focus();
originalEvent.preventDefault();
break;
//up
case 38:
var prevItem = findPrevItem(listItem);
prevItem && prevItem.focus();
originalEvent.preventDefault();
break;
//enter
case 13:
onItemClick(event);
originalEvent.preventDefault();
break;
}
};
var findNextItem = function findNextItem(item) {
var nextItem = item.nextElementSibling;
return nextItem ? !DomHandler.hasClass(nextItem, 'p-picklist-item') ? findNextItem(nextItem) : nextItem : null;
};
var findPrevItem = function findPrevItem(item) {
var prevItem = item.previousElementSibling;
return prevItem ? !DomHandler.hasClass(prevItem, 'p-picklist-item') ? findPrevItem(prevItem) : prevItem : null;
};
var isSelected = function isSelected(item) {
return ObjectUtils.findIndexInList(item, props.selection, props.dataKey) !== -1;
};
var onFilter = function onFilter(event) {
if (props.onFilter) {
props.onFilter({
originalEvent: event,
value: event.target.value,
type: props.type
});
}
};
var onFilterInputKeyDown = function onFilterInputKeyDown(event) {
//enter
if (event.which === 13) {
event.preventDefault();
}
};
React__namespace.useImperativeHandle(ref, function () {
return {
listElementRef: listElementRef
};
});
var createHeader = function createHeader() {
if (props.header) {
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-picklist-header"
}, ObjectUtils.getJSXElement(props.header, props));
}
return null;
};
var createItems = function createItems() {
if (props.list) {
return props.list.map(function (item) {
var key = JSON.stringify(item);
var selected = isSelected(item);
return /*#__PURE__*/React__namespace.createElement(PickListItem, {
key: key,
value: item,
template: props.itemTemplate,
selected: selected,
onClick: onItemClick,
onKeyDown: onItemKeyDown,
tabIndex: props.tabIndex
});
});
}
return null;
};
var createFilter = function createFilter() {
if (props.showFilter) {
var content = /*#__PURE__*/React__namespace.createElement("div", {
className: "p-picklist-filter"
}, /*#__PURE__*/React__namespace.createElement("input", {
type: "text",
value: props.filterValue,
onChange: onFilter,
onKeyDown: onFilterInputKeyDown,
placeholder: props.placeholder,
className: "p-picklist-filter-input p-inputtext p-component"
}), /*#__PURE__*/React__namespace.createElement("span", {
className: "p-picklist-filter-icon pi pi-search"
}));
if (props.filterTemplate) {
var defaultContentOptions = {
className: 'p-picklist-filter',
inputProps: {
className: 'p-picklist-filter-input p-inputtext p-component',
onChange: onFilter,
onKeyDown: onFilterInputKeyDown
},
iconClassName: 'p-picklist-filter-icon pi pi-search',
element: content,
props: props
};
content = ObjectUtils.getJSXElement(props.filterTemplate, defaultContentOptions);
}
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-picklist-filter-container"
}, content);
}
return null;
};
var createList = function createList() {
var items = createItems();
var className = classNames('p-picklist-list', props.listClassName);
return /*#__PURE__*/React__namespace.createElement("ul", {
className: className,
style: props.style,
role: "listbox",
"aria-multiselectable": true
}, items);
};
var className = classNames('p-picklist-list-wrapper', props.className);
var header = createHeader();
var filter = createFilter();
var list = createList();
return /*#__PURE__*/React__namespace.createElement("div", {
ref: listElementRef,
className: className
}, header, filter, list);
}));
PickListSubList.displayName = 'PickListSubList';
var PickListTransferControls = /*#__PURE__*/React__namespace.memo(function (props) {
var moveRightDisabled = ObjectUtils.isEmpty(props.sourceSelection) || ObjectUtils.isEmpty(props.visibleSourceList);
var moveLeftDisabled = ObjectUtils.isEmpty(props.targetSelection) || ObjectUtils.isEmpty(props.visibleTargetList);
var moveAllRightDisabled = ObjectUtils.isEmpty(props.visibleSourceList);
var moveAllLeftDisabled = ObjectUtils.isEmpty(props.visibleTargetList);
var moveRight = function moveRight(event) {
var selection = props.sourceSelection;
if (ObjectUtils.isNotEmpty(selection)) {
var targetList = _toConsumableArray(props.target);
var sourceList = _toConsumableArray(props.source);
for (var i = 0; i < selection.length; i++) {
var selectedItem = selection[i];
if (ObjectUtils.findIndexInList(selectedItem, targetList, props.dataKey) === -1) {
targetList.push(sourceList.splice(ObjectUtils.findIndexInList(selectedItem, sourceList, props.dataKey), 1)[0]);
}
}
if (props.onTransfer) {
props.onTransfer({
originalEvent: event,
source: sourceList,
target: targetList,
direction: 'toTarget'
});
}
}
};
var moveAllRight = function moveAllRight(event) {
if (props.source) {
var targetList = [].concat(_toConsumableArray(props.target), _toConsumableArray(props.visibleSourceList));
var sourceList = props.source.filter(function (s) {
return !props.visibleSourceList.some(function (vs) {
return vs === s;
});
});
if (props.onTransfer) {
props.onTransfer({
originalEvent: event,
source: sourceList,
target: targetList,
direction: 'allToTarget'
});
}
}
};
var moveLeft = function moveLeft(event) {
var selection = props.targetSelection;
if (ObjectUtils.isNotEmpty(selection)) {
var targetList = _toConsumableArray(props.target);
var sourceList = _toConsumableArray(props.source);
for (var i = 0; i < selection.length; i++) {
var selectedItem = selection[i];
if (ObjectUtils.findIndexInList(selectedItem, sourceList, props.dataKey) === -1) {
sourceList.push(targetList.splice(ObjectUtils.findIndexInList(selectedItem, targetList, props.dataKey), 1)[0]);
}
}
if (props.onTransfer) {
props.onTransfer({
originalEvent: event,
source: sourceList,
target: targetList,
direction: 'toSource'
});
}
}
};
var moveAllLeft = function moveAllLeft(event) {
if (props.source) {
var sourceList = [].concat(_toConsumableArray(props.source), _toConsumableArray(props.visibleTargetList));
var targetList = props.target.filter(function (t) {
return !props.visibleTargetList.some(function (vt) {
return vt === t;
});
});
if (props.onTransfer) {
props.onTransfer({
originalEvent: event,
source: sourceList,
target: targetList,
direction: 'allToSource'
});
}
}
};
var className = classNames('p-picklist-buttons p-picklist-transfer-buttons', props.className);
return /*#__PURE__*/React__namespace.createElement("div", {
className: className
}, /*#__PURE__*/React__namespace.createElement(Button, {
disabled: moveRightDisabled,
type: "button",
icon: "pi pi-angle-right",
onClick: moveRight
}), /*#__PURE__*/React__namespace.createElement(Button, {
disabled: moveAllRightDisabled,
type: "button",
icon: "pi pi-angle-double-right",
onClick: moveAllRight
}), /*#__PURE__*/React__namespace.createElement(Button, {
disabled: moveLeftDisabled,
type: "button",
icon: "pi pi-angle-left",
onClick: moveLeft
}), /*#__PURE__*/React__namespace.createElement(Button, {
disabled: moveAllLeftDisabled,
type: "button",
icon: "pi pi-angle-double-left",
onClick: moveAllLeft
}));
});
PickListTransferControls.displayName = 'PickListTransferControls';
var PickList = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = PickListBase.getProps(inProps);
var _React$useState = React__namespace.useState([]),
_React$useState2 = _slicedToArray(_React$useState, 2),
sourceSelectionState = _React$useState2[0],
setSourceSelectionState = _React$useState2[1];
var _React$useState3 = React__namespace.useState([]),
_React$useState4 = _slicedToArray(_React$useState3, 2),
targetSelectionState = _React$useState4[0],
setTargetSelectionState = _React$useState4[1];
var _React$useState5 = React__namespace.useState(''),
_React$useState6 = _slicedToArray(_React$useState5, 2),
sourceFilterValueState = _React$useState6[0],
setSourceFilterValueState = _React$useState6[1];
var _React$useState7 = React__namespace.useState(''),
_React$useState8 = _slicedToArray(_React$useState7, 2),
targetFilterValueState = _React$useState8[0],
setTargetFilterValueState = _React$useState8[1];
var _React$useState9 = React__namespace.useState(null),
_React$useState10 = _slicedToArray(_React$useState9, 2),
attributeSelectorState = _React$useState10[0],
setAttributeSelectorState = _React$useState10[1];
var elementRef = React__namespace.useRef(null);
var sourceListElementRef = React__namespace.useRef(null);
var targetListElementRef = React__namespace.useRef(null);
var reorderedListElementRef = React__namespace.useRef(null);
var reorderDirection = React__namespace.useRef(null);
var styleElementRef = React__namespace.useRef(null);
var sourceSelection = props.sourceSelection ? props.sourceSelection : sourceSelectionState;
var targetSelection = props.targetSelection ? props.targetSelection : targetSelectionState;
var sourceFilteredValue = props.onSourceFilterChange ? props.sourceFilterValue : sourceFilterValueState;
var targetFilteredValue = props.onTargetFilterChange ? props.targetFilterValue : targetFilterValueState;
var hasFilterBy = ObjectUtils.isNotEmpty(props.filterBy);
var showSourceFilter = hasFilterBy && props.showSourceFilter;
var showTargetFilter = hasFilterBy && props.showTargetFilter;
var onSourceReorder = function onSourceReorder(event) {
handleChange(event, event.value, props.target);
reorderedListElementRef.current = sourceListElementRef.current.listElementRef.current;
reorderDirection.current = event.direction;
};
var onTargetReorder = function onTargetReorder(event) {
handleChange(event, props.source, event.value);
reorderedListElementRef.current = targetListElementRef.current.listElementRef.current;
reorderDirection.current = event.direction;
};
var handleScrollPosition = function handleScrollPosition(listElement, direction) {
if (listElement) {
var list = DomHandler.findSingle(listElement, '.p-picklist-list');
switch (direction) {
case 'up':
scrollInView(list, -1);
break;
case 'top':
list.scrollTop = 0;
break;
case 'down':
scrollInView(list, 1);
break;
case 'bottom':
/* TODO: improve this code block */
setTimeout(function () {
return list.scrollTop = list.scrollHeight;
}, 100);
break;
}
}
};
var handleChange = function handleChange(event, source, target) {
if (props.onChange) {
props.onChange({
originalEvent: event.originalEvent,
source: source,
target: target
});
}
};
var onTransfer = function onTransfer(event) {
var originalEvent = event.originalEvent,
source = event.source,
target = event.target,
direction = event.direction;
var selectedValue = [];
switch (direction) {
case 'toTarget':
selectedValue = sourceSelection;
if (props.onMoveToTarget) {
props.onMoveToTarget({
originalEvent: originalEvent,
value: selectedValue
});
}
break;
case 'allToTarget':
selectedValue = props.source;
if (props.onMoveAllToTarget) {
props.onMoveAllToTarget({
originalEvent: originalEvent,
value: selectedValue
});
}
break;
case 'toSource':
selectedValue = targetSelection;
if (props.onMoveToSource) {
props.onMoveToSource({
originalEvent: originalEvent,
value: selectedValue
});
}
break;
case 'allToSource':
selectedValue = props.target;
if (props.onMoveAllToSource) {
props.onMoveAllToSource({
originalEvent: originalEvent,
value: selectedValue
});
}
break;
}
_onSelectionChange({
originalEvent: originalEvent,
value: selectedValue
}, 'sourceSelection', props.onSourceSelectionChange);
_onSelectionChange({
originalEvent: originalEvent,
value: selectedValue
}, 'targetSelection', props.onTargetSelectionChange);
handleChange(event, source, target);
};
var scrollInView = 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]);
}
};
var _onSelectionChange = function onSelectionChange(e, stateKey, callback) {
if (stateKey === 'sourceSelection') setSourceSelectionState(e.value);else setTargetSelectionState(e.value);
if (callback) {
callback(e);
}
if (ObjectUtils.isNotEmpty(sourceSelection) && stateKey === 'targetSelection') {
setSourceSelectionState([]);
} else if (ObjectUtils.isNotEmpty(targetSelection) && stateKey === 'sourceSelection') {
setTargetSelectionState([]);
}
};
var onFilter = function onFilter(event) {
var originalEvent = event.originalEvent,
value = event.value,
type = event.type;
var _ref = type === 'source' ? [setSourceFilterValueState, props.onSourceFilterChange] : [setTargetFilterValueState, props.onTargetFilterChange],
_ref2 = _slicedToArray(_ref, 2),
setFilterState = _ref2[0],
onFilterChange = _ref2[1];
if (onFilterChange) {
onFilterChange({
originalEvent: originalEvent,
value: value
});
} else {
setFilterState(value);
}
};
var getVisibleList = function getVisibleList(list, type) {
var _ref3 = type === 'source' ? [sourceFilteredValue, filterSource] : [targetFilteredValue, filterTarget],
_ref4 = _slicedToArray(_ref3, 2),
filteredValue = _ref4[0],
filterCallback = _ref4[1];
return hasFilterBy && ObjectUtils.isNotEmpty(filteredValue) ? filterCallback(filteredValue) : list;
};
var filterSource = function filterSource() {
var value = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
var filteredValue = value.trim().toLocaleLowerCase(props.filterLocale);
return filter(props.source, filteredValue);
};
var filterTarget = function filterTarget() {
var value = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
var filteredValue = value.trim().toLocaleLowerCase(props.filterLocale);
return filter(props.target, filteredValue);
};
var filter = function filter(list, filterValue) {
var searchFields = hasFilterBy ? props.filterBy.split(',') : [];
return FilterService.filter(list, searchFields, filterValue, props.filterMatchMode, props.filterLocale);
};
var createStyle = function createStyle() {
if (!styleElementRef.current) {
styleElementRef.current = DomHandler.createInlineStyle(PrimeReact.nonce);
var innerHTML = "\n@media screen and (max-width: ".concat(props.breakpoint, ") {\n .p-picklist[").concat(attributeSelectorState, "] {\n flex-direction: column;\n }\n\n .p-picklist[").concat(attributeSelectorState, "] .p-picklist-buttons {\n padding: var(--content-padding);\n flex-direction: row;\n }\n\n .p-picklist[").concat(attributeSelectorState, "] .p-picklist-buttons .p-button {\n margin-right: var(--inline-spacing);\n margin-bottom: 0;\n }\n\n .p-picklist[").concat(attributeSelectorState, "] .p-picklist-buttons .p-button:last-child {\n margin-right: 0;\n }\n\n .p-picklist[").concat(attributeSelectorState, "] .pi-angle-right:before {\n content: \"\\e930\"\n }\n\n .p-picklist[").concat(attributeSelectorState, "] .pi-angle-double-right:before {\n content: \"\\e92c\"\n }\n\n .p-picklist[").concat(attributeSelectorState, "] .pi-angle-left:before {\n content: \"\\e933\"\n }\n\n .p-picklist[").concat(attributeSelectorState, "] .pi-angle-double-left:before {\n content: \"\\e92f\"\n }\n}\n");
styleElementRef.current.innerHTML = innerHTML;
}
};
var destroyStyle = function destroyStyle() {
styleElementRef.current = DomHandler.removeInlineStyle(styleElementRef.current);
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
getElement: function getElement() {
return elementRef.current;
}
};
});
useMountEffect(function () {
!attributeSelectorState && setAttributeSelectorState(UniqueComponentId());
});
useUpdateEffect(function () {
if (attributeSelectorState) {
elementRef.current.setAttribute(attributeSelectorState, '');
createStyle();
}
return function () {
destroyStyle();
};
}, [attributeSelectorState, props.breakpoint]);
useUpdateEffect(function () {
if (reorderedListElementRef.current) {
handleScrollPosition(reorderedListElementRef.current, reorderDirection.current);
reorderedListElementRef.current = null;
reorderDirection.current = null;
}
});
var otherProps = PickListBase.getOtherProps(props);
var className = classNames('p-picklist p-component', props.className);
var sourceItemTemplate = props.sourceItemTemplate ? props.sourceItemTemplate : props.itemTemplate;
var targetItemTemplate = props.targetItemTemplate ? props.targetItemTemplate : props.itemTemplate;
var sourceList = getVisibleList(props.source, 'source');
var targetList = getVisibleList(props.target, 'target');
return /*#__PURE__*/React__namespace.createElement("div", _extends({
id: props.id,
ref: elementRef,
className: className,
style: props.style
}, otherProps), props.showSourceControls && /*#__PURE__*/React__namespace.createElement(PickListControls, {
list: props.source,
selection: sourceSelection,
onReorder: onSourceReorder,
className: "p-picklist-source-controls",
dataKey: props.dataKey
}), /*#__PURE__*/React__namespace.createElement(PickListSubList, {
ref: sourceListElementRef,
type: "source",
list: sourceList,
selection: sourceSelection,
onSelectionChange: function onSelectionChange(e) {
return _onSelectionChange(e, 'sourceSelection', props.onSourceSelectionChange);
},
itemTemplate: sourceItemTemplate,
header: props.sourceHeader,
style: props.sourceStyle,
className: "p-picklist-source-wrapper",
listClassName: "p-picklist-source",
metaKeySelection: props.metaKeySelection,
tabIndex: props.tabIndex,
dataKey: props.dataKey,
filterValue: sourceFilteredValue,
onFilter: onFilter,
showFilter: showSourceFilter,
placeholder: props.sourceFilterPlaceholder,
template: props.sourceFilterTemplate
}), /*#__PURE__*/React__namespace.createElement(PickListTransferControls, {
onTransfer: onTransfer,
source: props.source,
visibleSourceList: sourceList,
target: props.target,
visibleTargetList: targetList,
sourceSelection: sourceSelection,
targetSelection: targetSelection,
dataKey: props.dataKey
}), /*#__PURE__*/React__namespace.createElement(PickListSubList, {
ref: targetListElementRef,
type: "target",
list: targetList,
selection: targetSelection,
onSelectionChange: function onSelectionChange(e) {
return _onSelectionChange(e, 'targetSelection', props.onTargetSelectionChange);
},
itemTemplate: targetItemTemplate,
header: props.targetHeader,
style: props.targetStyle,
className: "p-picklist-target-wrapper",
listClassName: "p-picklist-target",
metaKeySelection: props.metaKeySelection,
tabIndex: props.tabIndex,
dataKey: props.dataKey,
filterValue: targetFilteredValue,
onFilter: onFilter,
showFilter: showTargetFilter,
placeholder: props.targetFilterPlaceholder,
template: props.targetFilterTemplate
}), props.showTargetControls && /*#__PURE__*/React__namespace.createElement(PickListControls, {
list: props.target,
selection: targetSelection,
onReorder: onTargetReorder,
className: "p-picklist-target-controls",
dataKey: props.dataKey
}));
}));
PickList.displayName = 'PickList';
var ProgressSpinnerBase = {
defaultProps: {
__TYPE: 'ProgressSpinner',
id: null,
style: null,
className: null,
strokeWidth: '2',
fill: 'none',
animationDuration: '2s',
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, ProgressSpinnerBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, ProgressSpinnerBase.defaultProps);
}
};
var ProgressSpinner = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = ProgressSpinnerBase.getProps(inProps);
var elementRef = React__namespace.useRef(null);
var otherProps = ProgressSpinnerBase.getOtherProps(props);
var className = classNames('p-progress-spinner', props.className);
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
getElement: function getElement() {
return elementRef.current;
}
};
});
return /*#__PURE__*/React__namespace.createElement("div", _extends({
id: props.id,
ref: elementRef,
style: props.style,
className: className,
role: "alert",
"aria-busy": true
}, otherProps), /*#__PURE__*/React__namespace.createElement("svg", {
className: "p-progress-spinner-svg",
viewBox: "25 25 50 50",
style: {
animationDuration: props.animationDuration
}
}, /*#__PURE__*/React__namespace.createElement("circle", {
className: "p-progress-spinner-circle",
cx: "50",
cy: "50",
r: "20",
fill: props.fill,
strokeWidth: props.strokeWidth,
strokeMiterlimit: "10"
})));
}));
ProgressSpinner.displayName = 'ProgressSpinner';
var RadioButtonBase = {
defaultProps: {
__TYPE: 'RadioButton',
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,
onChange: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, RadioButtonBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, RadioButtonBase.defaultProps);
}
};
var RadioButton = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = RadioButtonBase.getProps(inProps);
var _React$useState = React__namespace.useState(false),
_React$useState2 = _slicedToArray(_React$useState, 2),
focusedState = _React$useState2[0],
setFocusedState = _React$useState2[1];
var elementRef = React__namespace.useRef(null);
var inputRef = React__namespace.useRef(props.inputRef);
var select = function select(e) {
onClick(e);
};
var onClick = function onClick(e) {
if (!props.disabled && props.onChange) {
var checked = props.checked;
var radioClicked = e.target instanceof HTMLDivElement;
var inputClicked = e.target === inputRef.current;
var isInputToggled = inputClicked && e.target.checked !== checked;
var isRadioToggled = radioClicked && (DomHandler.hasClass(elementRef.current, 'p-radiobutton-checked') === checked ? !checked : false);
if (isInputToggled || isRadioToggled) {
var value = !checked;
props.onChange({
originalEvent: e,
value: props.value,
checked: value,
stopPropagation: function stopPropagation() {},
preventDefault: function preventDefault() {},
target: {
type: 'radio',
name: props.name,
id: props.id,
value: props.value,
checked: value
}
});
if (isRadioToggled) {
inputRef.current.checked = value;
}
}
DomHandler.focus(inputRef.current);
e.preventDefault();
}
};
var onFocus = function onFocus() {
setFocusedState(true);
};
var onBlur = function onBlur() {
setFocusedState(false);
};
var onKeyDown = function onKeyDown(event) {
if (event.code === 'Space' || event.key === ' ') {
// event.key is for Android support
onClick(event);
}
};
React__namespace.useEffect(function () {
if (inputRef.current) {
inputRef.current.checked = props.checked;
}
}, [props.checked]);
React__namespace.useEffect(function () {
ObjectUtils.combinedRefs(inputRef, props.inputRef);
}, [inputRef, props.inputRef]);
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
select: select,
focus: function focus() {
return DomHandler.focus(inputRef.current);
},
getElement: function getElement() {
return elementRef.current;
},
getInput: function getInput() {
return inputRef.current;
}
};
});
var hasTooltip = ObjectUtils.isNotEmpty(props.tooltip);
var otherProps = RadioButtonBase.getOtherProps(props);
var ariaProps = ObjectUtils.reduceKeys(otherProps, DomHandler.ARIA_PROPS);
var className = classNames('p-radiobutton p-component', {
'p-radiobutton-checked': props.checked,
'p-radiobutton-disabled': props.disabled,
'p-radiobutton-focused': focusedState
}, props.className);
var boxClassName = classNames('p-radiobutton-box', {
'p-highlight': props.checked,
'p-disabled': props.disabled,
'p-focus': focusedState
});
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement("div", _extends({
ref: elementRef,
id: props.id,
className: className,
style: props.style
}, otherProps, {
onClick: onClick
}), /*#__PURE__*/React__namespace.createElement("div", {
className: "p-hidden-accessible"
}, /*#__PURE__*/React__namespace.createElement("input", _extends({
ref: inputRef,
id: props.inputId,
type: "radio",
name: props.name,
defaultChecked: props.checked,
onFocus: onFocus,
onBlur: onBlur,
onKeyDown: onKeyDown,
disabled: props.disabled,
required: props.required,
tabIndex: props.tabIndex
}, ariaProps))), /*#__PURE__*/React__namespace.createElement("div", {
className: boxClassName
}, /*#__PURE__*/React__namespace.createElement("div", {
className: "p-radiobutton-icon"
}))), hasTooltip && /*#__PURE__*/React__namespace.createElement(Tooltip, _extends({
target: elementRef,
content: props.tooltip
}, props.tooltipOptions)));
}));
RadioButton.displayName = 'RadioButton';
var RatingBase = {
defaultProps: {
__TYPE: 'Rating',
id: null,
value: null,
disabled: false,
readOnly: false,
stars: 5,
cancel: true,
style: null,
className: null,
tooltip: null,
tooltipOptions: null,
onChange: null,
onIcon: 'pi pi-star-fill',
offIcon: 'pi pi-star',
cancelIcon: 'pi pi-ban',
cancelIconProps: null,
onIconProps: null,
offIconProps: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, RatingBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, RatingBase.defaultProps);
}
};
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; }
var Rating = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = RatingBase.getProps(inProps);
var elementRef = React__namespace.useRef(null);
var enabled = !props.disabled && !props.readOnly;
var tabIndex = enabled ? 0 : null;
var rate = function rate(event, i) {
if (enabled && props.onChange) {
props.onChange({
originalEvent: event,
value: i,
stopPropagation: function stopPropagation() {},
preventDefault: function preventDefault() {},
target: {
name: props.name,
id: props.id,
value: i
}
});
}
event.preventDefault();
};
var clear = function clear(event) {
if (enabled && props.onChange) {
props.onChange({
originalEvent: event,
value: null,
stopPropagation: function stopPropagation() {},
preventDefault: function preventDefault() {},
target: {
name: props.name,
id: props.id,
value: null
}
});
}
event.preventDefault();
};
var onStarKeyDown = function onStarKeyDown(event, value) {
if (event.key === 'Enter') {
rate(event, value);
}
};
var onCancelKeyDown = function onCancelKeyDown(event) {
if (event.key === 'Enter') {
clear(event);
}
};
var createIcons = function createIcons() {
return Array.from({
length: props.stars
}, function (_, i) {
return i + 1;
}).map(function (value) {
var active = value <= props.value;
var className = classNames('p-rating-item', {
'p-rating-item-active': active
});
var icon = active ? {
type: props.onIcon,
props: props.onIconProps
} : {
type: props.offIcon,
props: props.offIconProps
};
var content = IconUtils.getJSXIcon(icon.type, _objectSpread$a({
className: 'p-rating-icon'
}, icon.props), {
props: props
});
return /*#__PURE__*/React__namespace.createElement("div", {
key: value,
className: className,
tabIndex: tabIndex,
onClick: function onClick(e) {
return rate(e, value);
},
onKeyDown: function onKeyDown(e) {
return onStarKeyDown(e, value);
}
}, content);
});
};
var createCancelIcon = function createCancelIcon() {
if (props.cancel) {
var content = IconUtils.getJSXIcon(props.cancelIcon, _objectSpread$a({
className: 'p-rating-icon p-rating-cancel'
}, props.cancelIconProps), {
props: props
});
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-rating-item p-rating-cancel-item",
onClick: clear,
tabIndex: tabIndex,
onKeyDown: onCancelKeyDown
}, content);
}
return null;
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
getElement: function getElement() {
return elementRef.current;
}
};
});
var hasTooltip = ObjectUtils.isNotEmpty(props.tooltip);
var otherProps = RatingBase.getOtherProps(props);
var className = classNames('p-rating', {
'p-disabled': props.disabled,
'p-readonly': props.readOnly
}, props.className);
var cancelIcon = createCancelIcon();
var icons = createIcons();
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement("div", _extends({
ref: elementRef,
id: props.id,
className: className,
style: props.style
}, otherProps), cancelIcon, icons), hasTooltip && /*#__PURE__*/React__namespace.createElement(Tooltip, _extends({
target: elementRef,
content: props.tooltip
}, props.tooltipOptions)));
}));
Rating.displayName = 'Rating';
var Row = function Row(inProps) {
var props = RowBase.getProps(inProps);
var otherProps = RowBase.getOtherProps(props);
return /*#__PURE__*/React__namespace.createElement("tr", _extends({
className: props.className,
style: props.style
}, otherProps), props.children);
};
Row.displayName = 'Row';
var ScrollPanelBase = {
defaultProps: {
__TYPE: 'ScrollPanel',
id: null,
style: null,
className: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, ScrollPanelBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, ScrollPanelBase.defaultProps);
}
};
var ScrollPanel = /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = ScrollPanelBase.getProps(inProps);
var containerRef = React__namespace.useRef(null);
var contentRef = React__namespace.useRef(null);
var xBarRef = React__namespace.useRef(null);
var yBarRef = React__namespace.useRef(null);
var isXBarClicked = React__namespace.useRef(false);
var isYBarClicked = React__namespace.useRef(false);
var lastPageX = React__namespace.useRef(null);
var lastPageY = React__namespace.useRef(null);
var scrollXRatio = React__namespace.useRef(null);
var scrollYRatio = React__namespace.useRef(null);
var frame = React__namespace.useRef(null);
var initialized = React__namespace.useRef(false);
var calculateContainerHeight = function calculateContainerHeight() {
var containerStyles = getComputedStyle(containerRef.current);
var xBarStyles = getComputedStyle(xBarRef.current);
var pureContainerHeight = DomHandler.getHeight(containerRef.current) - parseInt(xBarStyles['height'], 10);
if (containerStyles['max-height'] !== 'none' && pureContainerHeight === 0) {
if (contentRef.current.offsetHeight + parseInt(xBarStyles['height'], 10) > parseInt(containerStyles['max-height'], 10)) {
containerRef.current.style.height = containerStyles['max-height'];
} else {
containerRef.current.style.height = contentRef.current.offsetHeight + parseFloat(containerStyles.paddingTop) + parseFloat(containerStyles.paddingBottom) + parseFloat(containerStyles.borderTopWidth) + parseFloat(containerStyles.borderBottomWidth) + 'px';
}
}
};
var moveBar = function moveBar() {
// horizontal scroll
var totalWidth = contentRef.current.scrollWidth;
var ownWidth = contentRef.current.clientWidth;
var bottom = (containerRef.current.clientHeight - xBarRef.current.clientHeight) * -1;
scrollXRatio.current = ownWidth / totalWidth;
// vertical scroll
var totalHeight = contentRef.current.scrollHeight;
var ownHeight = contentRef.current.clientHeight;
var right = (containerRef.current.clientWidth - yBarRef.current.clientWidth) * -1;
scrollYRatio.current = ownHeight / totalHeight;
frame.current = window.requestAnimationFrame(function () {
if (scrollXRatio.current >= 1) {
DomHandler.addClass(xBarRef.current, 'p-scrollpanel-hidden');
} else {
DomHandler.removeClass(xBarRef.current, 'p-scrollpanel-hidden');
xBarRef.current.style.cssText = 'width:' + Math.max(scrollXRatio.current * 100, 10) + '%; left:' + contentRef.current.scrollLeft / totalWidth * 100 + '%;bottom:' + bottom + 'px;';
}
if (scrollYRatio.current >= 1) {
DomHandler.addClass(yBarRef.current, 'p-scrollpanel-hidden');
} else {
DomHandler.removeClass(yBarRef.current, 'p-scrollpanel-hidden');
yBarRef.current.style.cssText = 'height:' + Math.max(scrollYRatio.current * 100, 10) + '%; top: calc(' + contentRef.current.scrollTop / totalHeight * 100 + '% - ' + xBarRef.current.clientHeight + 'px);right:' + right + 'px;';
}
});
};
var onYBarMouseDown = function onYBarMouseDown(event) {
isYBarClicked.current = true;
lastPageY.current = event.pageY;
DomHandler.addClass(yBarRef.current, 'p-scrollpanel-grabbed');
DomHandler.addClass(document.body, 'p-scrollpanel-grabbed');
document.addEventListener('mousemove', onDocumentMouseMove);
document.addEventListener('mouseup', onDocumentMouseUp);
event.preventDefault();
};
var onXBarMouseDown = function onXBarMouseDown(event) {
isXBarClicked.current = true;
lastPageX.current = event.pageX;
DomHandler.addClass(xBarRef.current, 'p-scrollpanel-grabbed');
DomHandler.addClass(document.body, 'p-scrollpanel-grabbed');
document.addEventListener('mousemove', onDocumentMouseMove);
document.addEventListener('mouseup', onDocumentMouseUp);
event.preventDefault();
};
var onDocumentMouseMove = function onDocumentMouseMove(event) {
if (isXBarClicked.current) {
onMouseMoveForXBar(event);
} else if (isYBarClicked.current) {
onMouseMoveForYBar(event);
} else {
onMouseMoveForXBar(event);
onMouseMoveForYBar(event);
}
};
var onMouseMoveForXBar = function onMouseMoveForXBar(event) {
var deltaX = event.pageX - lastPageX.current;
lastPageX.current = event.pageX;
frame.current = window.requestAnimationFrame(function () {
contentRef.current.scrollLeft += deltaX / scrollXRatio.current;
});
};
var onMouseMoveForYBar = function onMouseMoveForYBar(event) {
var deltaY = event.pageY - lastPageY.current;
lastPageY.current = event.pageY;
frame.current = window.requestAnimationFrame(function () {
contentRef.current.scrollTop += deltaY / scrollYRatio.current;
});
};
var onDocumentMouseUp = function onDocumentMouseUp(event) {
DomHandler.removeClass(yBarRef.current, 'p-scrollpanel-grabbed');
DomHandler.removeClass(xBarRef.current, 'p-scrollpanel-grabbed');
DomHandler.removeClass(document.body, 'p-scrollpanel-grabbed');
document.removeEventListener('mousemove', onDocumentMouseMove);
document.removeEventListener('mouseup', onDocumentMouseUp);
isXBarClicked.current = false;
isYBarClicked.current = false;
};
var refresh = function refresh() {
moveBar();
};
useMountEffect(function () {
moveBar();
window.addEventListener('resize', moveBar);
calculateContainerHeight();
initialized.current = true;
});
useUnmountEffect(function () {
if (initialized.current) {
window.removeEventListener('resize', moveBar);
}
if (frame.current) {
window.cancelAnimationFrame(frame.current);
}
});
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
refresh: refresh,
getElement: function getElement() {
return containerRef.current;
},
getContent: function getContent() {
return contentRef.current;
},
getXBar: function getXBar() {
return xBarRef.current;
},
getYBar: function getYBar() {
return yBarRef.current;
}
};
});
var otherProps = ScrollPanelBase.getOtherProps(props);
var className = classNames('p-scrollpanel p-component', props.className);
return /*#__PURE__*/React__namespace.createElement("div", _extends({
ref: containerRef,
id: props.id,
className: className,
style: props.style
}, otherProps), /*#__PURE__*/React__namespace.createElement("div", {
className: "p-scrollpanel-wrapper"
}, /*#__PURE__*/React__namespace.createElement("div", {
ref: contentRef,
className: "p-scrollpanel-content",
onScroll: moveBar,
onMouseEnter: moveBar
}, props.children)), /*#__PURE__*/React__namespace.createElement("div", {
ref: xBarRef,
className: "p-scrollpanel-bar p-scrollpanel-bar-x",
onMouseDown: onXBarMouseDown
}), /*#__PURE__*/React__namespace.createElement("div", {
ref: yBarRef,
className: "p-scrollpanel-bar p-scrollpanel-bar-y",
onMouseDown: onYBarMouseDown
}));
});
ScrollPanel.displayName = 'ScrollPanel';
var ScrollTopBase = {
defaultProps: {
__TYPE: 'ScrollTop',
target: 'window',
threshold: 400,
icon: 'pi pi-chevron-up',
behavior: 'smooth',
className: null,
style: null,
transitionOptions: null,
onShow: null,
onHide: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, ScrollTopBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, ScrollTopBase.defaultProps);
}
};
var ScrollTop = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = ScrollTopBase.getProps(inProps);
var _React$useState = React__namespace.useState(false),
_React$useState2 = _slicedToArray(_React$useState, 2),
visibleState = _React$useState2[0],
setVisibleState = _React$useState2[1];
var scrollElementRef = React__namespace.useRef(null);
var helperRef = React__namespace.useRef(null);
var isTargetParent = props.target === 'parent';
var _useEventListener = useEventListener({
target: function target() {
return helperRef.current && helperRef.current.parentElement;
},
type: 'scroll',
listener: function listener(event) {
checkVisibility(event.currentTarget.scrollTop);
}
}),
_useEventListener2 = _slicedToArray(_useEventListener, 1),
bindParentScrollListener = _useEventListener2[0];
var _useEventListener3 = useEventListener({
target: 'window',
type: 'scroll',
listener: function listener() {
checkVisibility(DomHandler.getWindowScrollTop());
}
}),
_useEventListener4 = _slicedToArray(_useEventListener3, 1),
bindDocumentScrollListener = _useEventListener4[0];
var onClick = function onClick() {
var scrollElement = props.target === 'window' ? window : helperRef.current.parentElement;
scrollElement.scroll({
top: 0,
behavior: props.behavior
});
};
var checkVisibility = function checkVisibility(scrollY) {
setVisibleState(scrollY > props.threshold);
};
var onEnter = function onEnter() {
ZIndexUtils.set('overlay', scrollElementRef.current, PrimeReact.autoZIndex, PrimeReact.zIndex['overlay']);
};
var onEntered = function onEntered() {
props.onShow && props.onShow();
};
var onExited = function onExited() {
ZIndexUtils.clear(scrollElementRef.current);
props.onHide && props.onHide();
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
getElement: function getElement() {
return elementRef.current;
}
};
});
useMountEffect(function () {
if (props.target === 'window') bindDocumentScrollListener();else if (props.target === 'parent') bindParentScrollListener();
});
useUnmountEffect(function () {
ZIndexUtils.clear(scrollElementRef.current);
});
var otherProps = ScrollTopBase.getOtherProps(props);
var className = classNames('p-scrolltop p-link p-component', {
'p-scrolltop-sticky': props.target !== 'window'
}, props.className);
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement(CSSTransition, {
nodeRef: scrollElementRef,
classNames: "p-scrolltop",
"in": visibleState,
timeout: {
enter: 150,
exit: 150
},
options: props.transitionOptions,
unmountOnExit: true,
onEnter: onEnter,
onEntered: onEntered,
onExited: onExited
}, /*#__PURE__*/React__namespace.createElement("button", _extends({
ref: scrollElementRef,
type: "button",
className: className,
style: props.style
}, otherProps, {
onClick: onClick
}), IconUtils.getJSXIcon(props.icon, {
className: 'p-scrolltop-icon'
}, {
props: props
}), /*#__PURE__*/React__namespace.createElement(Ripple, null))), isTargetParent && /*#__PURE__*/React__namespace.createElement("span", {
ref: helperRef,
className: "p-scrolltop-helper"
}));
}));
ScrollTop.displayName = 'ScrollTop';
var SelectButtonBase = {
defaultProps: {
__TYPE: 'SelectButton',
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,
itemTemplate: null,
onChange: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, SelectButtonBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, SelectButtonBase.defaultProps);
}
};
var SelectButtonItem = /*#__PURE__*/React__namespace.memo(function (props) {
var _React$useState = React__namespace.useState(false),
_React$useState2 = _slicedToArray(_React$useState, 2),
focusedState = _React$useState2[0],
setFocusedState = _React$useState2[1];
var onClick = function onClick(event) {
if (props.onClick) {
props.onClick({
originalEvent: event,
option: props.option
});
}
};
var onFocus = function onFocus() {
setFocusedState(true);
};
var onBlur = function onBlur() {
setFocusedState(false);
};
var onKeyDown = function onKeyDown(event) {
var keyCode = event.which;
if (keyCode === 32) {
onClick(event);
event.preventDefault();
}
};
var createContent = function createContent() {
return props.template ? ObjectUtils.getJSXElement(props.template, props.option) : /*#__PURE__*/React__namespace.createElement("span", {
className: "p-button-label p-c"
}, props.label);
};
var className = classNames('p-button p-component', {
'p-highlight': props.selected,
'p-disabled': props.disabled,
'p-focus': focusedState
}, props.className);
var content = createContent();
return /*#__PURE__*/React__namespace.createElement("div", {
className: className,
role: "button",
"aria-label": props.label,
"aria-pressed": props.selected,
onClick: onClick,
onKeyDown: onKeyDown,
tabIndex: props.tabIndex,
onFocus: onFocus,
onBlur: onBlur
}, content, !props.disabled && /*#__PURE__*/React__namespace.createElement(Ripple, null));
});
SelectButtonItem.displayName = 'SelectButtonItem';
var SelectButton = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = SelectButtonBase.getProps(inProps);
var elementRef = React__namespace.useRef(null);
var onOptionClick = function onOptionClick(event) {
if (props.disabled || isOptionDisabled(event.option)) {
return;
}
var selected = isSelected(event.option);
if (selected && !props.unselectable) {
return;
}
var optionValue = getOptionValue(event.option);
var newValue;
if (props.multiple) {
var currentValue = props.value ? _toConsumableArray(props.value) : [];
newValue = selected ? currentValue.filter(function (val) {
return !ObjectUtils.equals(val, optionValue, props.dataKey);
}) : [].concat(_toConsumableArray(currentValue), [optionValue]);
} else {
newValue = selected ? null : optionValue;
}
if (props.onChange) {
props.onChange({
originalEvent: event.originalEvent,
value: newValue,
stopPropagation: function stopPropagation() {},
preventDefault: function preventDefault() {},
target: {
name: props.name,
id: props.id,
value: newValue
}
});
}
};
var getOptionLabel = function getOptionLabel(option) {
return props.optionLabel ? ObjectUtils.resolveFieldData(option, props.optionLabel) : option && option['label'] !== undefined ? option['label'] : option;
};
var getOptionValue = function getOptionValue(option) {
return props.optionValue ? ObjectUtils.resolveFieldData(option, props.optionValue) : option && option['value'] !== undefined ? option['value'] : option;
};
var isOptionDisabled = function isOptionDisabled(option) {
if (props.optionDisabled) {
return ObjectUtils.isFunction(props.optionDisabled) ? props.optionDisabled(option) : ObjectUtils.resolveFieldData(option, props.optionDisabled);
}
return option && option['disabled'] !== undefined ? option['disabled'] : false;
};
var isSelected = function isSelected(option) {
var optionValue = getOptionValue(option);
if (props.multiple) {
if (props.value && props.value.length) {
return props.value.some(function (val) {
return ObjectUtils.equals(val, optionValue, props.dataKey);
});
}
} else {
return ObjectUtils.equals(props.value, optionValue, props.dataKey);
}
return false;
};
var createItems = function createItems() {
if (props.options && props.options.length) {
return props.options.map(function (option, index) {
var isDisabled = props.disabled || isOptionDisabled(option);
var optionLabel = getOptionLabel(option);
var tabIndex = isDisabled ? null : 0;
var selected = isSelected(option);
var key = optionLabel + '_' + index;
return /*#__PURE__*/React__namespace.createElement(SelectButtonItem, {
key: key,
label: optionLabel,
className: option.className,
option: option,
onClick: onOptionClick,
template: props.itemTemplate,
selected: selected,
tabIndex: tabIndex,
disabled: isDisabled
});
});
}
return null;
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
focus: function focus() {
return DomHandler.focusFirstElement(elementRef.current);
},
getElement: function getElement() {
return elementRef.current;
}
};
});
var hasTooltip = ObjectUtils.isNotEmpty(props.tooltip);
var otherProps = SelectButtonBase.getOtherProps(props);
var className = classNames('p-selectbutton p-buttonset p-component', props.className);
var items = createItems();
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement("div", _extends({
ref: elementRef,
id: props.id,
className: className,
style: props.style
}, otherProps, {
role: "group"
}), items), hasTooltip && /*#__PURE__*/React__namespace.createElement(Tooltip, _extends({
target: elementRef,
content: props.tooltip
}, props.tooltipOptions)));
}));
SelectButton.displayName = 'SelectButton';
var SidebarBase = {
defaultProps: {
__TYPE: 'Sidebar',
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: null,
closeOnEscape: true,
icons: null,
modal: true,
appendTo: null,
transitionOptions: null,
onShow: null,
onHide: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, SidebarBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, SidebarBase.defaultProps);
}
};
var Sidebar = /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = SidebarBase.getProps(inProps);
var _React$useState = React__namespace.useState(false),
_React$useState2 = _slicedToArray(_React$useState, 2),
maskVisibleState = _React$useState2[0],
setMaskVisibleState = _React$useState2[1];
var _React$useState3 = React__namespace.useState(false),
_React$useState4 = _slicedToArray(_React$useState3, 2),
visibleState = _React$useState4[0],
setVisibleState = _React$useState4[1];
var sidebarRef = React__namespace.useRef(null);
var maskRef = React__namespace.useRef(null);
var closeIconRef = React__namespace.useRef(null);
var _useEventListener = useEventListener({
type: 'keydown',
listener: function listener(event) {
if (event.which === 27) {
if (ZIndexUtils.get(maskRef.current) === ZIndexUtils.getCurrent('modal', PrimeReact.autoZIndex)) {
onClose(event);
}
}
}
}),
_useEventListener2 = _slicedToArray(_useEventListener, 2),
bindDocumentEscapeListener = _useEventListener2[0],
unbindDocumentEscapeListener = _useEventListener2[1];
var _useEventListener3 = useEventListener({
type: 'click',
listener: function listener(event) {
if (event.which === 2) {
// left click
return;
}
if (isOutsideClicked(event)) {
onClose(event);
}
}
}),
_useEventListener4 = _slicedToArray(_useEventListener3, 2),
bindDocumentClickListener = _useEventListener4[0],
unbindDocumentClickListener = _useEventListener4[1];
var isOutsideClicked = function isOutsideClicked(event) {
return sidebarRef && sidebarRef.current && !sidebarRef.current.contains(event.target);
};
var getPositionClass = function getPositionClass() {
var positions = ['left', 'right', 'top', 'bottom'];
var pos = positions.find(function (item) {
return item === props.position;
});
return pos ? "p-sidebar-".concat(pos) : '';
};
var focus = function focus() {
var activeElement = document.activeElement;
var isActiveElementInDialog = activeElement && sidebarRef && sidebarRef.current.contains(activeElement);
if (!isActiveElementInDialog && props.showCloseIcon) {
closeIconRef.current.focus();
}
};
var onMaskClick = function onMaskClick(event) {
if (props.dismissable && props.modal && maskRef.current === event.target) {
onClose(event);
}
};
var onClose = function onClose(event) {
props.onHide();
event.preventDefault();
};
var onEntered = function onEntered() {
props.onShow && props.onShow();
focus();
enableDocumentSettings();
};
var onExiting = function onExiting() {
if (props.modal) {
DomHandler.addClass(maskRef.current, 'p-component-overlay-leave');
}
};
var onExited = function onExited() {
ZIndexUtils.clear(maskRef.current);
setMaskVisibleState(false);
disableDocumentSettings();
};
var enableDocumentSettings = function enableDocumentSettings() {
if (props.closeOnEscape) {
bindDocumentEscapeListener();
}
if (props.dismissable && !props.modal) {
bindDocumentClickListener();
}
if (props.blockScroll) {
DomHandler.addClass(document.body, 'p-overflow-hidden');
}
};
var disableDocumentSettings = function disableDocumentSettings() {
unbindDocumentEscapeListener();
unbindDocumentClickListener();
if (props.blockScroll) {
DomHandler.removeClass(document.body, 'p-overflow-hidden');
}
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
getElement: function getElement() {
return sidebarRef.current;
},
gteMask: function gteMask() {
return maskRef.current;
},
getCloseIcon: function getCloseIcon() {
return closeIconRef.current;
}
};
});
useMountEffect(function () {
if (props.visible) {
setMaskVisibleState(true);
}
});
useUpdateEffect(function () {
if (props.visible && !maskVisibleState) {
setMaskVisibleState(true);
}
if (props.visible !== visibleState && maskVisibleState) {
setVisibleState(props.visible);
}
});
useUpdateEffect(function () {
if (maskVisibleState) {
ZIndexUtils.set('modal', maskRef.current, PrimeReact.autoZIndex, props.baseZIndex || PrimeReact.zIndex['modal']);
setVisibleState(true);
}
}, [maskVisibleState]);
useUpdateEffect(function () {
// #3811 if dismissible state is toggled while open we must unregister and re-regisetr
if (visibleState) {
unbindDocumentClickListener();
if (props.dismissable && !props.modal) {
bindDocumentClickListener();
}
}
}, [props.dismissable, props.modal, visibleState]);
useUnmountEffect(function () {
disableDocumentSettings();
maskRef.current && ZIndexUtils.clear(maskRef.current);
});
var createCloseIcon = function createCloseIcon() {
if (props.showCloseIcon) {
var ariaLabel = props.ariaCloseLabel || localeOption('close');
return /*#__PURE__*/React__namespace.createElement("button", {
type: "button",
ref: closeIconRef,
className: "p-sidebar-close p-sidebar-icon p-link",
onClick: onClose,
"aria-label": ariaLabel
}, /*#__PURE__*/React__namespace.createElement("span", {
className: "p-sidebar-close-icon pi pi-times",
"aria-hidden": "true"
}), /*#__PURE__*/React__namespace.createElement(Ripple, null));
}
return null;
};
var createIcons = function createIcons() {
return props.icons ? ObjectUtils.getJSXElement(props.icons, props) : null;
};
var createElement = function createElement() {
var otherProps = SidebarBase.getOtherProps(props);
var className = classNames('p-sidebar p-component', props.className, {
'p-input-filled': PrimeReact.inputStyle === 'filled',
'p-ripple-disabled': PrimeReact.ripple === false
});
var maskClassName = classNames('p-sidebar-mask', {
'p-component-overlay p-component-overlay-enter': props.modal,
'p-sidebar-mask-scrollblocker': props.blockScroll,
'p-sidebar-visible': maskVisibleState,
'p-sidebar-full': props.fullScreen
}, getPositionClass(), props.maskClassName);
var closeIcon = createCloseIcon();
var icons = createIcons();
var transitionTimeout = {
enter: props.fullScreen ? 150 : 300,
exit: props.fullScreen ? 150 : 300
};
return /*#__PURE__*/React__namespace.createElement("div", {
ref: maskRef,
style: props.maskStyle,
className: maskClassName,
onMouseDown: onMaskClick
}, /*#__PURE__*/React__namespace.createElement(CSSTransition, {
nodeRef: sidebarRef,
classNames: "p-sidebar",
"in": visibleState,
timeout: transitionTimeout,
options: props.transitionOptions,
unmountOnExit: true,
onEntered: onEntered,
onExiting: onExiting,
onExited: onExited
}, /*#__PURE__*/React__namespace.createElement("div", _extends({
ref: sidebarRef,
id: props.id,
className: className,
style: props.style
}, otherProps, {
role: "complementary"
}), /*#__PURE__*/React__namespace.createElement("div", {
className: "p-sidebar-header"
}, icons, closeIcon), /*#__PURE__*/React__namespace.createElement("div", {
className: "p-sidebar-content"
}, props.children))));
};
var createSidebar = function createSidebar() {
var element = createElement();
return /*#__PURE__*/React__namespace.createElement(Portal, {
element: element,
appendTo: props.appendTo,
visible: true
});
};
return maskVisibleState && createSidebar();
});
Sidebar.displayName = 'Sidebar';
var SkeletonBase = {
defaultProps: {
__TYPE: 'Skeleton',
shape: 'rectangle',
size: null,
width: '100%',
height: '1rem',
borderRadius: null,
animation: 'wave',
style: null,
className: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, SkeletonBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, SkeletonBase.defaultProps);
}
};
var Skeleton = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = SkeletonBase.getProps(inProps);
var elementRef = React__namespace.useRef(null);
var otherProps = SkeletonBase.getOtherProps(props);
var style = props.size ? {
width: props.size,
height: props.size,
borderRadius: props.borderRadius
} : {
width: props.width,
height: props.height,
borderRadius: props.borderRadius
};
var className = classNames('p-skeleton p-component', {
'p-skeleton-circle': props.shape === 'circle',
'p-skeleton-none': props.animation === 'none'
}, props.className);
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
getElement: function getElement() {
return elementRef.current;
}
};
});
return /*#__PURE__*/React__namespace.createElement("div", _extends({
ref: elementRef,
style: style,
className: className
}, otherProps));
}));
Skeleton.displayName = 'Skeleton';
var SlideMenuBase = {
defaultProps: {
__TYPE: 'SlideMenu',
appendTo: null,
autoZIndex: true,
backLabel: 'Back',
baseZIndex: 0,
className: null,
easing: 'ease-out',
effectDuration: 250,
id: null,
menuWidth: 190,
model: null,
onHide: null,
onShow: null,
onNavigate: null,
popup: false,
style: null,
transitionOptions: null,
viewportHeight: 175,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, SlideMenuBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, SlideMenuBase.defaultProps);
}
};
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; }
var SlideMenuSub = /*#__PURE__*/React__namespace.memo(function (props) {
var _React$useState = React__namespace.useState(null),
_React$useState2 = _slicedToArray(_React$useState, 2),
activeItemState = _React$useState2[0],
setActiveItemState = _React$useState2[1];
var _React$useState3 = React__namespace.useState({}),
_React$useState4 = _slicedToArray(_React$useState3, 2),
renderSubMenu = _React$useState4[0],
setRenderSubMenu = _React$useState4[1];
var onItemClick = function onItemClick(event, item, index) {
if (item.disabled) {
event.preventDefault();
return;
}
if (!item.url) {
event.preventDefault();
}
if (item.command) {
item.command({
originalEvent: event,
item: item
});
}
if (item.items) {
var key = createKey(item, index);
setRenderSubMenu(_objectSpread$9(_objectSpread$9({}, renderSubMenu), {}, _defineProperty({}, key, true)));
setActiveItemState(item);
props.onForward();
}
};
var createSeparator = function createSeparator(index) {
var key = 'separator_' + index;
return /*#__PURE__*/React__namespace.createElement("li", {
key: key,
className: "p-menu-separator"
});
};
var createSubmenu = function createSubmenu(item, index) {
var shouldRender = renderSubMenu[createKey(item, index)];
if (item.items && shouldRender) {
return /*#__PURE__*/React__namespace.createElement(SlideMenuSub, {
menuProps: props.menuProps,
model: item.items,
index: props.index + 1,
menuWidth: props.menuWidth,
effectDuration: props.effectDuration,
onForward: props.onForward,
parentActive: item === activeItemState
});
}
return null;
};
var createKey = function createKey(item, index) {
return item.label + '_' + index;
};
var createMenuitem = function createMenuitem(item, index) {
if (item.visible === false) {
return null;
}
var key = createKey(item, index);
var active = activeItemState === 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 = IconUtils.getJSXIcon(item.icon, {
className: 'p-menuitem-icon'
}, {
props: props.menuProps
});
var label = item.label && /*#__PURE__*/React__namespace.createElement("span", {
className: "p-menuitem-text"
}, item.label);
var submenuIcon = item.items && /*#__PURE__*/React__namespace.createElement("span", {
className: submenuIconClassName
});
var submenu = createSubmenu(item, index);
var content = /*#__PURE__*/React__namespace.createElement("a", {
href: item.url || '#',
className: "p-menuitem-link",
target: item.target,
onClick: function onClick(event) {
return onItemClick(event, item, index);
},
"aria-disabled": item.disabled
}, icon, label, submenuIcon);
if (item.template) {
var defaultContentOptions = {
onClick: function onClick(event) {
return onItemClick(event, item, index);
},
className: 'p-menuitem-link',
labelClassName: 'p-menuitem-text',
iconClassName: iconClassName,
submenuIconClassName: submenuIconClassName,
element: content,
props: props,
active: active
};
content = ObjectUtils.getJSXElement(item.template, item, defaultContentOptions);
}
return /*#__PURE__*/React__namespace.createElement("li", {
key: key,
id: item.id,
className: className,
style: item.style
}, content, submenu);
};
var createItem = function createItem(item, index) {
return item.separator ? createSeparator(index) : createMenuitem(item, index);
};
var createItems = function createItems() {
return props.model ? props.model.map(createItem) : null;
};
var style = {
width: props.menuWidth + 'px',
left: props.root ? -1 * props.level * props.menuWidth + 'px' : props.menuWidth + 'px',
transitionProperty: props.root ? 'left' : 'none',
transitionDuration: props.effectDuration + 'ms',
transitionTimingFunction: props.easing
};
var className = classNames({
'p-slidemenu-rootlist': props.root,
'p-submenu-list': !props.root,
'p-active-submenu': props.parentActive
});
var items = createItems();
return /*#__PURE__*/React__namespace.createElement("ul", {
className: className,
style: style
}, items);
});
SlideMenuSub.displayName = 'SlideMenuSub';
var SlideMenu = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = SlideMenuBase.getProps(inProps);
var _React$useState = React__namespace.useState(0),
_React$useState2 = _slicedToArray(_React$useState, 2),
levelState = _React$useState2[0],
setLevelState = _React$useState2[1];
var _React$useState3 = React__namespace.useState(false),
_React$useState4 = _slicedToArray(_React$useState3, 2),
visibleState = _React$useState4[0],
setVisibleState = _React$useState4[1];
var menuRef = React__namespace.useRef(null);
var targetRef = React__namespace.useRef(null);
var backward = React__namespace.useRef(null);
var slideMenuContent = React__namespace.useRef(null);
var _useOverlayListener = useOverlayListener({
target: targetRef,
overlay: menuRef,
listener: function listener(event, _ref) {
var valid = _ref.valid;
valid && hide(event);
},
when: visibleState
}),
_useOverlayListener2 = _slicedToArray(_useOverlayListener, 2),
bindOverlayListener = _useOverlayListener2[0],
unbindOverlayListener = _useOverlayListener2[1];
var onPanelClick = function onPanelClick(event) {
if (props.popup) {
OverlayService.emit('overlay-click', {
originalEvent: event,
target: targetRef.current
});
}
};
var navigateForward = function navigateForward() {
setLevelState(function (prevLevel) {
return prevLevel + 1;
});
};
var navigateBack = function navigateBack() {
setLevelState(function (prevLevel) {
return prevLevel - 1;
});
};
var toggle = function toggle(event) {
if (props.popup) {
visibleState ? hide(event) : show(event);
}
};
var show = function show(event) {
targetRef.current = event.currentTarget;
setVisibleState(true);
props.onShow && props.onShow(event);
};
var hide = function hide(event) {
targetRef.current = event.currentTarget;
setVisibleState(false);
props.onHide && props.onHide(event);
};
var onEnter = function onEnter() {
if (props.autoZIndex) {
ZIndexUtils.set('menu', menuRef.current, PrimeReact.autoZIndex, props.baseZIndex || PrimeReact.zIndex['menu']);
}
DomHandler.absolutePosition(menuRef.current, targetRef.current);
};
var onEntered = function onEntered() {
bindOverlayListener();
};
var onExit = function onExit() {
targetRef.current = null;
unbindOverlayListener();
};
var onExited = function onExited() {
ZIndexUtils.clear(menuRef.current);
setLevelState(0);
};
useUpdateEffect(function () {
setLevelState(0);
}, [props.model]);
useUpdateEffect(function () {
props.onNavigate && props.onNavigate({
level: levelState
});
}, [levelState]);
useUnmountEffect(function () {
ZIndexUtils.clear(menuRef.current);
});
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
toggle: toggle,
show: show,
hide: hide,
navigateForward: navigateForward,
navigateBack: navigateBack,
setLevelState: setLevelState,
getElement: function getElement() {
return menuRef.current;
}
};
});
var createBackward = function createBackward() {
var className = classNames('p-slidemenu-backward', {
'p-hidden': levelState === 0
});
return /*#__PURE__*/React__namespace.createElement("div", {
ref: backward,
className: className,
onClick: navigateBack
}, /*#__PURE__*/React__namespace.createElement("span", {
className: "p-slidemenu-backward-icon pi pi-fw pi-chevron-left"
}), /*#__PURE__*/React__namespace.createElement("span", null, props.backLabel));
};
var createElement = function createElement() {
var otherProps = SlideMenuBase.getOtherProps(props);
var className = classNames('p-slidemenu p-component', {
'p-slidemenu-overlay': props.popup
}, props.className);
var wrapperStyle = {
height: props.viewportHeight + 'px'
};
var backward = createBackward();
return /*#__PURE__*/React__namespace.createElement(CSSTransition, {
nodeRef: menuRef,
classNames: "p-connected-overlay",
"in": !props.popup || visibleState,
timeout: {
enter: 120,
exit: 100
},
options: props.transitionOptions,
unmountOnExit: true,
onEnter: onEnter,
onEntered: onEntered,
onExit: onExit,
onExited: onExited
}, /*#__PURE__*/React__namespace.createElement("div", _extends({
ref: menuRef,
id: props.id,
className: className,
style: props.style
}, otherProps, {
onClick: onPanelClick
}), /*#__PURE__*/React__namespace.createElement("div", {
className: "p-slidemenu-wrapper",
style: wrapperStyle
}, /*#__PURE__*/React__namespace.createElement("div", {
className: "p-slidemenu-content",
ref: slideMenuContent
}, /*#__PURE__*/React__namespace.createElement(SlideMenuSub, {
menuProps: props,
model: props.model,
root: true,
index: 0,
menuWidth: props.menuWidth,
effectDuration: props.effectDuration,
level: levelState,
parentActive: levelState === 0,
onForward: navigateForward
})), backward)));
};
var element = createElement();
return props.popup ? /*#__PURE__*/React__namespace.createElement(Portal, {
element: element,
appendTo: props.appendTo
}) : element;
}));
SlideMenu.displayName = 'SlideMenu';
var SliderBase = {
defaultProps: {
__TYPE: 'Slider',
id: null,
value: null,
min: 0,
max: 100,
orientation: 'horizontal',
step: null,
range: false,
style: null,
className: null,
disabled: false,
tabIndex: 0,
onChange: null,
onSlideEnd: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, SliderBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, SliderBase.defaultProps);
}
};
var Slider = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = SliderBase.getProps(inProps);
var elementRef = React__namespace.useRef(null);
var handleIndex = React__namespace.useRef(0);
var sliderHandleClick = React__namespace.useRef(false);
var dragging = React__namespace.useRef(false);
var initX = React__namespace.useRef(0);
var initY = React__namespace.useRef(0);
var barWidth = React__namespace.useRef(0);
var barHeight = React__namespace.useRef(0);
var value = props.range ? props.value || [props.min, props.max] : props.value || 0;
var horizontal = props.orientation === 'horizontal';
var vertical = props.orientation === 'vertical';
var _useEventListener = useEventListener({
type: 'mousemove',
listener: function listener(event) {
return onDrag(event);
}
}),
_useEventListener2 = _slicedToArray(_useEventListener, 2),
bindDocumentMouseMoveListener = _useEventListener2[0],
unbindDocumentMouseMoveListener = _useEventListener2[1];
var _useEventListener3 = useEventListener({
type: 'mouseup',
listener: function listener(event) {
return onDragEnd(event);
}
}),
_useEventListener4 = _slicedToArray(_useEventListener3, 2),
bindDocumentMouseUpListener = _useEventListener4[0],
unbindDocumentMouseUpListener = _useEventListener4[1];
var _useEventListener5 = useEventListener({
type: 'touchmove',
listener: function listener(event) {
return onDrag(event);
}
}),
_useEventListener6 = _slicedToArray(_useEventListener5, 2),
bindDocumentTouchMoveListener = _useEventListener6[0],
unbindDocumentTouchMoveListener = _useEventListener6[1];
var _useEventListener7 = useEventListener({
type: 'touchend',
listener: function listener(event) {
return onDragEnd(event);
}
}),
_useEventListener8 = _slicedToArray(_useEventListener7, 2),
bindDocumentTouchEndListener = _useEventListener8[0],
unbindDocumentTouchEndListener = _useEventListener8[1];
var spin = function spin(event, dir) {
var val = props.range ? value[handleIndex.current] : value;
var step = (props.step || 1) * dir;
updateValue(event, val + step);
event.preventDefault();
};
var onDragStart = function onDragStart(event, index) {
if (props.disabled) {
return;
}
dragging.current = true;
updateDomData();
sliderHandleClick.current = true;
handleIndex.current = index;
//event.preventDefault();
};
var onDrag = function onDrag(event) {
if (dragging.current) {
setValue(event);
event.preventDefault();
}
};
var onDragEnd = function onDragEnd(event) {
if (dragging.current) {
dragging.current = false;
props.onSlideEnd && props.onSlideEnd({
originalEvent: event,
value: props.value
});
unbindDocumentMouseMoveListener();
unbindDocumentMouseUpListener();
unbindDocumentTouchMoveListener();
unbindDocumentTouchEndListener();
}
};
var _onMouseDown = function onMouseDown(event, index) {
bindDocumentMouseMoveListener();
bindDocumentMouseUpListener();
onDragStart(event, index);
};
var _onTouchStart = function onTouchStart(event, index) {
bindDocumentTouchMoveListener();
bindDocumentTouchEndListener();
onDragStart(event, index);
};
var _onKeyDown = function onKeyDown(event, index) {
if (props.disabled) {
return;
}
handleIndex.current = index;
var key = event.key;
if (key === 'ArrowRight' || key === 'ArrowUp') {
spin(event, 1);
} else if (key === 'ArrowLeft' || key === 'ArrowDown') {
spin(event, -1);
}
};
var onBarClick = function onBarClick(event) {
if (props.disabled) {
return;
}
if (!sliderHandleClick.current) {
updateDomData();
var _value = setValue(event);
props.onSlideEnd && props.onSlideEnd({
originalEvent: event,
value: _value
});
}
sliderHandleClick.current = false;
};
var updateDomData = function updateDomData() {
var rect = elementRef.current.getBoundingClientRect();
initX.current = rect.left + DomHandler.getWindowScrollLeft();
initY.current = rect.top + DomHandler.getWindowScrollTop();
barWidth.current = elementRef.current.offsetWidth;
barHeight.current = elementRef.current.offsetHeight;
};
var setValue = 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 (horizontal) handleValue = (pageX - initX.current) * 100 / barWidth.current;else handleValue = (initY.current + barHeight.current - pageY) * 100 / barHeight.current;
var newValue = (props.max - props.min) * (handleValue / 100) + props.min;
if (props.step) {
var oldValue = props.range ? value[handleIndex.current] : value;
var diff = newValue - oldValue;
if (diff < 0) newValue = oldValue + Math.ceil(newValue / props.step - oldValue / props.step) * props.step;else if (diff > 0) newValue = oldValue + Math.floor(newValue / props.step - oldValue / props.step) * props.step;
} else {
newValue = Math.floor(newValue);
}
return updateValue(event, newValue);
};
var updateValue = function updateValue(event, val) {
var parsedValue = parseFloat(val.toFixed(10));
var newValue = parsedValue;
if (props.range) {
if (handleIndex.current === 0) {
if (parsedValue < props.min) parsedValue = props.min;else if (parsedValue > value[1]) parsedValue = value[1];
} else {
if (parsedValue > props.max) parsedValue = props.max;else if (parsedValue < value[0]) parsedValue = value[0];
}
newValue = _toConsumableArray(value);
newValue[handleIndex.current] = parsedValue;
if (props.onChange) {
props.onChange({
originalEvent: event,
value: newValue
});
}
} else {
if (parsedValue < props.min) parsedValue = props.min;else if (parsedValue > props.max) parsedValue = props.max;
newValue = parsedValue;
if (props.onChange) {
props.onChange({
originalEvent: event,
value: newValue
});
}
}
return newValue;
};
var createHandle = function createHandle(leftValue, bottomValue, index) {
var style = {
transition: dragging.current ? 'none' : null,
left: leftValue !== null && leftValue + '%',
bottom: bottomValue && bottomValue + '%'
};
var className = classNames('p-slider-handle', {
'p-slider-handle-start': index === 0,
'p-slider-handle-end': index === 1,
'p-slider-handle-active': handleIndex.current === index
});
return /*#__PURE__*/React__namespace.createElement("span", _extends({
className: className,
style: style,
tabIndex: props.tabIndex,
role: "slider",
onMouseDown: function onMouseDown(event) {
return _onMouseDown(event, index);
},
onTouchStart: function onTouchStart(event) {
return _onTouchStart(event, index);
},
onKeyDown: function onKeyDown(event) {
return _onKeyDown(event, index);
},
"aria-valuemin": props.min,
"aria-valuemax": props.max,
"aria-valuenow": leftValue || bottomValue,
"aria-orientation": props.orientation
}, ariaProps));
};
var createRangeSlider = function createRangeSlider() {
var handleValueStart = (value[0] < props.min ? props.min : value[0] - props.min) * 100 / (props.max - props.min);
var handleValueEnd = (value[1] > props.max ? props.max : value[1] - props.min) * 100 / (props.max - props.min);
var rangeStartHandle = horizontal ? createHandle(handleValueStart, null, 0) : createHandle(null, handleValueStart, 0);
var rangeEndHandle = horizontal ? createHandle(handleValueEnd, null, 1) : createHandle(null, handleValueEnd, 1);
var rangeStyle = horizontal ? {
left: handleValueStart + '%',
width: handleValueEnd - handleValueStart + '%'
} : {
bottom: handleValueStart + '%',
height: handleValueEnd - handleValueStart + '%'
};
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement("span", {
className: "p-slider-range",
style: rangeStyle
}), rangeStartHandle, rangeEndHandle);
};
var createSingleSlider = function createSingleSlider() {
var handleValue;
if (value < props.min) handleValue = props.min;else if (value > props.max) handleValue = props.max;else handleValue = (value - props.min) * 100 / (props.max - props.min);
var rangeStyle = horizontal ? {
width: handleValue + '%'
} : {
height: handleValue + '%'
};
var handle = horizontal ? createHandle(handleValue, null, null) : createHandle(null, handleValue, null);
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement("span", {
className: "p-slider-range",
style: rangeStyle
}), handle);
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
getElement: function getElement() {
return elementRef.current;
}
};
});
var otherProps = SliderBase.getOtherProps(props);
var ariaProps = ObjectUtils.reduceKeys(otherProps, DomHandler.ARIA_PROPS);
var className = classNames('p-slider p-component', props.className, {
'p-disabled': props.disabled,
'p-slider-horizontal': horizontal,
'p-slider-vertical': vertical
});
var content = props.range ? createRangeSlider() : createSingleSlider();
return /*#__PURE__*/React__namespace.createElement("div", _extends({
ref: elementRef,
id: props.id,
style: props.style,
className: className
}, otherProps, {
onClick: onBarClick
}), content);
}));
Slider.displayName = 'Slider';
var SpeedDialBase = {
defaultProps: {
__TYPE: 'SpeedDial',
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,
'aria-label': null,
maskStyle: null,
maskClassName: null,
showIcon: 'pi pi-plus',
hideIcon: null,
rotateAnimation: true,
onVisibleChange: null,
onClick: null,
onShow: null,
onHide: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, SpeedDialBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, SpeedDialBase.defaultProps);
}
};
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; }
var SpeedDial = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var _classNames2;
var props = SpeedDialBase.getProps(inProps);
var _React$useState = React__namespace.useState(false),
_React$useState2 = _slicedToArray(_React$useState, 2),
visibleState = _React$useState2[0],
setVisibleState = _React$useState2[1];
var isItemClicked = React__namespace.useRef(false);
var elementRef = React__namespace.useRef(null);
var listRef = React__namespace.useRef(null);
var visible = props.onVisibleChange ? props.visible : visibleState;
var _useEventListener = useEventListener({
type: 'click',
listener: function listener(event) {
if (!isItemClicked.current && isOutsideClicked(event)) {
hide();
}
isItemClicked.current = false;
},
when: visibleState
}),
_useEventListener2 = _slicedToArray(_useEventListener, 2),
bindDocumentClickListener = _useEventListener2[0],
unbindDocumentClickListener = _useEventListener2[1];
var show = function show() {
props.onVisibleChange ? props.onVisibleChange(true) : setVisibleState(true);
props.onShow && props.onShow();
};
var hide = function hide() {
props.onVisibleChange ? props.onVisibleChange(false) : setVisibleState(false);
props.onHide && props.onHide();
};
var onClick = function onClick(e) {
visible ? hide() : show();
props.onClick && props.onClick(e);
isItemClicked.current = true;
};
var onItemClick = function onItemClick(e, item) {
item.command && item.command({
originalEvent: e,
item: item
});
hide();
isItemClicked.current = true;
e.preventDefault();
};
var isOutsideClicked = function isOutsideClicked(event) {
return elementRef.current && !(elementRef.current.isSameNode(event.target) || elementRef.current.contains(event.target));
};
var calculateTransitionDelay = function calculateTransitionDelay(index) {
var length = props.model.length;
return (visible ? index : length - index - 1) * props.transitionDelay;
};
var calculatePointStyle = function calculatePointStyle(index) {
var type = props.type;
if (type !== 'linear') {
var length = props.model.length;
var radius = 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 = 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 = 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 {};
};
var getItemStyle = function getItemStyle(index) {
var transitionDelay = calculateTransitionDelay(index);
var pointStyle = calculatePointStyle(index);
return _objectSpread$8({
transitionDelay: "".concat(transitionDelay, "ms")
}, pointStyle);
};
useMountEffect(function () {
if (props.type !== 'linear') {
var _button = DomHandler.findSingle(elementRef.current, '.p-speeddial-button');
var firstItem = DomHandler.findSingle(listRef.current, '.p-speeddial-item');
if (_button && firstItem) {
var wDiff = Math.abs(_button.offsetWidth - firstItem.offsetWidth);
var hDiff = Math.abs(_button.offsetHeight - firstItem.offsetHeight);
listRef.current.style.setProperty('--item-diff-x', "".concat(wDiff / 2, "px"));
listRef.current.style.setProperty('--item-diff-y', "".concat(hDiff / 2, "px"));
}
}
});
useUpdateEffect(function () {
if (visibleState) {
props.hideOnClickOutside && bindDocumentClickListener();
}
return function () {
props.hideOnClickOutside && unbindDocumentClickListener();
};
}, [visibleState]);
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
show: show,
hide: hide,
getElement: function getElement() {
return elementRef.current;
}
};
});
var createItem = function createItem(item, index) {
if (item.visible === false) {
return null;
}
var style = 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 = IconUtils.getJSXIcon(_icon, {
className: 'p-speeddial-action-icon'
}, {
props: props
});
var content = /*#__PURE__*/React__namespace.createElement("a", {
href: url || '#',
role: "menuitem",
className: contentClassName,
target: target,
"data-pr-tooltip": label,
onClick: function onClick(e) {
return onItemClick(e, item);
}
}, icon, /*#__PURE__*/React__namespace.createElement(Ripple, null));
if (template) {
var defaultContentOptions = {
onClick: function onClick(e) {
return onItemClick(e, item);
},
className: contentClassName,
iconClassName: iconClassName,
element: content,
props: props,
visible: visible
};
content = ObjectUtils.getJSXElement(template, item, defaultContentOptions);
}
return /*#__PURE__*/React__namespace.createElement("li", {
key: index,
className: "p-speeddial-item",
style: style,
role: "none"
}, content);
};
var createItems = function createItems() {
return props.model ? props.model.map(createItem) : null;
};
var createList = function createList() {
var items = createItems();
return /*#__PURE__*/React__namespace.createElement("ul", {
ref: listRef,
className: "p-speeddial-list",
role: "menu"
}, items);
};
var createButton = function createButton() {
var _classNames;
var showIconVisible = !visible && !!props.showIcon || !props.hideIcon;
var hideIconVisible = visible && !!props.hideIcon;
var className = classNames('p-speeddial-button p-button-rounded', {
'p-speeddial-rotate': props.rotateAnimation && !props.hideIcon
}, props.buttonClassName);
var iconClassName = classNames((_classNames = {}, _defineProperty(_classNames, "".concat(props.showIcon), !visible && !!props.showIcon || !props.hideIcon), _defineProperty(_classNames, "".concat(props.hideIcon), visible && !!props.hideIcon), _classNames));
var icon = IconUtils.getJSXIcon(showIconVisible ? props.showIcon : hideIconVisible ? props.hideIcon : null, undefined, {
props: props
});
var content = /*#__PURE__*/React__namespace.createElement(Button, {
type: "button",
style: props.buttonStyle,
className: className,
icon: icon,
onClick: onClick,
disabled: props.disabled,
"aria-label": props['aria-label']
});
if (props.buttonTemplate) {
var defaultContentOptions = {
onClick: onClick,
className: className,
iconClassName: iconClassName,
element: content,
props: props,
visible: visible
};
return ObjectUtils.getJSXElement(props.buttonTemplate, defaultContentOptions);
}
return content;
};
var createMask = function createMask() {
if (props.mask) {
var _className = classNames('p-speeddial-mask', {
'p-speeddial-mask-visible': visible
}, props.maskClassName);
return /*#__PURE__*/React__namespace.createElement("div", {
className: _className,
style: props.maskStyle
});
}
return null;
};
var otherProps = SpeedDialBase.getOtherProps(props);
var className = classNames("p-speeddial p-component p-speeddial-".concat(props.type), (_classNames2 = {}, _defineProperty(_classNames2, "p-speeddial-direction-".concat(props.direction), props.type !== 'circle'), _defineProperty(_classNames2, 'p-speeddial-opened', visible), _defineProperty(_classNames2, 'p-disabled', props.disabled), _classNames2), props.className);
var button = createButton();
var list = createList();
var mask = createMask();
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement("div", _extends({
ref: elementRef,
id: props.id,
className: className,
style: props.style
}, otherProps), button, list), mask);
}));
SpeedDial.displayName = 'SpeedDial';
var SplitButtonBase = {
defaultProps: {
__TYPE: 'SplitButton',
id: null,
label: null,
icon: null,
loading: false,
loadingIcon: 'pi pi-spinner pi-spin',
model: null,
disabled: null,
style: null,
className: null,
buttonClassName: null,
menuStyle: null,
menuClassName: null,
menuButtonClassName: null,
buttonProps: null,
menuButtonProps: null,
tabIndex: null,
severity: null,
rounded: false,
raised: false,
outlined: false,
text: false,
size: null,
appendTo: null,
tooltip: null,
tooltipOptions: null,
buttonTemplate: null,
transitionOptions: null,
dropdownIcon: 'pi pi-chevron-down',
onClick: null,
onShow: null,
onHide: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, SplitButtonBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, SplitButtonBase.defaultProps);
}
};
var SplitButtonItem = /*#__PURE__*/React__namespace.memo(function (props) {
var onClick = function onClick(e) {
if (props.menuitem.command) {
props.menuitem.command({
originalEvent: e,
item: props.menuitem
});
}
if (props.onItemClick) {
props.onItemClick(e);
}
e.preventDefault();
};
var createSeparator = function createSeparator() {
return /*#__PURE__*/React__namespace.createElement("li", {
className: "p-menu-separator",
role: "separator"
});
};
var createMenuitem = function createMenuitem() {
if (props.menuitem.visible === false) {
return null;
}
var _props$menuitem = props.menuitem,
disabled = _props$menuitem.disabled,
_icon = _props$menuitem.icon,
_label = _props$menuitem.label,
template = _props$menuitem.template,
url = _props$menuitem.url,
target = _props$menuitem.target,
_className = _props$menuitem.className;
var className = classNames('p-menuitem-link', _className, {
'p-disabled': disabled
});
var iconClassName = classNames('p-menuitem-icon', _icon);
var icon = IconUtils.getJSXIcon(_icon, {
className: 'p-menuitem-icon'
}, {
props: props.splitButtonProps
});
var label = _label && /*#__PURE__*/React__namespace.createElement("span", {
className: "p-menuitem-text"
}, _label);
var content = /*#__PURE__*/React__namespace.createElement("a", {
href: url || '#',
role: "menuitem",
className: className,
target: target,
onClick: onClick,
"aria-label": _label
}, icon, label);
if (template) {
var defaultContentOptions = {
onClick: onClick,
className: className,
labelClassName: 'p-menuitem-text',
iconClassName: iconClassName,
element: content,
props: props
};
content = ObjectUtils.getJSXElement(template, props.menuitem, defaultContentOptions);
}
return /*#__PURE__*/React__namespace.createElement("li", {
className: "p-menuitem",
role: "none"
}, content);
};
var createItem = function createItem() {
return props.menuitem.separator ? createSeparator() : createMenuitem();
};
var item = createItem();
return item;
});
SplitButtonItem.displayName = 'SplitButtonItem';
var SplitButtonPanel = /*#__PURE__*/React__namespace.forwardRef(function (props, ref) {
var createElement = function createElement() {
var className = classNames('p-menu p-menu-overlay p-component', props.menuClassName);
return /*#__PURE__*/React__namespace.createElement(CSSTransition, {
nodeRef: ref,
classNames: "p-connected-overlay",
"in": props["in"],
timeout: {
enter: 120,
exit: 100
},
options: props.transitionOptions,
unmountOnExit: true,
onEnter: props.onEnter,
onEntered: props.onEntered,
onExit: props.onExit,
onExited: props.onExited
}, /*#__PURE__*/React__namespace.createElement("div", {
ref: ref,
className: className,
style: props.menuStyle,
onClick: props.onClick
}, /*#__PURE__*/React__namespace.createElement("ul", {
id: props.menuId,
className: "p-menu-list p-reset",
role: "menu"
}, props.children)));
};
var element = createElement();
return /*#__PURE__*/React__namespace.createElement(Portal, {
element: element,
appendTo: props.appendTo
});
});
SplitButtonPanel.displayName = 'SplitButtonPanel';
var SplitButton = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var _classNames;
var props = SplitButtonBase.getProps(inProps);
var _React$useState = React__namespace.useState(props.id),
_React$useState2 = _slicedToArray(_React$useState, 2),
idState = _React$useState2[0],
setIdState = _React$useState2[1];
var _React$useState3 = React__namespace.useState(false),
_React$useState4 = _slicedToArray(_React$useState3, 2),
overlayVisibleState = _React$useState4[0],
setOverlayVisibleState = _React$useState4[1];
var elementRef = React__namespace.useRef(null);
var defaultButtonRef = React__namespace.useRef(null);
var overlayRef = React__namespace.useRef(null);
var _useOverlayListener = useOverlayListener({
target: elementRef,
overlay: overlayRef,
listener: function listener(event, _ref) {
var valid = _ref.valid;
valid && hide();
},
when: overlayVisibleState
}),
_useOverlayListener2 = _slicedToArray(_useOverlayListener, 2),
bindOverlayListener = _useOverlayListener2[0],
unbindOverlayListener = _useOverlayListener2[1];
var onPanelClick = function onPanelClick(event) {
OverlayService.emit('overlay-click', {
originalEvent: event,
target: elementRef.current
});
};
var onDropdownButtonClick = function onDropdownButtonClick() {
overlayVisibleState ? hide() : show();
};
var onItemClick = function onItemClick() {
hide();
};
var show = function show() {
setOverlayVisibleState(true);
};
var hide = function hide() {
setOverlayVisibleState(false);
};
var onOverlayEnter = function onOverlayEnter() {
ZIndexUtils.set('overlay', overlayRef.current, PrimeReact.autoZIndex, PrimeReact.zIndex['overlay']);
alignOverlay();
};
var onOverlayEntered = function onOverlayEntered() {
bindOverlayListener();
props.onShow && props.onShow();
};
var onOverlayExit = function onOverlayExit() {
unbindOverlayListener();
};
var onOverlayExited = function onOverlayExited() {
ZIndexUtils.clear(overlayRef.current);
props.onHide && props.onHide();
};
var alignOverlay = function alignOverlay() {
DomHandler.alignOverlay(overlayRef.current, defaultButtonRef.current.parentElement, props.appendTo || PrimeReact.appendTo);
};
useMountEffect(function () {
if (!idState) {
setIdState(UniqueComponentId());
}
});
useUnmountEffect(function () {
ZIndexUtils.clear(overlayRef.current);
});
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
show: show,
hide: hide,
getElement: function getElement() {
return elementRef.current;
}
};
});
var createItems = function createItems() {
if (props.model) {
return props.model.map(function (menuitem, index) {
return /*#__PURE__*/React__namespace.createElement(SplitButtonItem, {
splitButtonProps: props,
menuitem: menuitem,
key: index,
onItemClick: onItemClick
});
});
}
return null;
};
if (props.visible === false) {
return null;
}
var hasTooltip = ObjectUtils.isNotEmpty(props.tooltip);
var otherProps = SplitButtonBase.getOtherProps(props);
var sizeMapping = {
large: 'lg',
small: 'sm'
};
var size = sizeMapping[props.size];
var className = classNames('p-splitbutton p-component', props.className, (_classNames = {
'p-disabled': props.disabled,
'p-button-loading-label-only': props.loading && !props.icon && props.label
}, _defineProperty(_classNames, "p-button-".concat(props.severity), props.severity), _defineProperty(_classNames, 'p-button-raised', props.raised), _defineProperty(_classNames, 'p-button-rounded', props.rounded), _defineProperty(_classNames, 'p-button-text', props.text), _defineProperty(_classNames, 'p-button-outlined', props.outlined), _defineProperty(_classNames, "p-button-".concat(size), size), _classNames));
var buttonClassName = classNames('p-splitbutton-defaultbutton', props.buttonClassName);
var menuButtonClassName = classNames('p-splitbutton-menubutton', props.menuButtonClassName);
var buttonContent = props.buttonTemplate ? ObjectUtils.getJSXElement(props.buttonTemplate, props) : null;
var items = createItems();
var menuId = idState + '_menu';
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement("div", _extends({
ref: elementRef,
id: idState,
className: className,
style: props.style
}, otherProps), /*#__PURE__*/React__namespace.createElement(Button, _extends({
ref: defaultButtonRef,
type: "button",
className: buttonClassName,
icon: props.icon,
loading: props.loading,
loadingIcon: props.loadingIcon,
label: props.label,
onClick: props.onClick,
disabled: props.disabled,
tabIndex: props.tabIndex
}, props.buttonProps), buttonContent), /*#__PURE__*/React__namespace.createElement(Button, _extends({
type: "button",
className: menuButtonClassName,
icon: props.dropdownIcon,
onClick: onDropdownButtonClick,
disabled: props.disabled,
"aria-expanded": overlayVisibleState,
"aria-haspopup": "true",
"aria-controls": overlayVisibleState ? menuId : null
}, props.menuButtonProps)), /*#__PURE__*/React__namespace.createElement(SplitButtonPanel, {
ref: overlayRef,
appendTo: props.appendTo,
menuId: menuId,
menuStyle: props.menuStyle,
menuClassName: props.menuClassName,
onClick: onPanelClick,
"in": overlayVisibleState,
onEnter: onOverlayEnter,
onEntered: onOverlayEntered,
onExit: onOverlayExit,
onExited: onOverlayExited,
transitionOptions: props.transitionOptions
}, items)), hasTooltip && /*#__PURE__*/React__namespace.createElement(Tooltip, _extends({
target: elementRef,
content: props.tooltip
}, props.tooltipOptions)));
}));
SplitButton.displayName = 'SplitButton';
var SplitterBase = {
defaultProps: {
__TYPE: 'Splitter',
className: null,
gutterSize: 4,
id: null,
layout: 'horizontal',
onResizeEnd: null,
stateKey: null,
stateStorage: 'session',
style: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, SplitterBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, SplitterBase.defaultProps);
}
};
var SplitterPanelBase = {
defaultProps: {
__TYPE: 'SplitterPanel',
className: null,
minSize: null,
size: null,
style: null,
children: undefined
},
getCProps: function getCProps(panel) {
return ObjectUtils.getComponentProps(panel, SplitterPanelBase.defaultProps);
},
getCOtherProps: function getCOtherProps(panel) {
return ObjectUtils.getComponentDiffProps(panel, SplitterPanelBase.defaultProps);
},
getCProp: function getCProp(panel, name) {
return ObjectUtils.getComponentProp(panel, name, SplitterPanelBase.defaultProps);
}
};
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; }
var SplitterPanel = function SplitterPanel() {};
var Splitter = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = SplitterBase.getProps(inProps);
var elementRef = React__namespace.useRef(null);
var gutterRef = React__namespace.useRef();
var gutterRefs = React__namespace.useRef({});
var size = React__namespace.useRef(null);
var dragging = React__namespace.useRef(null);
var startPos = React__namespace.useRef(null);
var prevPanelElement = React__namespace.useRef(null);
var nextPanelElement = React__namespace.useRef(null);
var prevPanelSize = React__namespace.useRef(null);
var prevPanelSizeNew = React__namespace.useRef(null);
var nextPanelSize = React__namespace.useRef(null);
var nextPanelSizeNew = React__namespace.useRef(null);
var prevPanelIndex = React__namespace.useRef(null);
var _React$useState = React__namespace.useState([]),
_React$useState2 = _slicedToArray(_React$useState, 2),
panelSizes = _React$useState2[0],
setPanelSizes = _React$useState2[1];
var isStateful = props.stateKey != null;
var childrenLength = props.children && props.children.length || 1;
var panelSize = function panelSize(sizes, index) {
return index in sizes ? sizes[index] : props.children && [].concat(props.children)[index].props.size || 100 / childrenLength;
};
var _useEventListener = useEventListener({
type: 'mousemove',
listener: function listener(event) {
return onResize(event);
}
}),
_useEventListener2 = _slicedToArray(_useEventListener, 2),
bindDocumentMouseMoveListener = _useEventListener2[0],
unbindDocumentMouseMoveListener = _useEventListener2[1];
var _useEventListener3 = useEventListener({
type: 'mouseup',
listener: function listener(event) {
onResizeEnd(event);
unbindMouseListeners();
}
}),
_useEventListener4 = _slicedToArray(_useEventListener3, 2),
bindDocumentMouseUpListener = _useEventListener4[0],
unbindDocumentMouseUpListener = _useEventListener4[1];
var bindMouseListeners = function bindMouseListeners() {
bindDocumentMouseMoveListener();
bindDocumentMouseUpListener();
};
var unbindMouseListeners = function unbindMouseListeners() {
unbindDocumentMouseMoveListener();
unbindDocumentMouseUpListener();
};
var getPanelProp = function getPanelProp(panel, name) {
return SplitterPanelBase.getCProp(panel, name);
};
var validateResize = function validateResize(newPrevPanelSize, newNextPanelSize) {
if (newPrevPanelSize > 100 || newPrevPanelSize < 0) return false;
if (newNextPanelSize > 100 || newNextPanelSize < 0) return false;
if (props.children[prevPanelIndex.current].props && props.children[prevPanelIndex.current].props.minSize && props.children[prevPanelIndex.current].props.minSize > newPrevPanelSize) {
return false;
}
if (props.children[prevPanelIndex.current + 1].props && props.children[prevPanelIndex.current + 1].props.minSize && props.children[prevPanelIndex.current + 1].props.minSize > newNextPanelSize) {
return false;
}
return true;
};
var clear = function clear() {
dragging.current = false;
size.current = null;
startPos.current = null;
prevPanelElement.current = null;
nextPanelElement.current = null;
prevPanelSize.current = null;
prevPanelSizeNew.current = null;
nextPanelSize.current = null;
nextPanelSizeNew.current = null;
prevPanelIndex.current = null;
};
var getStorage = React__namespace.useCallback(function () {
switch (props.stateStorage) {
case 'local':
return window.localStorage;
case 'session':
return window.sessionStorage;
default:
throw new Error(props.stateStorage + ' is not a valid value for the state storage, supported values are "local" and "session".');
}
}, [props.stateStorage]);
var saveState = function saveState(sizes) {
getStorage().setItem(props.stateKey, JSON.stringify(sizes));
};
var restoreState = React__namespace.useCallback(function () {
var stateString = getStorage().getItem(props.stateKey);
if (stateString) setPanelSizes(JSON.parse(stateString));
}, [getStorage, props.stateKey]);
var onResizeStart = function onResizeStart(event, index) {
gutterRef.current = gutterRefs.current[index];
var pageX = event.type === 'touchstart' ? event.touches[0].pageX : event.pageX;
var pageY = event.type === 'touchstart' ? event.touches[0].pageY : event.pageY;
size.current = props.layout === 'horizontal' ? DomHandler.getWidth(elementRef.current) : DomHandler.getHeight(elementRef.current);
dragging.current = true;
startPos.current = props.layout === 'horizontal' ? pageX : pageY;
prevPanelElement.current = gutterRef.current.previousElementSibling;
nextPanelElement.current = gutterRef.current.nextElementSibling;
prevPanelSize.current = 100 * (props.layout === 'horizontal' ? DomHandler.getOuterWidth(prevPanelElement.current, true) : DomHandler.getOuterHeight(prevPanelElement.current, true)) / size.current;
prevPanelSizeNew.current = prevPanelSize.current;
nextPanelSize.current = 100 * (props.layout === 'horizontal' ? DomHandler.getOuterWidth(nextPanelElement.current, true) : DomHandler.getOuterHeight(nextPanelElement.current, true)) / size.current;
nextPanelSizeNew.current = nextPanelSize.current;
prevPanelIndex.current = index;
DomHandler.addClass(gutterRef.current, 'p-splitter-gutter-resizing');
DomHandler.addClass(elementRef.current, 'p-splitter-resizing');
};
var onResize = 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 (props.layout === 'horizontal') newPos = pageX * 100 / size.current - startPos.current * 100 / size.current;else newPos = pageY * 100 / size.current - startPos.current * 100 / size.current;
var newPrevPanelSize = prevPanelSize.current + newPos;
var newNextPanelSize = nextPanelSize.current - newPos;
if (validateResize(newPrevPanelSize, newNextPanelSize)) {
prevPanelSizeNew.current = newPrevPanelSize;
nextPanelSizeNew.current = newNextPanelSize;
prevPanelElement.current.style.flexBasis = 'calc(' + newPrevPanelSize + '% - ' + (props.children.length - 1) * props.gutterSize + 'px)';
nextPanelElement.current.style.flexBasis = 'calc(' + newNextPanelSize + '% - ' + (props.children.length - 1) * props.gutterSize + 'px)';
}
};
var onResizeEnd = function onResizeEnd(event) {
setPanelSizes(function (prev) {
var sizes = [];
for (var index = 0; index < props.children.length; index++) sizes[index] = panelSize(prev, index);
sizes[prevPanelIndex.current] = prevPanelSizeNew.current;
sizes[prevPanelIndex.current + 1] = nextPanelSizeNew.current;
if (props.onResizeEnd) {
props.onResizeEnd({
originalEvent: event,
sizes: sizes
});
}
if (isStateful) saveState(sizes);
return sizes;
});
DomHandler.removeClass(gutterRef.current, 'p-splitter-gutter-resizing');
DomHandler.removeClass(elementRef.current, 'p-splitter-resizing');
clear();
};
var onGutterMouseDown = function onGutterMouseDown(event, index) {
onResizeStart(event, index);
bindMouseListeners();
};
var onGutterTouchStart = function onGutterTouchStart(event, index) {
onResizeStart(event, index);
window.addEventListener('touchmove', onGutterTouchMove, {
passive: false,
cancelable: false
});
window.addEventListener('touchend', onGutterTouchEnd);
};
var onGutterTouchMove = function onGutterTouchMove(event) {
onResize(event);
};
var onGutterTouchEnd = function onGutterTouchEnd(event) {
onResizeEnd(event);
window.removeEventListener('touchmove', onGutterTouchMove);
window.removeEventListener('touchend', onGutterTouchEnd);
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
getElement: function getElement() {
return elementRef.current;
}
};
});
React__namespace.useEffect(function () {
var panelElements = _toConsumableArray(elementRef.current.children).filter(function (child) {
return DomHandler.hasClass(child, 'p-splitter-panel');
});
panelElements.map(function (panelElement) {
if (panelElement.childNodes && ObjectUtils.isNotEmpty(DomHandler.find(panelElement, '.p-splitter'))) {
DomHandler.addClass(panelElement, 'p-splitter-panel-nested');
}
});
}, []);
React__namespace.useEffect(function () {
if (isStateful) restoreState();
}, [restoreState, isStateful]);
var createPanel = function createPanel(panel, index) {
var otherProps = SplitterPanelBase.getCOtherProps(panel);
var panelClassName = classNames('p-splitter-panel', getPanelProp(panel, 'className'));
var gutterStyle = props.layout === 'horizontal' ? {
width: props.gutterSize + 'px'
} : {
height: props.gutterSize + 'px'
};
var gutter = index !== props.children.length - 1 && /*#__PURE__*/React__namespace.createElement("div", {
ref: function ref(el) {
return gutterRefs.current[index] = el;
},
className: "p-splitter-gutter",
style: gutterStyle,
onMouseDown: function onMouseDown(event) {
return onGutterMouseDown(event, index);
},
onTouchStart: function onTouchStart(event) {
return onGutterTouchStart(event, index);
},
onTouchMove: function onTouchMove(event) {
return onGutterTouchMove(event);
},
onTouchEnd: function onTouchEnd(event) {
return onGutterTouchEnd(event);
}
}, /*#__PURE__*/React__namespace.createElement("div", {
className: "p-splitter-gutter-handle"
}));
var flexBasis = 'calc(' + panelSize(panelSizes, index) + '% - ' + (childrenLength - 1) * props.gutterSize + 'px)';
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement("div", _extends({
key: index,
className: panelClassName,
style: _objectSpread$7(_objectSpread$7({}, getPanelProp(panel, 'style')), {}, {
flexBasis: flexBasis
})
}, otherProps), getPanelProp(panel, 'children')), gutter);
};
var createPanels = function createPanels() {
return React__namespace.Children.map(props.children, createPanel);
};
var otherProps = SplitterBase.getOtherProps(props);
var className = classNames("p-splitter p-component p-splitter-".concat(props.layout), props.className);
var panels = createPanels();
return /*#__PURE__*/React__namespace.createElement("div", _extends({
ref: elementRef,
id: props.id,
className: className,
style: props.style
}, otherProps), panels);
}));
SplitterPanel.displayName = 'SplitterPanel';
Splitter.displayName = 'Splitter';
var StepsBase = {
defaultProps: {
__TYPE: 'Steps',
id: null,
model: null,
activeIndex: 0,
readOnly: true,
style: null,
className: null,
onSelect: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, StepsBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, StepsBase.defaultProps);
}
};
var Steps = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = StepsBase.getProps(inProps);
var elementRef = React__namespace.useRef(null);
var itemClick = function itemClick(event, item, index) {
if (props.readOnly || item.disabled) {
event.preventDefault();
return;
}
if (props.onSelect) {
props.onSelect({
originalEvent: event,
item: item,
index: index
});
}
if (!item.url) {
event.preventDefault();
}
if (item.command) {
item.command({
originalEvent: event,
item: item,
index: index
});
}
};
var createItem = function createItem(item, index) {
if (item.visible === false) {
return null;
}
var key = item.label + '_' + index;
var active = index === props.activeIndex;
var disabled = item.disabled || index !== props.activeIndex && props.readOnly;
var tabIndex = disabled ? -1 : '';
var className = classNames('p-steps-item', item.className, {
'p-highlight p-steps-current': active,
'p-disabled': disabled
});
var iconClassName = classNames('p-menuitem-icon', item.icon);
var icon = IconUtils.getJSXIcon(item.icon, {
className: 'p-menuitem-icon'
}, {
props: props
});
var label = item.label && /*#__PURE__*/React__namespace.createElement("span", {
className: "p-steps-title"
}, item.label);
var content = /*#__PURE__*/React__namespace.createElement("a", {
href: item.url || '#',
className: "p-menuitem-link",
role: "presentation",
target: item.target,
onClick: function onClick(event) {
return itemClick(event, item, index);
},
tabIndex: tabIndex
}, /*#__PURE__*/React__namespace.createElement("span", {
className: "p-steps-number"
}, index + 1), icon, label);
if (item.template) {
var defaultContentOptions = {
onClick: function onClick(event) {
return itemClick(event, item, index);
},
className: 'p-menuitem-link',
labelClassName: 'p-steps-title',
numberClassName: 'p-steps-number',
iconClassName: iconClassName,
element: content,
props: props,
tabIndex: tabIndex,
active: active,
disabled: disabled
};
content = ObjectUtils.getJSXElement(item.template, item, defaultContentOptions);
}
return /*#__PURE__*/React__namespace.createElement("li", {
key: key,
id: item.id,
className: className,
style: item.style,
role: "tab",
"aria-selected": active,
"aria-expanded": active
}, content);
};
var createItems = function createItems() {
if (props.model) {
var _items = props.model.map(createItem);
return /*#__PURE__*/React__namespace.createElement("ul", {
role: "tablist"
}, _items);
}
return null;
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
getElement: function getElement() {
return elementRef.current;
}
};
});
var otherProps = StepsBase.getOtherProps(props);
var className = classNames('p-steps p-component', {
'p-readonly': props.readOnly
}, props.className);
var items = createItems();
return /*#__PURE__*/React__namespace.createElement("div", _extends({
id: props.id,
ref: elementRef,
className: className,
style: props.style
}, otherProps), items);
}));
Steps.displayName = 'Steps';
var StyleClassBase = {
defaultProps: {
__TYPE: 'StyleClass',
nodeRef: null,
selector: null,
enterClassName: null,
enterActiveClassName: null,
enterToClassName: null,
leaveClassName: null,
leaveActiveClassName: null,
leaveToClassName: null,
hideOnOutsideClick: false,
toggleClassName: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, StyleClassBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, StyleClassBase.defaultProps);
}
};
var StyleClass = /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = StyleClassBase.getProps(inProps);
var targetRef = React__namespace.useRef(null);
var animating = React__namespace.useRef(false);
var elementRef = React__namespace.useRef(null);
var _useEventListener = useEventListener({
type: 'animationend',
listener: function listener() {
DomHandler.removeClass(targetRef.current, props.enterActiveClassName);
if (props.enterToClassName) {
DomHandler.addClass(targetRef.current, props.enterToClassName);
}
unbindTargetEnterListener();
if (props.enterActiveClassName === 'slidedown') {
targetRef.current.style.maxHeight = '';
}
animating.current = false;
}
}),
_useEventListener2 = _slicedToArray(_useEventListener, 2),
bindTargetEnterListener = _useEventListener2[0],
unbindTargetEnterListener = _useEventListener2[1];
var _useEventListener3 = useEventListener({
type: 'animationend',
listener: function listener() {
DomHandler.removeClass(targetRef.current, props.leaveActiveClassName);
if (props.leaveToClassName) {
DomHandler.addClass(targetRef.current, props.leaveToClassName);
}
unbindTargetLeaveListener();
animating.current = false;
}
}),
_useEventListener4 = _slicedToArray(_useEventListener3, 2),
bindTargetLeaveListener = _useEventListener4[0],
unbindTargetLeaveListener = _useEventListener4[1];
var _useEventListener5 = useEventListener({
type: 'click',
listener: function listener(event) {
if (!isVisible(targetRef.current) || getComputedStyle(targetRef.current).getPropertyValue('position') === 'static') {
unbindDocumentClickListener();
} else if (isOutsideClick(event)) {
leave();
}
},
when: props.hideOnOutsideClick
}),
_useEventListener6 = _slicedToArray(_useEventListener5, 2),
bindDocumentClickListener = _useEventListener6[0],
unbindDocumentClickListener = _useEventListener6[1];
var _useEventListener7 = useEventListener({
type: 'click',
listener: function listener() {
targetRef.current = resolveTarget();
if (props.toggleClassName) {
if (DomHandler.hasClass(targetRef.current, props.toggleClassName)) DomHandler.removeClass(targetRef.current, props.toggleClassName);else DomHandler.addClass(targetRef.current, props.toggleClassName);
} else {
DomHandler.isVisible(targetRef.current) ? leave() : enter();
}
}
}),
_useEventListener8 = _slicedToArray(_useEventListener7, 2),
bindClickListener = _useEventListener8[0],
unbindClickListener = _useEventListener8[1];
var enter = function enter() {
if (props.enterActiveClassName) {
if (!animating.current) {
animating.current = true;
if (props.enterActiveClassName === 'slidedown') {
targetRef.current.style.height = '0px';
DomHandler.removeClass(targetRef.current, 'hidden');
targetRef.current.style.maxHeight = targetRef.current.scrollHeight + 'px';
DomHandler.addClass(targetRef.current, 'hidden');
targetRef.current.style.height = '';
}
DomHandler.addClass(targetRef.current, props.enterActiveClassName);
if (props.enterClassName) {
DomHandler.removeClass(targetRef.current, props.enterClassName);
}
bindTargetEnterListener({
target: targetRef.current
});
}
} else {
if (props.enterClassName) {
DomHandler.removeClass(targetRef.current, props.enterClassName);
}
if (props.enterToClassName) {
DomHandler.addClass(targetRef.current, props.enterToClassName);
}
}
bindDocumentClickListener({
target: elementRef.current && elementRef.current.ownerDocument
});
};
var leave = function leave() {
if (props.leaveActiveClassName) {
if (!animating.current) {
animating.current = true;
DomHandler.addClass(targetRef.current, props.leaveActiveClassName);
if (props.leaveClassName) {
DomHandler.removeClass(targetRef.current, props.leaveClassName);
}
bindTargetLeaveListener({
target: targetRef.current
});
}
} else {
if (props.leaveClassName) {
DomHandler.removeClass(targetRef.current, props.leaveClassName);
}
if (props.leaveToClassName) {
DomHandler.addClass(targetRef.current, props.leaveToClassName);
}
}
if (props.hideOnOutsideClick) {
unbindDocumentClickListener();
}
};
var resolveTarget = function resolveTarget() {
if (targetRef.current) {
return targetRef.current;
}
switch (props.selector) {
case '@next':
return elementRef.current.nextElementSibling;
case '@prev':
return elementRef.current.previousElementSibling;
case '@parent':
return elementRef.current.parentElement;
case '@grandparent':
return elementRef.current.parentElement.parentElement;
default:
return document.querySelector(props.selector);
}
};
var init = function init() {
elementRef.current = ObjectUtils.getRefElement(props.nodeRef);
bindClickListener({
target: elementRef.current
});
};
var destroy = function destroy() {
unbindClickListener();
unbindDocumentClickListener();
targetRef.current = null;
};
var isVisible = function isVisible(target) {
return target.offsetParent !== null;
};
var isOutsideClick = function isOutsideClick(event) {
return !elementRef.current.isSameNode(event.target) && !elementRef.current.contains(event.target) && !targetRef.current.contains(event.target);
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
getElement: function getElement() {
return elementRef.current;
},
getTarget: function getTarget() {
return targetRef.current;
}
};
});
useMountEffect(function () {
init();
});
useUpdateEffect(function () {
init();
return function () {
unbindClickListener();
};
});
useUnmountEffect(function () {
destroy();
});
return props.children;
});
StyleClass.displayName = 'StyleClass';
var TabMenuBase = {
defaultProps: {
__TYPE: 'TabMenu',
id: null,
model: null,
activeIndex: 0,
style: null,
className: null,
onTabChange: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, TabMenuBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, TabMenuBase.defaultProps);
}
};
var TabMenu = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = TabMenuBase.getProps(inProps);
var _React$useState = React__namespace.useState(props.activeIndex),
_React$useState2 = _slicedToArray(_React$useState, 2),
activeIndexState = _React$useState2[0],
setActiveIndexState = _React$useState2[1];
var elementRef = React__namespace.useRef(null);
var inkbarRef = React__namespace.useRef(null);
var navRef = React__namespace.useRef(null);
var tabsRef = React__namespace.useRef({});
var activeIndex = props.onTabChange ? props.activeIndex : activeIndexState;
var itemClick = 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 (props.onTabChange) {
props.onTabChange({
originalEvent: event,
value: item,
index: index
});
} else {
setActiveIndexState(index);
}
};
var isSelected = function isSelected(index) {
return index === (activeIndex || 0);
};
var updateInkBar = function updateInkBar() {
if (props.model) {
var tabHeader = tabsRef.current["tab_".concat(activeIndex)];
inkbarRef.current.style.width = DomHandler.getWidth(tabHeader) + 'px';
inkbarRef.current.style.left = DomHandler.getOffset(tabHeader).left - DomHandler.getOffset(navRef.current).left + 'px';
}
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
getElement: function getElement() {
return elementRef.current;
}
};
});
React__namespace.useEffect(function () {
updateInkBar();
});
var createMenuItem = function createMenuItem(item, index) {
if (item.visible === false) {
return null;
}
var _className = item.className,
style = item.style,
disabled = item.disabled,
_icon = item.icon,
_label = item.label,
template = item.template,
url = item.url,
target = item.target;
var key = _label + '_' + index;
var active = isSelected(index);
var className = classNames('p-tabmenuitem', {
'p-highlight': active,
'p-disabled': disabled
}, _className);
var iconClassName = classNames('p-menuitem-icon', _icon);
var icon = IconUtils.getJSXIcon(_icon, {
className: 'p-menuitem-icon'
}, {
props: props
});
var label = _label && /*#__PURE__*/React__namespace.createElement("span", {
className: "p-menuitem-text"
}, _label);
var content = /*#__PURE__*/React__namespace.createElement("a", {
href: url || '#',
className: "p-menuitem-link",
target: target,
onClick: function onClick(event) {
return itemClick(event, item, index);
},
role: "presentation"
}, icon, label, /*#__PURE__*/React__namespace.createElement(Ripple, null));
if (template) {
var defaultContentOptions = {
onClick: function onClick(event) {
return itemClick(event, item, index);
},
className: 'p-menuitem-link',
labelClassName: 'p-menuitem-text',
iconClassName: iconClassName,
element: content,
props: props,
active: active,
index: index,
disabled: disabled
};
content = ObjectUtils.getJSXElement(template, item, defaultContentOptions);
}
return /*#__PURE__*/React__namespace.createElement("li", {
ref: tabsRef.current["tab_".concat(index)],
key: key,
className: className,
style: style,
role: "tab",
"aria-selected": active,
"aria-expanded": active,
"aria-disabled": disabled
}, content);
};
var createItems = function createItems() {
return props.model.map(createMenuItem);
};
if (props.model) {
var otherProps = TabMenuBase.getOtherProps(props);
var className = classNames('p-tabmenu p-component', props.className);
var items = createItems();
return /*#__PURE__*/React__namespace.createElement("div", _extends({
id: props.id,
ref: elementRef,
className: className,
style: props.style
}, otherProps), /*#__PURE__*/React__namespace.createElement("ul", {
ref: navRef,
className: "p-tabmenu-nav p-reset",
role: "tablist"
}, items, /*#__PURE__*/React__namespace.createElement("li", {
ref: inkbarRef,
className: "p-tabmenu-ink-bar"
})));
}
return null;
}));
TabMenu.displayName = 'TabMenu';
var TabViewBase = {
defaultProps: {
__TYPE: 'TabView',
id: null,
activeIndex: 0,
className: null,
onBeforeTabChange: null,
onBeforeTabClose: null,
onTabChange: null,
onTabClose: null,
panelContainerClassName: null,
panelContainerStyle: null,
renderActiveOnly: true,
scrollable: false,
style: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, TabViewBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, TabViewBase.defaultProps);
}
};
var TabPanelBase = {
defaultProps: {
__TYPE: 'TabPanel',
className: null,
closable: false,
contentClassName: null,
contentStyle: null,
disabled: false,
header: null,
headerClassName: null,
headerStyle: null,
headerTemplate: null,
leftIcon: null,
rightIcon: null,
style: null,
children: undefined
},
getCProp: function getCProp(tab, name) {
return ObjectUtils.getComponentProp(tab, name, TabPanelBase.defaultProps);
},
getCProps: function getCProps(tab) {
return ObjectUtils.getComponentProps(tab, TabPanelBase.defaultProps);
},
getCOtherProps: function getCOtherProps(tab) {
return ObjectUtils.getComponentDiffProps(tab, TabPanelBase.defaultProps);
}
};
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; }
var TabPanel = function TabPanel() {};
var TabView = /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = TabViewBase.getProps(inProps);
var _React$useState = React__namespace.useState(props.id),
_React$useState2 = _slicedToArray(_React$useState, 2),
idState = _React$useState2[0],
setIdState = _React$useState2[1];
var _React$useState3 = React__namespace.useState(true),
_React$useState4 = _slicedToArray(_React$useState3, 2),
backwardIsDisabledState = _React$useState4[0],
setBackwardIsDisabledState = _React$useState4[1];
var _React$useState5 = React__namespace.useState(false),
_React$useState6 = _slicedToArray(_React$useState5, 2),
forwardIsDisabledState = _React$useState6[0],
setForwardIsDisabledState = _React$useState6[1];
var _React$useState7 = React__namespace.useState([]),
_React$useState8 = _slicedToArray(_React$useState7, 2),
hiddenTabsState = _React$useState8[0],
setHiddenTabsState = _React$useState8[1];
var _React$useState9 = React__namespace.useState(props.activeIndex),
_React$useState10 = _slicedToArray(_React$useState9, 2),
activeIndexState = _React$useState10[0],
setActiveIndexState = _React$useState10[1];
var elementRef = React__namespace.useRef(null);
var contentRef = React__namespace.useRef(null);
var navRef = React__namespace.useRef(null);
var inkbarRef = React__namespace.useRef(null);
var prevBtnRef = React__namespace.useRef(null);
var nextBtnRef = React__namespace.useRef(null);
var tabsRef = React__namespace.useRef({});
var activeIndex = props.onTabChange ? props.activeIndex : activeIndexState;
var isSelected = function isSelected(index) {
return index === activeIndex;
};
var getTabProp = function getTabProp(tab, name) {
return TabPanelBase.getCProp(tab, name);
};
var shouldUseTab = function shouldUseTab(tab, index) {
return ObjectUtils.isValidChild(tab, 'TabPanel') && hiddenTabsState.every(function (_i) {
return _i !== index;
});
};
var findVisibleActiveTab = function findVisibleActiveTab(i) {
var tabsInfo = React__namespace.Children.map(props.children, function (tab, index) {
if (shouldUseTab(tab, index)) {
return {
tab: tab,
index: index
};
}
});
return tabsInfo.find(function (_ref) {
var tab = _ref.tab,
index = _ref.index;
return !getTabProp(tab, 'disabled') && index >= i;
}) || tabsInfo.reverse().find(function (_ref2) {
var tab = _ref2.tab,
index = _ref2.index;
return !getTabProp(tab, 'disabled') && i > index;
});
};
var onTabHeaderClose = function onTabHeaderClose(event, index) {
event.preventDefault();
// give caller a chance to stop the selection
if (props.onBeforeTabClose && props.onBeforeTabClose({
originalEvent: event,
index: index
}) === false) {
return;
}
setHiddenTabsState([].concat(_toConsumableArray(hiddenTabsState), [index]));
if (props.onTabClose) {
props.onTabClose({
originalEvent: event,
index: index
});
}
};
var onTabHeaderClick = function onTabHeaderClick(event, tab, index) {
if (event) {
event.preventDefault();
}
if (!getTabProp(tab, 'disabled')) {
// give caller a chance to stop the selection
if (props.onBeforeTabChange && props.onBeforeTabChange({
originalEvent: event,
index: index
}) === false) {
return;
}
if (props.onTabChange) props.onTabChange({
originalEvent: event,
index: index
});else setActiveIndexState(index);
}
updateScrollBar(index);
};
var _onKeyDown = function onKeyDown(event, tab, index) {
if (event.key === 'Enter') {
onTabHeaderClick(event, tab, index);
}
};
var updateInkBar = function updateInkBar() {
var tabHeader = tabsRef.current["tab_".concat(activeIndex)];
inkbarRef.current.style.width = DomHandler.getWidth(tabHeader) + 'px';
inkbarRef.current.style.left = DomHandler.getOffset(tabHeader).left - DomHandler.getOffset(navRef.current).left + 'px';
};
var updateScrollBar = function updateScrollBar(index) {
var tabHeader = tabsRef.current["tab_".concat(index)];
if (tabHeader && tabHeader.scrollIntoView) {
tabHeader.scrollIntoView({
block: 'nearest'
});
}
};
var updateButtonState = function updateButtonState() {
var _contentRef$current = contentRef.current,
scrollLeft = _contentRef$current.scrollLeft,
scrollWidth = _contentRef$current.scrollWidth;
var width = DomHandler.getWidth(contentRef.current);
setBackwardIsDisabledState(scrollLeft === 0);
setForwardIsDisabledState(scrollLeft === scrollWidth - width);
};
var onScroll = function onScroll(event) {
props.scrollable && updateButtonState();
event.preventDefault();
};
var getVisibleButtonWidths = function getVisibleButtonWidths() {
return [prevBtnRef.current, nextBtnRef.current].reduce(function (acc, el) {
return el ? acc + DomHandler.getWidth(el) : acc;
}, 0);
};
var navBackward = function navBackward() {
var width = DomHandler.getWidth(contentRef.current) - getVisibleButtonWidths();
var pos = contentRef.current.scrollLeft - width;
contentRef.current.scrollLeft = pos <= 0 ? 0 : pos;
};
var navForward = function navForward() {
var width = DomHandler.getWidth(contentRef.current) - getVisibleButtonWidths();
var pos = contentRef.current.scrollLeft + width;
var lastPos = contentRef.current.scrollWidth - width;
contentRef.current.scrollLeft = pos >= lastPos ? lastPos : pos;
};
var reset = function reset() {
setBackwardIsDisabledState(true);
setForwardIsDisabledState(false);
setHiddenTabsState([]);
if (props.onTabChange) props.onTabChange({
index: activeIndex
});else setActiveIndexState(props.activeIndex);
};
React__namespace.useEffect(function () {
updateInkBar();
});
useMountEffect(function () {
if (!idState) {
setIdState(UniqueComponentId());
}
});
useUpdateEffect(function () {
if (ObjectUtils.isNotEmpty(hiddenTabsState)) {
var tabInfo = findVisibleActiveTab(hiddenTabsState[hiddenTabsState.length - 1]);
tabInfo && onTabHeaderClick(null, tabInfo.tab, tabInfo.index);
}
}, [hiddenTabsState]);
useUpdateEffect(function () {
updateScrollBar(props.activeIndex);
}, [props.activeIndex]);
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
reset: reset,
getElement: function getElement() {
return elementRef.current;
}
};
});
var createTabHeader = function createTabHeader(tab, index) {
var selected = isSelected(index);
var _TabPanelBase$getCPro = TabPanelBase.getCProps(tab),
headerStyle = _TabPanelBase$getCPro.headerStyle,
headerClassName = _TabPanelBase$getCPro.headerClassName,
_style = _TabPanelBase$getCPro.style,
_className = _TabPanelBase$getCPro.className,
disabled = _TabPanelBase$getCPro.disabled,
leftIcon = _TabPanelBase$getCPro.leftIcon,
rightIcon = _TabPanelBase$getCPro.rightIcon,
header = _TabPanelBase$getCPro.header,
headerTemplate = _TabPanelBase$getCPro.headerTemplate,
closable = _TabPanelBase$getCPro.closable;
var style = _objectSpread$6(_objectSpread$6({}, headerStyle || {}), _style || {});
var className = classNames('p-unselectable-text', {
'p-tabview-selected p-highlight': selected,
'p-disabled': disabled
}, headerClassName, _className);
var headerId = idState + '_header_' + index;
var ariaControls = idState + '_content_' + index;
var tabIndex = disabled ? null : 0;
var leftIconElement = leftIcon && /*#__PURE__*/React__namespace.createElement("i", {
className: leftIcon
});
var titleElement = /*#__PURE__*/React__namespace.createElement("span", {
className: "p-tabview-title"
}, header);
var rightIconElement = rightIcon && /*#__PURE__*/React__namespace.createElement("i", {
className: rightIcon
});
var closableIconElement = closable && /*#__PURE__*/React__namespace.createElement("i", {
className: "p-tabview-close pi pi-times",
onClick: function onClick(e) {
return onTabHeaderClose(e, index);
}
});
var content =
/*#__PURE__*/
// eslint-disable /
React__namespace.createElement("a", {
role: "tab",
className: "p-tabview-nav-link",
onClick: function onClick(e) {
return onTabHeaderClick(e, tab, index);
},
id: headerId,
onKeyDown: function onKeyDown(e) {
return _onKeyDown(e, tab, index);
},
"aria-controls": ariaControls,
"aria-selected": selected,
tabIndex: tabIndex
}, leftIconElement, titleElement, rightIconElement, closableIconElement, /*#__PURE__*/React__namespace.createElement(Ripple, null))
// eslint-enable /
;
if (headerTemplate) {
var defaultContentOptions = {
className: 'p-tabview-nav-link',
titleClassName: 'p-tabview-title',
onClick: function onClick(e) {
return onTabHeaderClick(e, tab, index);
},
onKeyDown: function onKeyDown(e) {
return _onKeyDown(e, tab, index);
},
leftIconElement: leftIconElement,
titleElement: titleElement,
rightIconElement: rightIconElement,
element: content,
props: props,
index: index,
selected: selected,
ariaControls: ariaControls
};
content = ObjectUtils.getJSXElement(headerTemplate, defaultContentOptions);
}
return /*#__PURE__*/React__namespace.createElement("li", {
ref: function ref(el) {
return tabsRef.current["tab_".concat(index)] = el;
},
className: className,
style: style,
role: "presentation"
}, content);
};
var createTabHeaders = function createTabHeaders() {
return React__namespace.Children.map(props.children, function (tab, index) {
if (shouldUseTab(tab, index)) {
return createTabHeader(tab, index);
}
});
};
var createNavigator = function createNavigator() {
var headers = createTabHeaders();
return /*#__PURE__*/React__namespace.createElement("div", {
ref: contentRef,
id: idState,
className: "p-tabview-nav-content",
style: props.style,
onScroll: onScroll
}, /*#__PURE__*/React__namespace.createElement("ul", {
ref: navRef,
className: "p-tabview-nav",
role: "tablist"
}, headers, /*#__PURE__*/React__namespace.createElement("li", {
ref: inkbarRef,
className: "p-tabview-ink-bar"
})));
};
var createContent = function createContent() {
var className = classNames('p-tabview-panels', props.panelContainerClassName);
var contents = React__namespace.Children.map(props.children, function (tab, index) {
if (shouldUseTab(tab, index) && (!props.renderActiveOnly || isSelected(index))) {
var selected = isSelected(index);
var style = _objectSpread$6(_objectSpread$6({}, getTabProp(tab, 'contentStyle') || {}), getTabProp(tab, 'style') || {});
var _className2 = classNames(getTabProp(tab, 'contentClassName'), getTabProp(tab, 'className'), 'p-tabview-panel', {
'p-hidden': !selected
});
var contentId = idState + '_content_' + index;
var ariaLabelledBy = idState + '_header_' + index;
var _otherProps = TabPanelBase.getCOtherProps(tab);
return /*#__PURE__*/React__namespace.createElement("div", _extends({}, _otherProps, {
id: contentId,
"aria-labelledby": ariaLabelledBy,
"aria-hidden": !selected,
className: _className2,
style: style,
role: "tabpanel"
}), !props.renderActiveOnly ? getTabProp(tab, 'children') : selected && getTabProp(tab, 'children'));
}
});
return /*#__PURE__*/React__namespace.createElement("div", {
className: className,
style: props.panelContainerStyle
}, contents);
};
var createPrevButton = function createPrevButton() {
if (props.scrollable && !backwardIsDisabledState) {
return /*#__PURE__*/React__namespace.createElement("button", {
ref: prevBtnRef,
className: "p-tabview-nav-prev p-tabview-nav-btn p-link",
onClick: navBackward,
type: "button",
"aria-label": ariaLabel('previousPageLabel')
}, /*#__PURE__*/React__namespace.createElement("span", {
className: "pi pi-chevron-left"
}), /*#__PURE__*/React__namespace.createElement(Ripple, null));
}
return null;
};
var createNextButton = function createNextButton() {
if (props.scrollable && !forwardIsDisabledState) {
return /*#__PURE__*/React__namespace.createElement("button", {
ref: nextBtnRef,
className: "p-tabview-nav-next p-tabview-nav-btn p-link",
onClick: navForward,
type: "button",
"aria-label": ariaLabel('nextPageLabel')
}, /*#__PURE__*/React__namespace.createElement("span", {
className: "pi pi-chevron-right",
"aria-hidden": "true"
}), /*#__PURE__*/React__namespace.createElement(Ripple, null));
}
};
var otherProps = TabViewBase.getOtherProps(props);
var className = classNames('p-tabview p-component', {
'p-tabview-scrollable': props.scrollable
}, props.className);
var navigator = createNavigator();
var content = createContent();
var prevButton = createPrevButton();
var nextButton = createNextButton();
return /*#__PURE__*/React__namespace.createElement("div", _extends({
ref: elementRef,
className: className
}, otherProps), /*#__PURE__*/React__namespace.createElement("div", {
className: "p-tabview-nav-container"
}, prevButton, navigator, nextButton), content);
});
TabPanel.displayName = 'TabPanel';
TabView.displayName = 'TabView';
var TagBase = {
defaultProps: {
__TYPE: 'Tag',
value: null,
severity: null,
rounded: false,
icon: null,
style: null,
className: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, TagBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, TagBase.defaultProps);
}
};
var Tag = /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var _classNames;
var props = TagBase.getProps(inProps);
var elementRef = React__namespace.useRef(null);
var otherProps = TagBase.getOtherProps(props);
var className = classNames('p-tag p-component', (_classNames = {}, _defineProperty(_classNames, "p-tag-".concat(props.severity), props.severity !== null), _defineProperty(_classNames, 'p-tag-rounded', props.rounded), _classNames), props.className);
var icon = IconUtils.getJSXIcon(props.icon, {
className: 'p-tag-icon'
}, {
props: props
});
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
getElement: function getElement() {
return elementRef.current;
}
};
});
return /*#__PURE__*/React__namespace.createElement("span", _extends({
ref: elementRef,
className: className,
style: props.style
}, otherProps), icon, /*#__PURE__*/React__namespace.createElement("span", {
className: "p-tag-value"
}, props.value), /*#__PURE__*/React__namespace.createElement("span", null, props.children));
});
Tag.displayName = 'Tag';
var TerminalService = EventBus();
var TerminalBase = {
defaultProps: {
__TYPE: 'Terminal',
id: null,
style: null,
className: null,
welcomeMessage: null,
prompt: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, TerminalBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, TerminalBase.defaultProps);
}
};
var Terminal = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = TerminalBase.getProps(inProps);
var _React$useState = React__namespace.useState(''),
_React$useState2 = _slicedToArray(_React$useState, 2),
commandTextState = _React$useState2[0],
setCommandTextState = _React$useState2[1];
var _React$useState3 = React__namespace.useState([]),
_React$useState4 = _slicedToArray(_React$useState3, 2),
commandsState = _React$useState4[0],
setCommandsState = _React$useState4[1];
var _React$useState5 = React__namespace.useState(0),
_React$useState6 = _slicedToArray(_React$useState5, 2),
indexState = _React$useState6[0],
setIndexState = _React$useState6[1];
var _React$useState7 = React__namespace.useState(''),
_React$useState8 = _slicedToArray(_React$useState7, 2),
emittedTextState = _React$useState8[0],
setEmittedTextState = _React$useState8[1];
var elementRef = React__namespace.useRef(null);
var inputRef = React__namespace.useRef(null);
var isEmitted = React__namespace.useRef(false);
var onClick = function onClick() {
DomHandler.focus(inputRef.current);
};
var onInputChange = function onInputChange(e) {
setCommandTextState(e.target.value);
};
var onInputKeyDown = function onInputKeyDown(e) {
var code = e.which || e.keyCode;
switch (code) {
//up
case 38:
if (commandsState && commandsState.length) {
var prevIndex = indexState - 1 < 0 ? commandsState.length - 1 : indexState - 1;
var command = commandsState[prevIndex];
setIndexState(prevIndex);
setCommandTextState(command.text);
}
break;
//enter
case 13:
if (!!commandTextState) {
var newCommands = _toConsumableArray(commandsState);
newCommands.push({
text: commandTextState
});
setIndexState(function (prevIndex) {
return prevIndex + 1;
});
setCommandTextState('');
setCommandsState(newCommands);
setEmittedTextState(commandTextState);
isEmitted.current = true;
}
break;
}
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
focus: function focus() {
return DomHandler.focus(inputRef.current);
},
getElement: function getElement() {
return elementRef.current;
}
};
});
React__namespace.useEffect(function () {
var response = function response(res) {
if (commandsState && commandsState.length > 0) {
var commands = _toConsumableArray(commandsState);
commands[commands.length - 1].response = res;
setCommandsState(commands);
}
};
var clear = function clear() {
setCommandsState([]);
setIndexState(0);
};
TerminalService.on('response', response);
TerminalService.on('clear', clear);
return function () {
TerminalService.off('response', response);
TerminalService.off('clear', clear);
};
}, [commandsState]);
React__namespace.useEffect(function () {
if (isEmitted.current) {
TerminalService.emit('command', emittedTextState);
isEmitted.current = false;
}
elementRef.current.scrollTop = elementRef.current.scrollHeight;
});
var createWelcomeMessage = function createWelcomeMessage() {
if (props.welcomeMessage) {
return /*#__PURE__*/React__namespace.createElement("div", null, props.welcomeMessage);
}
return null;
};
var createCommand = function createCommand(command, index) {
var text = command.text,
response = command.response;
var key = text + '_' + index;
return /*#__PURE__*/React__namespace.createElement("div", {
key: key
}, /*#__PURE__*/React__namespace.createElement("span", {
className: "p-terminal-prompt"
}, props.prompt, "\xA0"), /*#__PURE__*/React__namespace.createElement("span", {
className: "p-terminal-command"
}, text), /*#__PURE__*/React__namespace.createElement("div", {
className: "p-terminal-response"
}, response));
};
var createContent = function createContent() {
var content = commandsState.map(createCommand);
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-terminal-content"
}, content);
};
var createPromptContainer = function createPromptContainer() {
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-terminal-prompt-container"
}, /*#__PURE__*/React__namespace.createElement("span", {
className: "p-terminal-prompt"
}, props.prompt, "\xA0"), /*#__PURE__*/React__namespace.createElement("input", {
ref: inputRef,
type: "text",
value: commandTextState,
className: "p-terminal-input",
autoComplete: "off",
onChange: onInputChange,
onKeyDown: onInputKeyDown
}));
};
var otherProps = TerminalBase.getOtherProps(props);
var className = classNames('p-terminal p-component', props.className);
var welcomeMessage = createWelcomeMessage();
var content = createContent();
var prompt = createPromptContainer();
return /*#__PURE__*/React__namespace.createElement("div", _extends({
ref: elementRef,
id: props.id,
className: className,
style: props.style
}, otherProps, {
onClick: onClick
}), welcomeMessage, content, prompt);
}));
Terminal.displayName = 'Terminal';
var TieredMenuBase = {
defaultProps: {
__TYPE: 'TieredMenu',
id: null,
model: null,
popup: false,
style: null,
className: null,
autoZIndex: true,
baseZIndex: 0,
breakpoint: undefined,
scrollHeight: '400px',
appendTo: null,
transitionOptions: null,
onShow: null,
onHide: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, TieredMenuBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, TieredMenuBase.defaultProps);
}
};
var TieredMenuSub = /*#__PURE__*/React__namespace.memo(function (props) {
var _React$useState = React__namespace.useState(null),
_React$useState2 = _slicedToArray(_React$useState, 2),
activeItemState = _React$useState2[0],
setActiveItemState = _React$useState2[1];
var elementRef = React__namespace.useRef(null);
var _useEventListener = useEventListener({
type: 'click',
listener: function listener(event) {
if (!props.isMobileMode && elementRef.current && !elementRef.current.contains(event.target)) {
setActiveItemState(null);
}
}
}),
_useEventListener2 = _slicedToArray(_useEventListener, 1),
bindDocumentClickListener = _useEventListener2[0];
var _useResizeListener = useResizeListener({
listener: function listener() {
!props.isMobileMode && setActiveItemState(null);
}
}),
_useResizeListener2 = _slicedToArray(_useResizeListener, 1),
bindDocumentResizeListener = _useResizeListener2[0];
var position = function position() {
if (elementRef.current) {
var parentItem = elementRef.current.parentElement;
var containerOffset = DomHandler.getOffset(parentItem);
var viewport = DomHandler.getViewport();
var sublistWidth = elementRef.current.offsetParent ? elementRef.current.offsetWidth : DomHandler.getHiddenElementOuterWidth(elementRef.current);
var itemOuterWidth = DomHandler.getOuterWidth(parentItem.children[0]);
var top = parseInt(containerOffset.top, 10) + elementRef.current.offsetHeight - DomHandler.getWindowScrollTop();
if (top > viewport.height) {
elementRef.current.style.top = viewport.height - top + 'px';
} else {
elementRef.current.style.top = '0px';
}
if (parseInt(containerOffset.left, 10) + itemOuterWidth + sublistWidth > viewport.width - DomHandler.calculateScrollbarWidth()) {
DomHandler.addClass(elementRef.current, 'p-submenu-list-flipped');
}
}
};
var onItemMouseEnter = function onItemMouseEnter(event, item) {
if (item.disabled || props.isMobileMode) {
event.preventDefault();
return;
}
if (props.root) {
if (activeItemState || props.popup) {
setActiveItemState(item);
}
} else {
setActiveItemState(item);
}
};
var onItemClick = 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 (props.root || props.isMobileMode) {
if (item.items) {
if (activeItemState && item === activeItemState) setActiveItemState(null);else setActiveItemState(item);
}
}
if (!item.items) {
onLeafClick(event);
}
};
var onItemKeyDown = function onItemKeyDown(event, item) {
var listItem = event.currentTarget.parentElement;
switch (event.which) {
//down
case 40:
var nextItem = findNextItem(listItem);
nextItem && nextItem.children[0].focus();
event.preventDefault();
break;
//up
case 38:
var prevItem = findPrevItem(listItem);
prevItem && prevItem.children[0].focus();
event.preventDefault();
break;
//right
case 39:
if (item.items) {
setActiveItemState(item);
setTimeout(function () {
listItem.children[1].children[0].children[0].focus();
}, 50);
}
event.preventDefault();
break;
}
props.onKeyDown && props.onKeyDown(event, listItem);
};
var onChildItemKeyDown = function onChildItemKeyDown(event, childListItem) {
//left
if (event.which === 37) {
setActiveItemState(null);
childListItem.parentElement.previousElementSibling.focus();
}
};
var findNextItem = function findNextItem(item) {
var nextItem = item.nextElementSibling;
return nextItem ? DomHandler.hasClass(nextItem, 'p-disabled') || !DomHandler.hasClass(nextItem, 'p-menuitem') ? findNextItem(nextItem) : nextItem : null;
};
var findPrevItem = function findPrevItem(item) {
var prevItem = item.previousElementSibling;
return prevItem ? DomHandler.hasClass(prevItem, 'p-disabled') || !DomHandler.hasClass(prevItem, 'p-menuitem') ? findPrevItem(prevItem) : prevItem : null;
};
var onLeafClick = function onLeafClick(event) {
if (!props.isMobileMode || props.popup) {
setActiveItemState(null);
props.onLeafClick && props.onLeafClick(event);
props.onHide && props.onHide(event);
}
};
useMountEffect(function () {
bindDocumentClickListener();
bindDocumentResizeListener();
});
useUpdateEffect(function () {
if (!props.parentActive) {
setActiveItemState(null);
}
if (!props.root && props.parentActive && !props.isMobileMode) {
position();
}
}, [props.parentActive]);
useUpdateEffect(function () {
props.onItemToggle && props.onItemToggle();
}, [activeItemState]);
var createSeparator = function createSeparator(index) {
var key = 'separator_' + index;
return /*#__PURE__*/React__namespace.createElement("li", {
key: key,
className: "p-menu-separator",
role: "separator"
});
};
var createSubmenu = function createSubmenu(item) {
if (item.items) {
return /*#__PURE__*/React__namespace.createElement(TieredMenuSub, {
menuProps: props.menuProps,
model: item.items,
onLeafClick: onLeafClick,
popup: props.popup,
onKeyDown: onChildItemKeyDown,
parentActive: item === activeItemState,
isMobileMode: props.isMobileMode,
onItemToggle: props.onItemToggle
});
}
return null;
};
var createMenuItem = function createMenuItem(item, index) {
if (item.visible === false) {
return null;
}
item.id;
var _className = item.className,
style = item.style,
disabled = item.disabled,
_icon = item.icon,
_label = item.label,
items = item.items,
target = item.target,
url = item.url,
template = item.template;
var key = _label + '_' + index;
var active = activeItemState === item;
var className = classNames('p-menuitem', {
'p-menuitem-active': active
}, _className);
var linkClassName = classNames('p-menuitem-link', {
'p-disabled': disabled
});
var iconClassName = classNames('p-menuitem-icon', _icon);
var submenuIconClassName = 'p-submenu-icon pi pi-angle-right';
var icon = IconUtils.getJSXIcon(_icon, {
className: 'p-menuitem-icon'
}, {
props: props.menuProps
});
var label = _label && /*#__PURE__*/React__namespace.createElement("span", {
className: "p-menuitem-text"
}, _label);
var submenuIcon = items && /*#__PURE__*/React__namespace.createElement("span", {
className: submenuIconClassName
});
var submenu = createSubmenu(item);
var content = /*#__PURE__*/React__namespace.createElement("a", {
href: url || '#',
className: linkClassName,
target: target,
role: "menuitem",
"aria-haspopup": items != null,
onClick: function onClick(event) {
return onItemClick(event, item);
},
onKeyDown: function onKeyDown(event) {
return onItemKeyDown(event, item);
},
"aria-disabled": disabled
}, icon, label, submenuIcon, /*#__PURE__*/React__namespace.createElement(Ripple, null));
if (template) {
var defaultContentOptions = {
onClick: function onClick(event) {
return onItemClick(event, item);
},
onKeyDown: function onKeyDown(event) {
return onItemKeyDown(event, item);
},
className: linkClassName,
labelClassName: 'p-menuitem-text',
iconClassName: iconClassName,
submenuIconClassName: submenuIconClassName,
element: content,
props: props,
active: active,
disabled: disabled
};
content = ObjectUtils.getJSXElement(template, item, defaultContentOptions);
}
return /*#__PURE__*/React__namespace.createElement("li", {
key: key,
id: item,
className: className,
style: style,
onMouseEnter: function onMouseEnter(event) {
return onItemMouseEnter(event, item);
},
role: "none"
}, content, submenu);
};
var createItem = function createItem(item, index) {
return item.separator ? createSeparator(index) : createMenuItem(item, index);
};
var createMenu = function createMenu() {
return props.model ? props.model.map(createItem) : null;
};
var className = classNames({
'p-submenu-list': !props.root
});
var submenu = createMenu();
return /*#__PURE__*/React__namespace.createElement("ul", {
ref: elementRef,
className: className,
role: props.root ? 'menubar' : 'menu',
"aria-orientation": "horizontal"
}, submenu);
});
TieredMenuSub.displayName = 'TieredMenuSub';
var TieredMenu = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = TieredMenuBase.getProps(inProps);
var _React$useState = React__namespace.useState(!props.popup),
_React$useState2 = _slicedToArray(_React$useState, 2),
visibleState = _React$useState2[0],
setVisibleState = _React$useState2[1];
var _React$useState3 = React__namespace.useState(null),
_React$useState4 = _slicedToArray(_React$useState3, 2),
attributeSelectorState = _React$useState4[0],
setAttributeSelectorState = _React$useState4[1];
var menuRef = React__namespace.useRef(null);
var targetRef = React__namespace.useRef(null);
var styleElementRef = React__namespace.useRef(null);
var isMobileMode = useMatchMedia("screen and (max-width: ".concat(props.breakpoint, ")"), !!props.breakpoint);
var _useOverlayListener = useOverlayListener({
target: targetRef,
overlay: menuRef,
listener: function listener(event, _ref) {
var valid = _ref.valid;
valid && hide(event);
},
when: visibleState
}),
_useOverlayListener2 = _slicedToArray(_useOverlayListener, 2),
bindOverlayListener = _useOverlayListener2[0],
unbindOverlayListener = _useOverlayListener2[1];
var onPanelClick = function onPanelClick(event) {
if (props.popup) {
OverlayService.emit('overlay-click', {
originalEvent: event,
target: targetRef.current
});
}
};
var toggle = function toggle(event) {
if (props.popup) {
visibleState ? hide(event) : show(event);
}
};
var show = function show(event) {
targetRef.current = event.currentTarget;
setVisibleState(true);
props.onShow && props.onShow(event);
};
var hide = function hide(event) {
if (props.popup) {
targetRef.current = event.currentTarget;
setVisibleState(false);
props.onHide && props.onHide(event);
}
};
var onItemToggle = function onItemToggle() {
if (props.popup && isMobileMode) {
DomHandler.absolutePosition(menuRef.current, targetRef.current);
}
};
var createStyle = function createStyle() {
if (!styleElementRef.current) {
styleElementRef.current = DomHandler.createInlineStyle(PrimeReact.nonce);
var selector = "".concat(attributeSelectorState);
var innerHTML = "\n@media screen and (max-width: ".concat(props.breakpoint, ") {\n .p-tieredmenu[").concat(selector, "] > ul {\n max-height: ").concat(props.scrollHeight, ";\n overflow: ").concat(props.scrollHeight ? 'auto' : '', ";\n }\n\n .p-tieredmenu[").concat(selector, "] .p-submenu-list {\n position: relative;\n }\n\n .p-tieredmenu[").concat(selector, "] .p-menuitem-active > .p-submenu-list {\n left: 0 !important;\n box-shadow: none;\n border-radius: 0;\n padding: 0 0 0 calc(var(--inline-spacing) * 2); /* @todo */\n }\n\n .p-tieredmenu[").concat(selector, "] .p-menuitem-active > .p-menuitem-link > .p-submenu-icon {\n transform: rotate(-180deg);\n }\n\n .p-tieredmenu[").concat(selector, "] .p-submenu-icon:before {\n content: \"\\e930\";\n }\n\n ").concat(!props.popup ? ".p-tieredmenu[".concat(selector, "] { width: 100%; }") : '', "\n}\n");
styleElementRef.current.innerHTML = innerHTML;
}
};
var destroyStyle = function destroyStyle() {
styleElementRef.current = DomHandler.removeInlineStyle(styleElementRef.current);
};
var onEnter = function onEnter() {
if (props.autoZIndex) {
ZIndexUtils.set('menu', menuRef.current, PrimeReact.autoZIndex, props.baseZIndex || PrimeReact.zIndex['menu']);
}
DomHandler.absolutePosition(menuRef.current, targetRef.current);
if (attributeSelectorState && props.breakpoint) {
menuRef.current.setAttribute(attributeSelectorState, '');
createStyle();
}
};
var onEntered = function onEntered() {
bindOverlayListener();
};
var onExit = function onExit() {
targetRef.current = null;
unbindOverlayListener();
};
var onExited = function onExited() {
ZIndexUtils.clear(menuRef.current);
destroyStyle();
};
useMountEffect(function () {
if (props.breakpoint) {
!attributeSelectorState && setAttributeSelectorState(UniqueComponentId());
}
});
useUpdateEffect(function () {
if (attributeSelectorState && menuRef.current) {
menuRef.current.setAttribute(attributeSelectorState, '');
createStyle();
}
return function () {
destroyStyle();
};
}, [attributeSelectorState, props.breakpoint]);
useUnmountEffect(function () {
ZIndexUtils.clear(menuRef.current);
});
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
toggle: toggle,
show: show,
hide: hide,
getElement: function getElement() {
return menuRef.current;
}
};
});
var createElement = function createElement() {
var otherProps = TieredMenuBase.getOtherProps(props);
var className = classNames('p-tieredmenu p-component', {
'p-tieredmenu-overlay': props.popup,
'p-input-filled': PrimeReact.inputStyle === 'filled',
'p-ripple-disabled': PrimeReact.ripple === false
}, props.className);
return /*#__PURE__*/React__namespace.createElement(CSSTransition, {
nodeRef: menuRef,
classNames: "p-connected-overlay",
"in": visibleState,
timeout: {
enter: 120,
exit: 100
},
options: props.transitionOptions,
unmountOnExit: true,
onEnter: onEnter,
onEntered: onEntered,
onExit: onExit,
onExited: onExited
}, /*#__PURE__*/React__namespace.createElement("div", _extends({
ref: menuRef,
id: props.id,
className: className,
style: props.style
}, otherProps, {
onClick: onPanelClick
}), /*#__PURE__*/React__namespace.createElement(TieredMenuSub, {
menuProps: props,
model: props.model,
root: true,
popup: props.popup,
onHide: hide,
isMobileMode: isMobileMode,
onItemToggle: onItemToggle
})));
};
var element = createElement();
return props.popup ? /*#__PURE__*/React__namespace.createElement(Portal, {
element: element,
appendTo: props.appendTo
}) : element;
}));
TieredMenu.displayName = 'TieredMenu';
var TimelineBase = {
defaultProps: {
__TYPE: 'Timeline',
align: 'left',
className: null,
content: null,
dataKey: null,
layout: 'vertical',
marker: null,
opposite: null,
value: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, TimelineBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, TimelineBase.defaultProps);
}
};
var Timeline = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var _classNames;
var props = TimelineBase.getProps(inProps);
var elementRef = React__namespace.useRef(null);
var getKey = function getKey(item, index) {
return props.dataKey ? ObjectUtils.resolveFieldData(item, props.dataKey) : "pr_id__".concat(index);
};
var createEvents = function createEvents() {
return props.value && props.value.map(function (item, index) {
var opposite = ObjectUtils.getJSXElement(props.opposite, item, index);
var marker = ObjectUtils.getJSXElement(props.marker, item, index) || /*#__PURE__*/React__namespace.createElement("div", {
className: "p-timeline-event-marker"
});
var connector = index !== props.value.length - 1 && /*#__PURE__*/React__namespace.createElement("div", {
className: "p-timeline-event-connector"
});
var content = ObjectUtils.getJSXElement(props.content, item, index);
return /*#__PURE__*/React__namespace.createElement("div", {
key: getKey(item, index),
className: "p-timeline-event"
}, /*#__PURE__*/React__namespace.createElement("div", {
className: "p-timeline-event-opposite"
}, opposite), /*#__PURE__*/React__namespace.createElement("div", {
className: "p-timeline-event-separator"
}, marker, connector), /*#__PURE__*/React__namespace.createElement("div", {
className: "p-timeline-event-content"
}, content));
});
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
getElement: function getElement() {
return elementRef.current;
}
};
});
var otherProps = TimelineBase.getOtherProps(props);
var className = classNames('p-timeline p-component', (_classNames = {}, _defineProperty(_classNames, "p-timeline-".concat(props.align), true), _defineProperty(_classNames, "p-timeline-".concat(props.layout), true), _classNames), props.className);
var events = createEvents();
return /*#__PURE__*/React__namespace.createElement("div", _extends({
ref: elementRef,
className: className
}, otherProps), events);
}));
Timeline.displayName = 'Timeline';
var ToastBase = {
defaultProps: {
__TYPE: 'Toast',
id: null,
className: null,
style: null,
baseZIndex: 0,
position: 'top-right',
transitionOptions: null,
appendTo: 'self',
onClick: null,
onRemove: null,
onShow: null,
onHide: null,
onMouseEnter: null,
onMouseLeave: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, ToastBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, ToastBase.defaultProps);
}
};
var ToastMessage = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (props, ref) {
var messageInfo = props.messageInfo;
var _messageInfo$message = messageInfo.message,
severity = _messageInfo$message.severity,
content = _messageInfo$message.content,
summary = _messageInfo$message.summary,
detail = _messageInfo$message.detail,
closable = _messageInfo$message.closable,
life = _messageInfo$message.life,
sticky = _messageInfo$message.sticky,
_className = _messageInfo$message.className,
style = _messageInfo$message.style,
_contentClassName = _messageInfo$message.contentClassName,
contentStyle = _messageInfo$message.contentStyle;
var _React$useState = React__namespace.useState(false),
_React$useState2 = _slicedToArray(_React$useState, 2),
focused = _React$useState2[0],
setFocused = _React$useState2[1];
var _useTimeout = useTimeout(function () {
onClose();
}, life || 3000, !sticky && !focused),
_useTimeout2 = _slicedToArray(_useTimeout, 1),
clearTimer = _useTimeout2[0];
var onClose = function onClose() {
clearTimer();
props.onClose && props.onClose(messageInfo);
};
var onClick = function onClick(event) {
if (props.onClick && !(DomHandler.hasClass(event.target, 'p-toast-icon-close') || DomHandler.hasClass(event.target, 'p-toast-icon-close-icon'))) {
props.onClick(messageInfo.message);
}
};
var onMouseEnter = function onMouseEnter(event) {
props.onMouseEnter && props.onMouseEnter(event);
// do not continue if the user has canceled the event
if (event.defaultPrevented) {
return;
}
// stop timer while user has focused message
if (!sticky) {
clearTimer();
setFocused(true);
}
};
var onMouseLeave = function onMouseLeave(event) {
props.onMouseLeave && props.onMouseLeave(event);
// do not continue if the user has canceled the event
if (event.defaultPrevented) {
return;
}
// restart timer when user has left message
if (!sticky) {
setFocused(false);
}
};
var createCloseIcon = function createCloseIcon() {
if (closable !== false) {
return /*#__PURE__*/React__namespace.createElement("div", null, /*#__PURE__*/React__namespace.createElement("button", {
type: "button",
className: "p-toast-icon-close p-link",
onClick: onClose,
"aria-label": localeOption('close')
}, /*#__PURE__*/React__namespace.createElement("span", {
className: "p-toast-icon-close-icon pi pi-times",
"aria-hidden": "true"
}), /*#__PURE__*/React__namespace.createElement(Ripple, null)));
}
return null;
};
var createMessage = function createMessage() {
if (messageInfo) {
var contentEl = ObjectUtils.getJSXElement(content, {
message: messageInfo.message,
onClick: onClick,
onClose: 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__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement("span", {
className: iconClassName
}), /*#__PURE__*/React__namespace.createElement("div", {
className: "p-toast-message-text"
}, /*#__PURE__*/React__namespace.createElement("span", {
className: "p-toast-summary"
}, summary), detail && /*#__PURE__*/React__namespace.createElement("div", {
className: "p-toast-detail"
}, detail)));
}
return null;
};
var className = classNames('p-toast-message', _defineProperty({}, "p-toast-message-".concat(severity), severity), _className);
var contentClassName = classNames('p-toast-message-content', _contentClassName);
var message = createMessage();
var closeIcon = createCloseIcon();
return /*#__PURE__*/React__namespace.createElement("div", {
ref: ref,
className: className,
style: style,
role: "alert",
"aria-live": "assertive",
"aria-atomic": "true",
onClick: onClick,
onMouseEnter: onMouseEnter,
onMouseLeave: onMouseLeave
}, /*#__PURE__*/React__namespace.createElement("div", {
className: contentClassName,
style: contentStyle
}, message, closeIcon));
}));
ToastMessage.displayName = 'ToastMessage';
var messageIdx = 0;
var Toast = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = ToastBase.getProps(inProps);
var _React$useState = React__namespace.useState([]),
_React$useState2 = _slicedToArray(_React$useState, 2),
messagesState = _React$useState2[0],
setMessagesState = _React$useState2[1];
var containerRef = React__namespace.useRef(null);
var show = function show(messageInfo) {
if (messageInfo) {
var messages = assignIdentifiers(messageInfo, true);
setMessagesState(messages);
}
};
var assignIdentifiers = function assignIdentifiers(messageInfo, copy) {
var messages;
if (Array.isArray(messageInfo)) {
var multipleMessages = messageInfo.reduce(function (acc, message) {
acc.push({
_pId: messageIdx++,
message: message
});
return acc;
}, []);
if (copy) {
messages = messagesState ? [].concat(_toConsumableArray(messagesState), _toConsumableArray(multipleMessages)) : multipleMessages;
} else {
messages = multipleMessages;
}
} else {
var message = {
_pId: messageIdx++,
message: messageInfo
};
if (copy) {
messages = messagesState ? [].concat(_toConsumableArray(messagesState), [message]) : [message];
} else {
messages = [message];
}
}
return messages;
};
var clear = function clear() {
ZIndexUtils.clear(containerRef.current);
setMessagesState([]);
};
var replace = function replace(messageInfo) {
var replaced = assignIdentifiers(messageInfo, false);
setMessagesState(replaced);
};
var remove = function remove(messageInfo) {
var messages = messagesState.filter(function (msg) {
return msg._pId !== messageInfo._pId;
});
setMessagesState(messages);
props.onRemove && props.onRemove(messageInfo.message);
};
var onClose = function onClose(messageInfo) {
remove(messageInfo);
};
var onEntered = function onEntered() {
props.onShow && props.onShow();
};
var onExited = function onExited() {
messagesState.length === 1 && ZIndexUtils.clear(containerRef.current);
props.onHide && props.onHide();
};
useUpdateEffect(function () {
ZIndexUtils.set('toast', containerRef.current, PrimeReact.autoZIndex, props.baseZIndex || PrimeReact.zIndex['toast']);
}, [messagesState, props.baseZIndex]);
useUnmountEffect(function () {
ZIndexUtils.clear(containerRef.current);
});
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
show: show,
replace: replace,
remove: remove,
clear: clear,
getElement: function getElement() {
return containerRef.current;
}
};
});
var createElement = function createElement() {
var otherProps = ToastBase.getOtherProps(props);
var className = classNames('p-toast p-component p-toast-' + props.position, props.className, {
'p-input-filled': PrimeReact.inputStyle === 'filled',
'p-ripple-disabled': PrimeReact.ripple === false
});
return /*#__PURE__*/React__namespace.createElement("div", _extends({
ref: containerRef,
id: props.id,
className: className,
style: props.style
}, otherProps), /*#__PURE__*/React__namespace.createElement(reactTransitionGroup.TransitionGroup, null, messagesState && messagesState.map(function (messageInfo) {
var messageRef = /*#__PURE__*/React__namespace.createRef();
return /*#__PURE__*/React__namespace.createElement(CSSTransition, {
nodeRef: messageRef,
key: messageInfo._pId,
classNames: "p-toast-message",
unmountOnExit: true,
timeout: {
enter: 300,
exit: 300
},
onEntered: onEntered,
onExited: onExited,
options: props.transitionOptions
}, /*#__PURE__*/React__namespace.createElement(ToastMessage, {
ref: messageRef,
messageInfo: messageInfo,
onClick: props.onClick,
onClose: onClose,
onMouseEnter: props.onMouseEnter,
onMouseLeave: props.onMouseLeave
}));
})));
};
var element = createElement();
return /*#__PURE__*/React__namespace.createElement(Portal, {
element: element,
appendTo: props.appendTo
});
}));
Toast.displayName = 'Toast';
var ToggleButtonBase = {
defaultProps: {
__TYPE: 'ToggleButton',
id: null,
onIcon: null,
offIcon: null,
onLabel: 'Yes',
offLabel: 'No',
iconPos: 'left',
style: null,
className: null,
checked: false,
tabIndex: 0,
tooltip: null,
tooltipOptions: null,
onChange: null,
onFocus: null,
onBlur: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, ToggleButtonBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, ToggleButtonBase.defaultProps);
}
};
var ToggleButton = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = ToggleButtonBase.getProps(inProps);
var elementRef = React__namespace.useRef(null);
var hasLabel = props.onLabel && props.onLabel.length > 0 && props.offLabel && props.offLabel.length > 0;
var hasIcon = props.onIcon && props.onIcon.length > 0 && props.offIcon && props.offIcon.length > 0;
var label = hasLabel ? props.checked ? props.onLabel : props.offLabel : ' ';
var icon = props.checked ? props.onIcon : props.offIcon;
var toggle = function toggle(e) {
if (!props.disabled && props.onChange) {
props.onChange({
originalEvent: e,
value: !props.checked,
stopPropagation: function stopPropagation() {},
preventDefault: function preventDefault() {},
target: {
name: props.name,
id: props.id,
value: !props.checked
}
});
}
};
var onKeyDown = function onKeyDown(event) {
if (event.keyCode === 32) {
toggle(event);
event.preventDefault();
}
};
var createIcon = function createIcon() {
if (hasIcon) {
var iconClassName = classNames('p-button-icon p-c', {
'p-button-icon-left': props.iconPos === 'left' && label,
'p-button-icon-right': props.iconPos === 'right' && label
});
return IconUtils.getJSXIcon(icon, {
className: iconClassName
}, {
props: props
});
}
return null;
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
focus: function focus() {
return DomHandler.focusFirstElement(elementRef.current);
},
getElement: function getElement() {
return elementRef.current;
}
};
});
var hasTooltip = ObjectUtils.isNotEmpty(props.tooltip);
var tabIndex = props.disabled ? -1 : props.tabIndex;
var otherProps = ToggleButtonBase.getOtherProps(props);
var className = classNames('p-button p-togglebutton p-component', {
'p-button-icon-only': hasIcon && !hasLabel,
'p-highlight': props.checked,
'p-disabled': props.disabled
}, props.className);
var iconElement = createIcon();
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement("div", _extends({
ref: elementRef,
id: props.id,
className: className,
style: props.style
}, otherProps, {
onClick: toggle,
onFocus: props.onFocus,
onBlur: props.onBlur,
onKeyDown: onKeyDown,
tabIndex: tabIndex,
role: "button",
"aria-pressed": props.checked
}), iconElement, /*#__PURE__*/React__namespace.createElement("span", {
className: "p-button-label"
}, label), /*#__PURE__*/React__namespace.createElement(Ripple, null)), hasTooltip && /*#__PURE__*/React__namespace.createElement(Tooltip, _extends({
target: elementRef,
content: props.tooltip
}, props.tooltipOptions)));
}));
ToggleButton.displayName = 'ToggleButton';
var ToolbarBase = {
defaultProps: {
__TYPE: 'Toolbar',
id: null,
style: null,
className: null,
left: null,
right: null,
start: null,
center: null,
end: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, ToolbarBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, ToolbarBase.defaultProps);
}
};
var Toolbar = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = ToolbarBase.getProps(inProps);
var elementRef = React__namespace.useRef(null);
var otherProps = ToolbarBase.getOtherProps(props);
var toolbarClass = classNames('p-toolbar p-component', props.className);
var start = ObjectUtils.getJSXElement(props.left || props.start, props);
var center = ObjectUtils.getJSXElement(props.center, props);
var end = ObjectUtils.getJSXElement(props.right || props.end, props);
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
getElement: function getElement() {
return elementRef.current;
}
};
});
return /*#__PURE__*/React__namespace.createElement("div", _extends({
id: props.id,
ref: elementRef,
className: toolbarClass,
style: props.style,
role: "toolbar"
}, otherProps), /*#__PURE__*/React__namespace.createElement("div", {
className: "p-toolbar-group-start p-toolbar-group-left"
}, start), /*#__PURE__*/React__namespace.createElement("div", {
className: "p-toolbar-group-center"
}, center), /*#__PURE__*/React__namespace.createElement("div", {
className: "p-toolbar-group-end p-toolbar-group-right"
}, end));
}));
Toolbar.displayName = 'Toolbar';
var TreeBase = {
defaultProps: {
__TYPE: 'Tree',
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,
filterTemplate: null,
nodeTemplate: null,
togglerTemplate: null,
onSelect: null,
onUnselect: null,
onExpand: null,
onCollapse: null,
onToggle: null,
onDragDrop: null,
onContextMenu: null,
onFilterValueChange: null,
onNodeClick: null,
onNodeDoubleClick: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, TreeBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, TreeBase.defaultProps);
}
};
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$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; }
var UITreeNode = /*#__PURE__*/React__namespace.memo(function (props) {
var contentRef = React__namespace.useRef(null);
var nodeTouched = React__namespace.useRef(false);
var isLeaf = props.isNodeLeaf(props.node);
var expanded = (props.expandedKeys ? props.expandedKeys[props.node.key] !== undefined : false) || props.node.expanded;
var expand = function expand(event) {
var expandedKeys = props.expandedKeys ? _objectSpread$5({}, props.expandedKeys) : {};
expandedKeys[props.node.key] = true;
props.onToggle({
originalEvent: event,
value: expandedKeys
});
invokeToggleEvents(event, true);
};
var collapse = function collapse(event) {
var expandedKeys = _objectSpread$5({}, props.expandedKeys);
delete expandedKeys[props.node.key];
props.onToggle({
originalEvent: event,
value: expandedKeys
});
invokeToggleEvents(event, false);
};
var onTogglerClick = function onTogglerClick(event) {
if (props.disabled) {
return;
}
expanded ? collapse(event) : expand(event);
event.preventDefault();
event.stopPropagation();
};
var invokeToggleEvents = function invokeToggleEvents(event, isExpanded) {
if (isExpanded) {
if (props.onExpand) {
props.onExpand({
originalEvent: event,
node: props.node
});
}
} else {
if (props.onCollapse) {
props.onCollapse({
originalEvent: event,
node: props.node
});
}
}
};
var onNodeKeyDown = function onNodeKeyDown(event) {
if (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) {
focusNode(listElement.children[0]);
} else {
var nextNodeElement = nodeElement.nextElementSibling;
while (nextNodeElement) {
if (!DomHandler.hasClass(nextNodeElement, 'p-treenode-droppoint')) {
break;
}
nextNodeElement = nextNodeElement.nextElementSibling;
}
if (nextNodeElement) {
focusNode(nextNodeElement);
} else {
var nextSiblingAncestor = findNextSiblingOfAncestor(nodeElement);
nextSiblingAncestor && focusNode(nextSiblingAncestor);
}
}
event.preventDefault();
break;
//up arrow
case 38:
if (nodeElement.previousElementSibling) {
focusNode(findLastVisibleDescendant(nodeElement.previousElementSibling));
} else {
var parentNodeElement = getParentNodeElement(nodeElement);
parentNodeElement && focusNode(parentNodeElement);
}
event.preventDefault();
break;
//right arrow
case 39:
if (!expanded) {
expand(event);
}
event.preventDefault();
break;
//left arrow
case 37:
if (expanded) {
collapse(event);
}
event.preventDefault();
break;
//enter
case 13:
onClick(event);
event.preventDefault();
break;
}
};
var findNextSiblingOfAncestor = function findNextSiblingOfAncestor(nodeElement) {
var parentNodeElement = getParentNodeElement(nodeElement);
return parentNodeElement ? parentNodeElement.nextElementSibling || findNextSiblingOfAncestor(parentNodeElement) : null;
};
var findLastVisibleDescendant = function findLastVisibleDescendant(nodeElement) {
var childrenListElement = nodeElement.children[1];
if (childrenListElement) {
var lastChildElement = childrenListElement.children[childrenListElement.children.length - 1];
return findLastVisibleDescendant(lastChildElement);
} else {
return nodeElement;
}
};
var getParentNodeElement = function getParentNodeElement(nodeElement) {
var parentNodeElement = nodeElement.parentElement.parentElement;
return DomHandler.hasClass(parentNodeElement, 'p-treenode') ? parentNodeElement : null;
};
var focusNode = function focusNode(element) {
element && element.children[0] && element.children[0].focus();
};
var onClick = function onClick(event) {
if (props.onClick) {
props.onClick({
originalEvent: event,
node: props.node
});
}
var targetNode = event.target.nodeName;
if (props.disabled || targetNode === 'INPUT' || targetNode === 'BUTTON' || targetNode === 'A' || DomHandler.hasClass(event.target, 'p-clickable')) {
return;
}
if (props.selectionMode && props.node.selectable !== false) {
var selectionKeys;
if (isCheckboxSelectionMode()) {
var checked = isChecked();
selectionKeys = props.selectionKeys ? _objectSpread$5({}, props.selectionKeys) : {};
if (checked) {
if (props.propagateSelectionDown) propagateDown(props.node, false, selectionKeys);else delete selectionKeys[props.node.key];
if (props.propagateSelectionUp && props.onPropagateUp) {
props.onPropagateUp({
originalEvent: event,
check: false,
selectionKeys: selectionKeys
});
}
if (props.onUnselect) {
props.onUnselect({
originalEvent: event,
node: props.node
});
}
} else {
if (props.propagateSelectionDown) propagateDown(props.node, true, selectionKeys);else selectionKeys[props.node.key] = {
checked: true
};
if (props.propagateSelectionUp && props.onPropagateUp) {
props.onPropagateUp({
originalEvent: event,
check: true,
selectionKeys: selectionKeys
});
}
if (props.onSelect) {
props.onSelect({
originalEvent: event,
node: props.node
});
}
}
} else {
var selected = isSelected();
var metaSelection = nodeTouched.current ? false : props.metaKeySelection;
if (metaSelection) {
var metaKey = event.metaKey || event.ctrlKey;
if (selected && metaKey) {
if (isSingleSelectionMode()) {
selectionKeys = null;
} else {
selectionKeys = _objectSpread$5({}, props.selectionKeys);
delete selectionKeys[props.node.key];
}
if (props.onUnselect) {
props.onUnselect({
originalEvent: event,
node: props.node
});
}
} else {
if (isSingleSelectionMode()) {
selectionKeys = props.node.key;
} else if (isMultipleSelectionMode()) {
selectionKeys = !metaKey ? {} : props.selectionKeys ? _objectSpread$5({}, props.selectionKeys) : {};
selectionKeys[props.node.key] = true;
}
if (props.onSelect) {
props.onSelect({
originalEvent: event,
node: props.node
});
}
}
} else {
if (isSingleSelectionMode()) {
if (selected) {
selectionKeys = null;
if (props.onUnselect) {
props.onUnselect({
originalEvent: event,
node: props.node
});
}
} else {
selectionKeys = props.node.key;
if (props.onSelect) {
props.onSelect({
originalEvent: event,
node: props.node
});
}
}
} else {
if (selected) {
selectionKeys = _objectSpread$5({}, props.selectionKeys);
delete selectionKeys[props.node.key];
if (props.onUnselect) {
props.onUnselect({
originalEvent: event,
node: props.node
});
}
} else {
selectionKeys = props.selectionKeys ? _objectSpread$5({}, props.selectionKeys) : {};
selectionKeys[props.node.key] = true;
if (props.onSelect) {
props.onSelect({
originalEvent: event,
node: props.node
});
}
}
}
}
}
if (props.onSelectionChange) {
props.onSelectionChange({
originalEvent: event,
value: selectionKeys
});
}
}
nodeTouched.current = false;
};
var onDoubleClick = function onDoubleClick(event) {
if (props.onDoubleClick) {
props.onDoubleClick({
originalEvent: event,
node: props.node
});
}
};
var onRightClick = function onRightClick(event) {
if (props.disabled) {
return;
}
DomHandler.clearSelection();
if (props.onContextMenuSelectionChange) {
props.onContextMenuSelectionChange({
originalEvent: event,
value: props.node.key
});
}
if (props.onContextMenu) {
props.onContextMenu({
originalEvent: event,
node: props.node
});
}
};
var propagateUp = function propagateUp(event) {
var check = event.check;
var selectionKeys = event.selectionKeys;
var checkedChildCount = 0;
var childPartialSelected = false;
var _iterator = _createForOfIteratorHelper$6(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 === props.node.children.length) {
selectionKeys[props.node.key] = {
checked: true,
partialChecked: false
};
} else {
if (!check) {
delete selectionKeys[props.node.key];
}
if (childPartialSelected || checkedChildCount > 0 && checkedChildCount !== props.node.children.length) selectionKeys[props.node.key] = {
checked: false,
partialChecked: true
};else delete selectionKeys[props.node.key];
}
if (props.propagateSelectionUp && props.onPropagateUp) {
props.onPropagateUp(event);
}
};
var propagateDown = 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++) {
propagateDown(node.children[i], check, selectionKeys);
}
}
};
var isSelected = function isSelected() {
if (props.selectionMode && props.selectionKeys) return isSingleSelectionMode() ? props.selectionKeys === props.node.key : props.selectionKeys[props.node.key] !== undefined;else return false;
};
var isChecked = function isChecked() {
return props.selectionKeys ? props.selectionKeys[props.node.key] && props.selectionKeys[props.node.key].checked : false;
};
var isPartialChecked = function isPartialChecked() {
return props.selectionKeys ? props.selectionKeys[props.node.key] && props.selectionKeys[props.node.key].partialChecked : false;
};
var isSingleSelectionMode = function isSingleSelectionMode() {
return props.selectionMode && props.selectionMode === 'single';
};
var isMultipleSelectionMode = function isMultipleSelectionMode() {
return props.selectionMode && props.selectionMode === 'multiple';
};
var isCheckboxSelectionMode = function isCheckboxSelectionMode() {
return props.selectionMode && props.selectionMode === 'checkbox';
};
var onTouchEnd = function onTouchEnd() {
nodeTouched.current = true;
};
var onDropPoint = function onDropPoint(event, position) {
event.preventDefault();
if (props.node.droppable !== false) {
DomHandler.removeClass(event.target, 'p-treenode-droppoint-active');
if (props.onDropPoint) {
var dropIndex = position === -1 ? props.index : props.index + 1;
props.onDropPoint({
originalEvent: event,
path: props.path,
index: dropIndex,
position: position
});
}
}
};
var onDropPointDragOver = function onDropPointDragOver(event) {
if (event.dataTransfer.types[1] === props.dragdropScope.toLocaleLowerCase()) {
event.dataTransfer.dropEffect = 'move';
event.preventDefault();
}
};
var onDropPointDragEnter = function onDropPointDragEnter(event) {
if (event.dataTransfer.types[1] === props.dragdropScope.toLocaleLowerCase()) {
DomHandler.addClass(event.target, 'p-treenode-droppoint-active');
}
};
var onDropPointDragLeave = function onDropPointDragLeave(event) {
if (event.dataTransfer.types[1] === props.dragdropScope.toLocaleLowerCase()) {
DomHandler.removeClass(event.target, 'p-treenode-droppoint-active');
}
};
var onDrop = function onDrop(event) {
if (props.dragdropScope && props.node.droppable !== false) {
DomHandler.removeClass(contentRef.current, 'p-treenode-dragover');
event.preventDefault();
event.stopPropagation();
if (props.onDrop) {
props.onDrop({
originalEvent: event,
path: props.path,
index: props.index
});
}
}
};
var onDragOver = function onDragOver(event) {
if (event.dataTransfer.types[1] === props.dragdropScope.toLocaleLowerCase() && props.node.droppable !== false) {
event.dataTransfer.dropEffect = 'move';
event.preventDefault();
event.stopPropagation();
}
};
var onDragEnter = function onDragEnter(event) {
if (event.dataTransfer.types[1] === props.dragdropScope.toLocaleLowerCase() && props.node.droppable !== false) {
DomHandler.addClass(contentRef.current, 'p-treenode-dragover');
}
};
var onDragLeave = function onDragLeave(event) {
if (event.dataTransfer.types[1] === props.dragdropScope.toLocaleLowerCase() && 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(contentRef.current, 'p-treenode-dragover');
}
}
};
var onDragStart = function onDragStart(event) {
event.dataTransfer.setData('text', props.dragdropScope);
event.dataTransfer.setData(props.dragdropScope, props.dragdropScope);
if (props.onDragStart) {
props.onDragStart({
originalEvent: event,
path: props.path,
index: props.index
});
}
};
var onDragEnd = function onDragEnd(event) {
if (props.onDragEnd) {
props.onDragEnd({
originalEvent: event
});
}
};
var createLabel = function createLabel() {
var content = /*#__PURE__*/React__namespace.createElement("span", {
className: "p-treenode-label"
}, props.node.label);
if (props.nodeTemplate) {
var defaultContentOptions = {
onTogglerClick: onTogglerClick,
className: 'p-treenode-label',
element: content,
props: props,
expanded: expanded
};
content = ObjectUtils.getJSXElement(props.nodeTemplate, props.node, defaultContentOptions);
}
return content;
};
var createCheckbox = function createCheckbox() {
if (isCheckboxSelectionMode() && props.node.selectable !== false) {
var checked = isChecked();
var partialChecked = isPartialChecked();
var className = classNames('p-checkbox-box', {
'p-highlight': checked,
'p-indeterminate': partialChecked,
'p-disabled': props.disabled
});
var icon = classNames('p-checkbox-icon p-c', {
'pi pi-check': checked,
'pi pi-minus': partialChecked
});
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-checkbox p-component"
}, /*#__PURE__*/React__namespace.createElement("div", {
className: className,
role: "checkbox",
"aria-checked": checked
}, /*#__PURE__*/React__namespace.createElement("span", {
className: icon
})));
}
return null;
};
var createIcon = function createIcon() {
var icon = props.node.icon || (expanded ? props.node.expandedIcon : props.node.collapsedIcon);
if (icon) {
var className = classNames('p-treenode-icon', icon);
return /*#__PURE__*/React__namespace.createElement("span", {
className: className
});
}
return null;
};
var createToggler = function createToggler() {
var label = expanded ? ariaLabel('collapseLabel') : ariaLabel('expandLabel');
var iconClassName = classNames('p-tree-toggler-icon pi pi-fw', {
'pi-chevron-right': !expanded,
'pi-chevron-down': expanded
});
var content = /*#__PURE__*/React__namespace.createElement("button", {
type: "button",
className: "p-tree-toggler p-link",
tabIndex: -1,
onClick: onTogglerClick,
"aria-label": label
}, /*#__PURE__*/React__namespace.createElement("span", {
className: iconClassName,
"aria-hidden": "true"
}), /*#__PURE__*/React__namespace.createElement(Ripple, null));
if (props.togglerTemplate) {
var defaultContentOptions = {
onClick: onTogglerClick,
containerClassName: 'p-tree-toggler p-link',
iconClassName: 'p-tree-toggler-icon',
element: content,
props: props,
expanded: expanded
};
content = ObjectUtils.getJSXElement(props.togglerTemplate, props.node, defaultContentOptions);
}
return content;
};
var createDropPoint = function createDropPoint(position) {
if (props.dragdropScope) {
return /*#__PURE__*/React__namespace.createElement("li", {
className: "p-treenode-droppoint",
onDrop: function onDrop(event) {
return onDropPoint(event, position);
},
onDragOver: onDropPointDragOver,
onDragEnter: onDropPointDragEnter,
onDragLeave: onDropPointDragLeave
});
}
return null;
};
var createContent = function createContent() {
var selected = isSelected();
var checked = isChecked();
var className = classNames('p-treenode-content', props.node.className, {
'p-treenode-selectable': props.selectionMode && props.node.selectable !== false,
'p-highlight': isCheckboxSelectionMode() ? checked : selected,
'p-highlight-contextmenu': props.contextMenuSelectionKey && props.contextMenuSelectionKey === props.node.key,
'p-disabled': props.disabled
});
var toggler = createToggler();
var checkbox = createCheckbox();
var icon = createIcon();
var label = createLabel();
var tabIndex = props.disabled ? undefined : 0;
return /*#__PURE__*/React__namespace.createElement("div", {
ref: contentRef,
className: className,
style: props.node.style,
onClick: onClick,
onDoubleClick: onDoubleClick,
onContextMenu: onRightClick,
onTouchEnd: onTouchEnd,
draggable: props.dragdropScope && props.node.draggable !== false && !props.disabled,
onDrop: onDrop,
onDragOver: onDragOver,
onDragEnter: onDragEnter,
onDragLeave: onDragLeave,
onDragStart: onDragStart,
onDragEnd: onDragEnd,
tabIndex: tabIndex,
onKeyDown: onNodeKeyDown,
role: "treeitem",
"aria-posinset": props.index + 1,
"aria-expanded": expanded,
"aria-selected": checked || selected
}, toggler, checkbox, icon, label);
};
var createChildren = function createChildren() {
if (ObjectUtils.isNotEmpty(props.node.children) && expanded) {
return /*#__PURE__*/React__namespace.createElement("ul", {
className: "p-treenode-children",
role: "group"
}, props.node.children.map(function (childNode, index) {
return /*#__PURE__*/React__namespace.createElement(UITreeNode, {
key: childNode.key || childNode.label,
node: childNode,
parent: props.node,
index: index,
last: index === props.node.children.length - 1,
path: props.path + '-' + index,
disabled: props.disabled,
selectionMode: props.selectionMode,
selectionKeys: props.selectionKeys,
onSelectionChange: props.onSelectionChange,
metaKeySelection: props.metaKeySelection,
propagateSelectionDown: props.propagateSelectionDown,
propagateSelectionUp: props.propagateSelectionUp,
contextMenuSelectionKey: props.contextMenuSelectionKey,
onContextMenuSelectionChange: props.onContextMenuSelectionChange,
onContextMenu: props.onContextMenu,
onExpand: props.onExpand,
onCollapse: props.onCollapse,
onSelect: props.onSelect,
onUnselect: props.onUnselect,
onClick: props.onClick,
onDoubleClick: props.onDoubleClick,
expandedKeys: props.expandedKeys,
onToggle: props.onToggle,
onPropagateUp: propagateUp,
nodeTemplate: props.nodeTemplate,
togglerTemplate: props.togglerTemplate,
isNodeLeaf: props.isNodeLeaf,
dragdropScope: props.dragdropScope,
onDragStart: props.onDragStart,
onDragEnd: props.onDragEnd,
onDrop: props.onDrop,
onDropPoint: props.onDropPoint
});
}));
}
return null;
};
var createNode = function createNode() {
var className = classNames('p-treenode', {
'p-treenode-leaf': isLeaf
}, props.node.className);
var content = createContent();
var children = createChildren();
return /*#__PURE__*/React__namespace.createElement("li", {
className: className,
style: props.node.style
}, content, children);
};
var node = createNode();
if (props.dragdropScope && !props.disabled) {
var beforeDropPoint = createDropPoint(-1);
var afterDropPoint = props.last ? createDropPoint(1) : null;
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, beforeDropPoint, node, afterDropPoint);
}
return node;
});
UITreeNode.displayName = 'UITreeNode';
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$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; }
var Tree = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = TreeBase.getProps(inProps);
var _React$useState = React__namespace.useState(''),
_React$useState2 = _slicedToArray(_React$useState, 2),
filterValueState = _React$useState2[0],
setFilterValueState = _React$useState2[1];
var _React$useState3 = React__namespace.useState(props.expandedKeys),
_React$useState4 = _slicedToArray(_React$useState3, 2),
expandedKeysState = _React$useState4[0],
setExpandedKeysState = _React$useState4[1];
var elementRef = React__namespace.useRef(null);
var filteredNodes = React__namespace.useRef([]);
var dragState = React__namespace.useRef(null);
var filterChanged = React__namespace.useRef(false);
var filteredValue = props.onFilterValueChange ? props.filterValue : filterValueState;
var expandedKeys = props.onToggle ? props.expandedKeys : expandedKeysState;
var filterOptions = {
filter: function filter(e) {
return onFilterInputChange(e);
},
reset: function reset() {
return resetFilter();
}
};
var getRootNode = function getRootNode() {
return props.filter && filteredNodes.current ? filteredNodes.current : props.value;
};
var onToggle = function onToggle(event) {
if (props.onToggle) {
props.onToggle(event);
} else {
setExpandedKeysState(event.value);
}
};
var onDragStart = function onDragStart(event) {
dragState.current = {
path: event.path,
index: event.index
};
};
var onDragEnd = function onDragEnd() {
dragState.current = null;
};
var onDrop = function onDrop(event) {
if (validateDropNode(dragState.current.path, event.path)) {
var value = JSON.parse(JSON.stringify(props.value));
var dragPaths = dragState.current.path.split('-');
dragPaths.pop();
var dragNodeParent = findNode(value, dragPaths);
var dragNode = dragNodeParent ? dragNodeParent.children[dragState.current.index] : value[dragState.current.index];
var dropNode = findNode(value, event.path.split('-'));
if (dropNode.children) dropNode.children.push(dragNode);else dropNode.children = [dragNode];
if (dragNodeParent) dragNodeParent.children.splice(dragState.current.index, 1);else value.splice(dragState.current.index, 1);
if (props.onDragDrop) {
props.onDragDrop({
originalEvent: event.originalEvent,
value: value,
dragNode: dragNode,
dropNode: dropNode,
dropIndex: event.index
});
}
}
};
var onDropPoint = function onDropPoint(event) {
if (validateDropPoint(event)) {
var value = JSON.parse(JSON.stringify(props.value));
var dragPaths = dragState.current.path.split('-');
dragPaths.pop();
var dropPaths = event.path.split('-');
dropPaths.pop();
var dragNodeParent = findNode(value, dragPaths);
var dropNodeParent = findNode(value, dropPaths);
var dragNode = dragNodeParent ? dragNodeParent.children[dragState.current.index] : value[dragState.current.index];
var siblings = areSiblings(dragState.current.path, event.path);
if (dragNodeParent) dragNodeParent.children.splice(dragState.current.index, 1);else value.splice(dragState.current.index, 1);
if (event.position < 0) {
var dropIndex = siblings ? dragState.current.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 (props.onDragDrop) {
props.onDragDrop({
originalEvent: event.originalEvent,
value: value,
dragNode: dragNode,
dropNode: dropNodeParent,
dropIndex: event.index
});
}
}
};
var validateDrop = 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;
}
};
var validateDropNode = function validateDropNode(dragPath, dropPath) {
var _validateDrop = 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;
}
};
var validateDropPoint = function validateDropPoint(event) {
var _validateDrop = validateDrop(dragState.current.path, event.path);
if (_validateDrop) {
//child dropped to next sibling's drop point
if (event.position === -1 && areSiblings(dragState.current.path, event.path) && dragState.current.index + 1 === event.index) {
return false;
}
return true;
} else {
return false;
}
};
var areSiblings = 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('-'));
};
var findNode = 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 findNode(nextSearchRoot, path);
}
}
};
var isNodeLeaf = function isNodeLeaf(node) {
return node.leaf === false ? false : !(node.children && node.children.length);
};
var onFilterInputKeyDown = function onFilterInputKeyDown(event) {
//enter
if (event.which === 13) {
event.preventDefault();
}
};
var onFilterInputChange = function onFilterInputChange(event) {
filterChanged.current = true;
var value = event.target.value;
if (props.onFilterValueChange) {
props.onFilterValueChange({
originalEvent: event,
value: value
});
} else {
setFilterValueState(value);
}
};
var filter = function filter(value) {
setFilterValueState(ObjectUtils.isNotEmpty(value) ? value : '');
_filter();
};
var _filter = function _filter() {
if (!filterChanged.current) {
return;
}
if (ObjectUtils.isEmpty(filteredValue)) {
filteredNodes.current = props.value;
} else {
filteredNodes.current = [];
var searchFields = props.filterBy.split(',');
var filterText = filteredValue.toLocaleLowerCase(props.filterLocale);
var isStrictMode = props.filterMode === 'strict';
var _iterator = _createForOfIteratorHelper$5(props.value),
_step;
try {
for (_iterator.s(); !(_step = _iterator.n()).done;) {
var node = _step.value;
var copyNode = _objectSpread$4({}, node);
var paramsWithoutNode = {
searchFields: searchFields,
filterText: filterText,
isStrictMode: isStrictMode
};
if (isStrictMode && (findFilteredNodes(copyNode, paramsWithoutNode) || isFilterMatched(copyNode, paramsWithoutNode)) || !isStrictMode && (isFilterMatched(copyNode, paramsWithoutNode) || findFilteredNodes(copyNode, paramsWithoutNode))) {
filteredNodes.current.push(copyNode);
}
}
} catch (err) {
_iterator.e(err);
} finally {
_iterator.f();
}
}
filterChanged.current = false;
};
var findFilteredNodes = 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$4({}, childNode);
if (isFilterMatched(copyChildNode, paramsWithoutNode)) {
matched = true;
node.children.push(copyChildNode);
}
}
} catch (err) {
_iterator2.e(err);
} finally {
_iterator2.f();
}
}
if (matched) {
node.expanded = true;
return true;
}
}
};
var isFilterMatched = 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(props.filterLocale);
if (fieldValue.indexOf(filterText) > -1) {
matched = true;
}
}
} catch (err) {
_iterator3.e(err);
} finally {
_iterator3.f();
}
if (!matched || isStrictMode && !isNodeLeaf(node)) {
matched = findFilteredNodes(node, {
searchFields: searchFields,
filterText: filterText,
isStrictMode: isStrictMode
}) || matched;
}
return matched;
};
var resetFilter = function resetFilter() {
setFilterValueState('');
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
filter: filter,
getElement: function getElement() {
return elementRef.current;
}
};
});
var createRootChild = function createRootChild(node, index, last) {
return /*#__PURE__*/React__namespace.createElement(UITreeNode, {
key: node.key || node.label,
node: node,
index: index,
last: last,
path: String(index),
disabled: props.disabled,
selectionMode: props.selectionMode,
selectionKeys: props.selectionKeys,
onSelectionChange: props.onSelectionChange,
metaKeySelection: props.metaKeySelection,
contextMenuSelectionKey: props.contextMenuSelectionKey,
onContextMenuSelectionChange: props.onContextMenuSelectionChange,
onContextMenu: props.onContextMenu,
propagateSelectionDown: props.propagateSelectionDown,
propagateSelectionUp: props.propagateSelectionUp,
onExpand: props.onExpand,
onCollapse: props.onCollapse,
onSelect: props.onSelect,
onUnselect: props.onUnselect,
expandedKeys: expandedKeys,
onToggle: onToggle,
nodeTemplate: props.nodeTemplate,
togglerTemplate: props.togglerTemplate,
isNodeLeaf: isNodeLeaf,
dragdropScope: props.dragdropScope,
onDragStart: onDragStart,
onDragEnd: onDragEnd,
onDrop: onDrop,
onDropPoint: onDropPoint,
onClick: props.onNodeClick,
onDoubleClick: props.onNodeDoubleClick
});
};
var createRootChildren = function createRootChildren() {
if (props.filter) {
filterChanged.current = true;
_filter();
}
var value = getRootNode();
return value.map(function (node, index) {
return createRootChild(node, index, index === value.length - 1);
});
};
var createModel = function createModel() {
if (props.value) {
var rootNodes = createRootChildren();
var contentClass = classNames('p-tree-container', props.contentClassName);
return /*#__PURE__*/React__namespace.createElement("ul", _extends({
className: contentClass,
role: "tree",
style: props.contentStyle
}, ariaProps), rootNodes);
}
return null;
};
var createLoader = function createLoader() {
if (props.loading) {
var icon = classNames('p-tree-loading-icon pi-spin', props.loadingIcon);
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-tree-loading-overlay p-component-overlay"
}, /*#__PURE__*/React__namespace.createElement("i", {
className: icon
}));
}
return null;
};
var createFilter = function createFilter() {
if (props.filter) {
var value = ObjectUtils.isNotEmpty(filteredValue) ? filteredValue : '';
var _content = /*#__PURE__*/React__namespace.createElement("div", {
className: "p-tree-filter-container"
}, /*#__PURE__*/React__namespace.createElement("input", {
type: "text",
value: value,
autoComplete: "off",
className: "p-tree-filter p-inputtext p-component",
placeholder: props.filterPlaceholder,
onKeyDown: onFilterInputKeyDown,
onChange: onFilterInputChange,
disabled: props.disabled
}), /*#__PURE__*/React__namespace.createElement("span", {
className: "p-tree-filter-icon pi pi-search"
}));
if (props.filterTemplate) {
var defaultContentOptions = {
className: 'p-tree-filter-container',
element: _content,
filterOptions: filterOptions,
filterInputKeyDown: onFilterInputKeyDown,
filterInputChange: onFilterInputChange,
filterIconClassName: 'p-dropdown-filter-icon pi pi-search',
props: props
};
_content = ObjectUtils.getJSXElement(props.filterTemplate, defaultContentOptions);
}
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, _content);
}
return null;
};
var createHeader = function createHeader() {
if (props.showHeader) {
var filterElement = createFilter();
var _content2 = filterElement;
if (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: onFilterInputKeyDown,
onChange: onFilterInputChange
},
filterElement: filterElement,
element: _content2,
props: props
};
_content2 = ObjectUtils.getJSXElement(props.header, defaultContentOptions);
}
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-tree-header"
}, _content2);
}
return null;
};
var createFooter = function createFooter() {
var content = ObjectUtils.getJSXElement(props.footer, props);
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-tree-footer"
}, content);
};
var otherProps = TreeBase.getOtherProps(props);
var ariaProps = ObjectUtils.reduceKeys(otherProps, DomHandler.ARIA_PROPS);
var className = classNames('p-tree p-component', props.className, {
'p-tree-selectable': props.selectionMode,
'p-tree-loading': props.loading,
'p-disabled': props.disabled
});
var loader = createLoader();
var content = createModel();
var header = createHeader();
var footer = createFooter();
return /*#__PURE__*/React__namespace.createElement("div", _extends({
id: props.id,
ref: elementRef,
className: className,
style: props.style
}, otherProps), loader, header, content, footer);
}));
Tree.displayName = 'Tree';
var TreeSelectBase = {
defaultProps: {
__TYPE: 'TreeSelect',
appendTo: null,
ariaLabel: null,
ariaLabelledBy: null,
className: null,
disabled: false,
display: 'comma',
dropdownIcon: 'pi pi-chevron-down',
emptyMessage: null,
expandedKeys: null,
filter: false,
filterBy: 'label',
filterInputAutoFocus: true,
filterLocale: undefined,
filterMode: 'lenient',
filterPlaceholder: null,
filterTemplate: null,
filterValue: null,
inputId: null,
inputRef: null,
metaKeySelection: true,
name: null,
onChange: null,
onFilterValueChange: null,
onHide: null,
onNodeCollapse: null,
onNodeExpand: null,
onNodeSelect: null,
onNodeUnselect: null,
onShow: null,
options: null,
panelClassName: null,
panelFooterTemplate: null,
panelHeaderTemplate: null,
panelStyle: null,
placeholder: null,
resetFilterOnHide: false,
scrollHeight: '400px',
selectionMode: 'single',
style: null,
tabIndex: null,
transitionOptions: null,
value: null,
valueTemplate: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, TreeSelectBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, TreeSelectBase.defaultProps);
}
};
var TreeSelectPanel = /*#__PURE__*/React__namespace.forwardRef(function (props, ref) {
var createElement = function createElement() {
var wrapperStyle = {
maxHeight: props.scrollHeight || 'auto'
};
var className = classNames('p-treeselect-panel p-component', props.panelClassName, {
'p-input-filled': PrimeReact.inputStyle === 'filled',
'p-ripple-disabled': PrimeReact.ripple === false
});
return /*#__PURE__*/React__namespace.createElement(CSSTransition, {
nodeRef: ref,
classNames: "p-connected-overlay",
"in": props["in"],
timeout: {
enter: 120,
exit: 100
},
options: props.transitionOptions,
unmountOnExit: true,
onEnter: props.onEnter,
onEntering: props.onEntering,
onEntered: props.onEntered,
onExit: props.onExit,
onExited: props.onExited
}, /*#__PURE__*/React__namespace.createElement("div", {
ref: ref,
className: className,
style: props.panelStyle,
onClick: props.onClick
}, props.header, /*#__PURE__*/React__namespace.createElement("div", {
className: "p-treeselect-items-wrapper",
style: wrapperStyle
}, props.children), props.footer));
};
var element = createElement();
return /*#__PURE__*/React__namespace.createElement(Portal, {
element: element,
appendTo: props.appendTo
});
});
TreeSelectPanel.displayName = 'TreeSelectPanel';
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 _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; }
var TreeSelect = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = TreeSelectBase.getProps(inProps);
var _React$useState = React__namespace.useState(false),
_React$useState2 = _slicedToArray(_React$useState, 2),
focusedState = _React$useState2[0],
setFocusedState = _React$useState2[1];
var _React$useState3 = React__namespace.useState(false),
_React$useState4 = _slicedToArray(_React$useState3, 2),
overlayVisibleState = _React$useState4[0],
setOverlayVisibleState = _React$useState4[1];
var _React$useState5 = React__namespace.useState(props.expandedKeys),
_React$useState6 = _slicedToArray(_React$useState5, 2),
expandedKeysState = _React$useState6[0],
setExpandedKeysState = _React$useState6[1];
var _React$useState7 = React__namespace.useState(''),
_React$useState8 = _slicedToArray(_React$useState7, 2),
filterValueState = _React$useState8[0],
setFilterValueState = _React$useState8[1];
var elementRef = React__namespace.useRef(null);
var overlayRef = React__namespace.useRef(null);
var filterInputRef = React__namespace.useRef(null);
var focusInputRef = React__namespace.useRef(props.inputRef);
var triggerRef = React__namespace.useRef(null);
var selfChange = React__namespace.useRef(null);
var expandedKeys = props.onToggle ? props.expandedKeys : expandedKeysState;
var filteredValue = props.onFilterValueChange ? props.filterValue : filterValueState;
var isValueEmpty = ObjectUtils.isEmpty(props.value);
var hasNoOptions = ObjectUtils.isEmpty(props.options);
var isSingleSelectionMode = props.selectionMode === 'single';
var isCheckboxSelectionMode = props.selectionMode === 'checkbox';
var filterOptions = {
filter: function filter(e) {
return onFilterInputChange(e);
},
reset: function reset() {
return resetFilter();
}
};
var _useOverlayListener = useOverlayListener({
target: elementRef,
overlay: overlayRef,
listener: function listener(event, _ref) {
var valid = _ref.valid;
valid && hide();
},
when: overlayVisibleState
}),
_useOverlayListener2 = _slicedToArray(_useOverlayListener, 2),
bindOverlayListener = _useOverlayListener2[0],
unbindOverlayListener = _useOverlayListener2[1];
var getLabel = function getLabel() {
return selectedNodes.length ? selectedNodes.map(function (node) {
return node.label;
}).join(', ') : props.placeholder;
};
var show = function show() {
setOverlayVisibleState(true);
};
var hide = function hide() {
setOverlayVisibleState(false);
};
var onInputFocus = function onInputFocus() {
setFocusedState(true);
};
var onInputBlur = function onInputBlur() {
setFocusedState(false);
};
var onClick = function onClick(event) {
if (!props.disabled && (!overlayRef.current || !overlayRef.current.contains(event.target)) && !DomHandler.hasClass(event.target, 'p-treeselect-close')) {
DomHandler.focus(focusInputRef.current);
overlayVisibleState ? hide() : show();
}
};
var onSelectionChange = function onSelectionChange(event) {
if (props.onChange) {
selfChange.current = true;
props.onChange({
originalEvent: event.originalEvent,
value: event.value,
stopPropagation: function stopPropagation() {},
preventDefault: function preventDefault() {},
target: {
name: props.name,
id: props.id,
value: event.value
}
});
}
};
var onNodeSelect = function onNodeSelect(node) {
props.onNodeSelect && props.onNodeSelect(node);
isSingleSelectionMode && hide();
};
var onNodeUnselect = function onNodeUnselect(node) {
props.onNodeUnselect && props.onNodeUnselect(node);
};
var onNodeToggle = function onNodeToggle(e) {
if (props.onToggle) {
props.onToggle(e);
} else {
setExpandedKeysState(e.value);
}
};
var onFilterValueChange = function onFilterValueChange(e) {
setFilterValueState(e.value);
};
var onOverlayClick = function onOverlayClick(event) {
OverlayService.emit('overlay-click', {
originalEvent: event,
target: elementRef.current
});
};
var onInputKeyDown = function onInputKeyDown(event) {
switch (event.which) {
//down
case 40:
if (!overlayVisibleState && event.altKey) {
show();
}
break;
//space
case 32:
if (!overlayVisibleState) {
show();
event.preventDefault();
}
break;
//enter and escape
case 13:
case 27:
if (overlayVisibleState) {
hide();
event.preventDefault();
}
break;
//tab
case 9:
hide();
break;
}
};
var onFilterInputKeyDown = function onFilterInputKeyDown(event) {
//enter
if (event.which === 13) {
event.preventDefault();
}
};
var onFilterInputChange = function onFilterInputChange(event) {
var value = event.target.value;
if (props.onFilterValueChange) {
props.onFilterValueChange({
originalEvent: event,
value: value
});
} else {
setFilterValueState(value);
}
};
var resetFilter = function resetFilter() {
setFilterValueState('');
};
var onOverlayEnter = function onOverlayEnter() {
ZIndexUtils.set('overlay', overlayRef.current, PrimeReact.autoZIndex, PrimeReact.zIndex['overlay']);
alignOverlay();
scrollInView();
};
var onOverlayEntered = function onOverlayEntered() {
bindOverlayListener();
if (props.filter && props.filterInputAutoFocus) {
DomHandler.focus(filterInputRef.current, props.filterInputAutoFocus);
}
props.onShow && props.onShow();
};
var onOverlayExit = function onOverlayExit() {
unbindOverlayListener();
};
var onOverlayExited = function onOverlayExited() {
if (props.filter && props.resetFilterOnHide) {
resetFilter();
}
ZIndexUtils.clear(overlayRef.current);
props.onHide && props.onHide();
};
var alignOverlay = function alignOverlay() {
DomHandler.alignOverlay(overlayRef.current, triggerRef.current.parentElement, props.appendTo || PrimeReact.appendTo);
};
var scrollInView = function scrollInView() {
var highlightItem = DomHandler.findSingle(overlayRef.current, '.p-treenode-content.p-highlight');
if (highlightItem && highlightItem.scrollIntoView) {
highlightItem.scrollIntoView({
block: 'nearest',
inline: 'start'
});
}
};
var findSelectedNodes = function findSelectedNodes(node, keys, selectedNodes) {
if (node) {
if (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;
findSelectedNodes(childNode, keys, selectedNodes);
}
} catch (err) {
_iterator.e(err);
} finally {
_iterator.f();
}
}
} else {
var _iterator2 = _createForOfIteratorHelper$4(props.options),
_step2;
try {
for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
var _childNode = _step2.value;
findSelectedNodes(_childNode, keys, selectedNodes);
}
} catch (err) {
_iterator2.e(err);
} finally {
_iterator2.f();
}
}
};
var isSelected = function isSelected(node, keys) {
return isCheckboxSelectionMode ? keys[node.key] && keys[node.key].checked : keys[node.key];
};
var updateTreeState = function updateTreeState() {
var keys = isSingleSelectionMode ? _defineProperty({}, "".concat(props.value), true) : _objectSpread$3({}, props.value);
setExpandedKeysState({});
if (keys && props.options) {
updateTreeBranchState(null, null, keys);
}
};
var updateTreeBranchState = function updateTreeBranchState(node, path, keys) {
if (node) {
if (isSelected(node, keys)) {
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);
updateTreeBranchState(childNode, path, keys);
}
} catch (err) {
_iterator3.e(err);
} finally {
_iterator3.f();
}
}
} else {
var _iterator4 = _createForOfIteratorHelper$4(props.options),
_step4;
try {
for (_iterator4.s(); !(_step4 = _iterator4.n()).done;) {
var _childNode2 = _step4.value;
updateTreeBranchState(_childNode2, [], keys);
}
} catch (err) {
_iterator4.e(err);
} finally {
_iterator4.f();
}
}
};
var expandPath = function expandPath(path) {
if (path.length > 0) {
var _expandedKeys = _objectSpread$3({}, expandedKeysState || {});
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();
}
setExpandedKeysState(_expandedKeys);
}
};
var getSelectedNodes = function getSelectedNodes() {
var selectedNodes = [];
if (ObjectUtils.isNotEmpty(props.value) && props.options) {
var keys = isSingleSelectionMode ? _defineProperty({}, "".concat(props.value), true) : _objectSpread$3({}, props.value);
findSelectedNodes(null, keys, selectedNodes);
}
return selectedNodes;
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
focus: function focus() {
return DomHandler.focus(focusInputRef.current);
},
getElement: function getElement() {
return elementRef.current;
}
};
});
React__namespace.useEffect(function () {
ObjectUtils.combinedRefs(focusInputRef, props.inputRef);
}, [focusInputRef, props.inputRef]);
useMountEffect(function () {
updateTreeState();
});
useUpdateEffect(function () {
if (overlayVisibleState && props.filter) {
alignOverlay();
}
});
useUpdateEffect(function () {
updateTreeState();
}, [props.options]);
useUpdateEffect(function () {
if (overlayVisibleState && expandedKeysState) {
alignOverlay();
}
}, [expandedKeysState]);
useUpdateEffect(function () {
if (overlayVisibleState) {
if (!selfChange.current) {
updateTreeState();
}
selfChange.current = false;
}
}, [props.value]);
useUnmountEffect(function () {
ZIndexUtils.clear(overlayRef.current);
});
var createKeyboardHelper = function createKeyboardHelper() {
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-hidden-accessible"
}, /*#__PURE__*/React__namespace.createElement("input", _extends({
ref: focusInputRef,
role: "listbox",
id: props.inputId,
type: "text",
readOnly: true,
"aria-expanded": overlayVisibleState,
onFocus: onInputFocus,
onBlur: onInputBlur,
onKeyDown: onInputKeyDown,
disabled: props.disabled,
tabIndex: props.tabIndex
}, ariaProps)));
};
var createLabel = function createLabel() {
var labelClassName = classNames('p-treeselect-label', {
'p-placeholder': getLabel() === props.placeholder,
'p-treeselect-label-empty': !props.placeholder && isValueEmpty
});
var content = null;
if (props.valueTemplate) {
content = ObjectUtils.getJSXElement(props.valueTemplate, selectedNodes, props);
} else {
if (props.display === 'comma') {
content = getLabel() || 'empty';
} else if (props.display === 'chip') {
content = /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, selectedNodes && selectedNodes.map(function (node, index) {
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-treeselect-token",
key: "".concat(node.key, "_").concat(index)
}, /*#__PURE__*/React__namespace.createElement("span", {
className: "p-treeselect-token-label"
}, node.label));
}), isValueEmpty && (props.placeholder || 'empty'));
}
}
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-treeselect-label-container"
}, /*#__PURE__*/React__namespace.createElement("div", {
className: labelClassName
}, content));
};
var createDropdownIcon = function createDropdownIcon() {
var iconClassName = classNames('p-treeselect-trigger-icon p-clickable', props.dropdownIcon);
return /*#__PURE__*/React__namespace.createElement("div", {
ref: triggerRef,
className: "p-treeselect-trigger",
role: "button",
"aria-haspopup": "listbox",
"aria-expanded": overlayVisibleState
}, /*#__PURE__*/React__namespace.createElement("span", {
className: iconClassName
}));
};
var createContent = function createContent() {
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement(Tree, {
value: props.options,
selectionMode: props.selectionMode,
selectionKeys: props.value,
metaKeySelection: props.metaKeySelection,
onSelectionChange: onSelectionChange,
onSelect: onNodeSelect,
onUnselect: onNodeUnselect,
expandedKeys: expandedKeys,
onToggle: onNodeToggle,
onExpand: props.onNodeExpand,
onCollapse: props.onNodeCollapse,
filter: props.filter,
filterValue: filteredValue,
filterBy: props.filterBy,
filterMode: props.filterMode,
filterPlaceholder: props.filterPlaceholder,
filterLocale: props.filterLocale,
showHeader: false,
onFilterValueChange: onFilterValueChange
}), hasNoOptions && /*#__PURE__*/React__namespace.createElement("div", {
className: "p-treeselect-empty-message"
}, props.emptyMessage || localeOption('emptyMessage')));
};
var createFilterElement = function createFilterElement() {
if (props.filter) {
var filterValue = ObjectUtils.isNotEmpty(filteredValue) ? filteredValue : '';
var filterContent = /*#__PURE__*/React__namespace.createElement("div", {
className: "p-treeselect-filter-container"
}, /*#__PURE__*/React__namespace.createElement("input", {
ref: filterInputRef,
type: "text",
value: filterValue,
autoComplete: "off",
className: "p-treeselect-filter p-inputtext p-component",
placeholder: props.filterPlaceholder,
onKeyDown: onFilterInputKeyDown,
onChange: onFilterInputChange,
disabled: props.disabled
}), /*#__PURE__*/React__namespace.createElement("span", {
className: "p-treeselect-filter-icon pi pi-search"
}));
if (props.filterTemplate) {
var defaultContentOptions = {
className: 'p-treeselect-filter-container',
element: filterContent,
filterOptions: filterOptions,
filterInputKeyDown: onFilterInputKeyDown,
filterInputChange: onFilterInputChange,
filterIconClassName: 'p-dropdown-filter-icon pi pi-search',
props: props
};
filterContent = ObjectUtils.getJSXElement(props.filterTemplate, defaultContentOptions);
}
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, filterContent);
}
};
var createHeader = function createHeader() {
var filterElement = createFilterElement();
var closeElement = /*#__PURE__*/React__namespace.createElement("button", {
type: "button",
className: "p-treeselect-close p-link",
onClick: hide,
"aria-label": localeOption('close')
}, /*#__PURE__*/React__namespace.createElement("span", {
className: "p-treeselect-close-icon pi pi-times",
"aria-hidden": "true"
}), /*#__PURE__*/React__namespace.createElement(Ripple, null));
var content = /*#__PURE__*/React__namespace.createElement("div", {
className: "p-treeselect-header"
}, filterElement, closeElement);
if (props.panelHeaderTemplate) {
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: hide,
element: content,
props: props
};
return ObjectUtils.getJSXElement(props.panelHeaderTemplate, defaultOptions);
}
return content;
};
var createFooter = function createFooter() {
return ObjectUtils.getJSXElement(props.panelFooterTemplate, props);
};
var selectedNodes = getSelectedNodes();
var otherProps = TreeSelectBase.getOtherProps(props);
var ariaProps = ObjectUtils.reduceKeys(otherProps, DomHandler.ARIA_PROPS);
var className = classNames('p-treeselect p-component p-inputwrapper', {
'p-treeselect-chip': props.display === 'chip',
'p-disabled': props.disabled,
'p-focus': focusedState,
'p-inputwrapper-filled': !isValueEmpty,
'p-inputwrapper-focus': focusedState || overlayVisibleState
}, props.className);
var keyboardHelper = createKeyboardHelper();
var labelElement = createLabel();
var dropdownIcon = createDropdownIcon();
var content = createContent();
var header = createHeader();
var footer = createFooter();
return /*#__PURE__*/React__namespace.createElement("div", _extends({
ref: elementRef,
className: className,
style: props.style
}, otherProps, {
onClick: onClick
}), keyboardHelper, labelElement, dropdownIcon, /*#__PURE__*/React__namespace.createElement(TreeSelectPanel, {
ref: overlayRef,
appendTo: props.appendTo,
panelStyle: props.panelStyle,
panelClassName: props.panelClassName,
scrollHeight: props.scrollHeight,
onClick: onOverlayClick,
header: header,
footer: footer,
transitionOptions: props.transitionOptions,
"in": overlayVisibleState,
onEnter: onOverlayEnter,
onEntered: onOverlayEntered,
onExit: onOverlayExit,
onExited: onOverlayExited
}, content));
}));
TreeSelect.displayName = 'TreeSelect';
var TreeTableBase = {
defaultProps: {
__TYPE: 'TreeTable',
alwaysShowPaginator: true,
className: null,
columnResizeMode: 'fit',
contextMenuSelectionKey: null,
currentPageReportTemplate: '({currentPage} of {totalPages})',
defaultSortOrder: 1,
emptyMessage: null,
expandedKeys: null,
filterDelay: 300,
filterLocale: undefined,
filterMode: 'lenient',
filters: null,
first: null,
footer: null,
footerColumnGroup: null,
frozenFooterColumnGroup: null,
frozenHeaderColumnGroup: null,
frozenWidth: null,
globalFilter: null,
globalFilterMatchMode: FilterMatchMode.CONTAINS,
header: null,
headerColumnGroup: null,
id: null,
lazy: false,
loading: false,
loadingIcon: 'pi pi-spinner',
metaKeySelection: true,
multiSortMeta: null,
onColReorder: null,
onCollapse: null,
onColumnResizeEnd: null,
onContextMenu: null,
onContextMenuSelectionChange: null,
onExpand: null,
onFilter: null,
onPage: null,
onRowClick: null,
onSelect: null,
onSelectionChange: null,
onSort: null,
onToggle: null,
onUnselect: null,
pageLinkSize: 5,
paginator: false,
paginatorClassName: null,
paginatorDropdownAppendTo: null,
paginatorLeft: null,
paginatorPosition: 'bottom',
paginatorRight: null,
paginatorTemplate: 'FirstPageLink PrevPageLink PageLinks NextPageLink LastPageLink RowsPerPageDropdown',
propagateSelectionDown: true,
propagateSelectionUp: true,
removableSort: false,
reorderableColumns: false,
resizableColumns: false,
rowClassName: null,
rowHover: false,
rows: null,
rowsPerPageOptions: null,
scrollHeight: null,
scrollable: false,
selectOnEdit: true,
selectionKeys: null,
selectionMode: null,
showGridlines: false,
sortField: null,
sortMode: 'single',
sortOrder: null,
stripedRows: false,
style: null,
tabIndex: 0,
tableClassName: null,
tableStyle: null,
totalRecords: null,
value: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, TreeTableBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, TreeTableBase.defaultProps);
}
};
var TreeTableBodyCell = function TreeTableBodyCell(props) {
var _React$useState = React__namespace.useState(false),
_React$useState2 = _slicedToArray(_React$useState, 2),
editingState = _React$useState2[0],
setEditingState = _React$useState2[1];
var elementRef = React__namespace.useRef(null);
var keyHelperRef = React__namespace.useRef(null);
var selfClick = React__namespace.useRef(false);
var overlayEventListener = React__namespace.useRef(null);
var tabIndexTimeout = React__namespace.useRef(null);
var _useEventListener = useEventListener({
type: 'click',
listener: function listener(e) {
if (!selfClick.current && isOutsideClicked(e.target)) {
switchCellToViewMode(e);
}
selfClick.current = false;
}
}),
_useEventListener2 = _slicedToArray(_useEventListener, 2),
bindDocumentClickListener = _useEventListener2[0],
unbindDocumentClickListener = _useEventListener2[1];
var onClick = function onClick() {
if (props.editor && !editingState && (props.selectOnEdit || !props.selectOnEdit && props.selected)) {
selfClick.current = true;
setEditingState(true);
bindDocumentClickListener();
overlayEventListener.current = function (e) {
if (!isOutsideClicked(e.target)) {
selfClick.current = true;
}
};
OverlayService.on('overlay-click', overlayEventListener.current);
}
};
var onKeyDown = function onKeyDown(event) {
if (event.which === 13 || event.which === 9) {
switchCellToViewMode(event);
}
};
var isOutsideClicked = function isOutsideClicked(target) {
return elementRef.current && !(elementRef.current.isSameNode(target) || elementRef.current.contains(target));
};
var closeCell = function closeCell() {
/* When using the 'tab' key, the focus event of the next cell is not called in IE. */
setTimeout(function () {
setEditingState(false);
unbindDocumentClickListener();
OverlayService.off('overlay-click', overlayEventListener.current);
overlayEventListener.current = null;
}, 1);
};
var onEditorFocus = function onEditorFocus(event) {
onClick();
};
var switchCellToViewMode = function switchCellToViewMode(event) {
if (props.cellEditValidator) {
var valid = props.cellEditValidator({
originalEvent: event,
columnProps: props
});
if (valid) {
closeCell();
}
} else {
closeCell();
}
};
React__namespace.useEffect(function () {
if (elementRef.current && props.editor) {
clearTimeout(tabIndexTimeout.current);
if (editingState) {
var focusable = DomHandler.findSingle(elementRef.current, 'input');
if (focusable && document.activeElement !== focusable && !focusable.hasAttribute('data-isCellEditing')) {
focusable.setAttribute('data-isCellEditing', true);
focusable.focus();
}
keyHelperRef.current.tabIndex = -1;
} else {
tabIndexTimeout.current = setTimeout(function () {
if (keyHelperRef.current) {
keyHelperRef.current.setAttribute('tabindex', 0);
}
}, 50);
}
}
});
useUnmountEffect(function () {
if (overlayEventListener.current) {
OverlayService.off('overlay-click', overlayEventListener.current);
overlayEventListener.current = null;
}
});
var bodyClassName = ObjectUtils.getPropValue(props.bodyClassName, props.node.data, {
field: props.field,
rowIndex: props.rowIndex,
props: props
});
var className = classNames(bodyClassName || props.className, {
'p-editable-column': props.editor,
'p-cell-editing': props.editor ? editingState : false
});
var style = props.bodyStyle || props.style;
var content;
if (editingState) {
if (props.editor) content = ObjectUtils.getJSXElement(props.editor, {
node: props.node,
rowData: props.node.data,
value: ObjectUtils.resolveFieldData(props.node.data, props.field),
field: props.field,
rowIndex: props.rowIndex,
props: props
});else throw new Error('Editor is not found on column.');
} else {
if (props.body) content = ObjectUtils.getJSXElement(props.body, props.node, {
field: props.field,
rowIndex: props.rowIndex,
props: props
});else content = ObjectUtils.resolveFieldData(props.node.data, props.field);
}
/* eslint-disable */
var editorKeyHelper = props.editor && /*#__PURE__*/React__namespace.createElement("a", {
tabIndex: 0,
ref: keyHelperRef,
className: "p-cell-editor-key-helper p-hidden-accessible",
onFocus: onEditorFocus
}, /*#__PURE__*/React__namespace.createElement("span", null));
/* eslint-enable */
return /*#__PURE__*/React__namespace.createElement("td", {
ref: elementRef,
className: className,
style: style,
onClick: onClick,
onKeyDown: onKeyDown
}, props.children, editorKeyHelper, content);
};
TreeTableBodyCell.displayName = 'TreeTableBodyCell';
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 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; }
var TreeTableRow = /*#__PURE__*/React__namespace.memo(function (props) {
var elementRef = React__namespace.useRef(null);
var checkboxRef = React__namespace.useRef(null);
var checkboxBoxRef = React__namespace.useRef(null);
var nodeTouched = React__namespace.useRef(false);
var expanded = props.expandedKeys ? props.expandedKeys[props.node.key] !== undefined : false;
var getColumnProp = function getColumnProp(column, name) {
return ColumnBase.getCProp(column, name);
};
var onTogglerClick = function onTogglerClick(event) {
expanded ? collapse(event) : expand(event);
event.preventDefault();
event.stopPropagation();
};
var expand = function expand(event) {
var expandedKeys = props.expandedKeys ? _objectSpread$2({}, props.expandedKeys) : {};
expandedKeys[props.node.key] = true;
props.onToggle({
originalEvent: event,
value: expandedKeys
});
invokeToggleEvents(event, true);
};
var collapse = function collapse(event) {
var expandedKeys = _objectSpread$2({}, props.expandedKeys);
delete expandedKeys[props.node.key];
props.onToggle({
originalEvent: event,
value: expandedKeys
});
invokeToggleEvents(event, false);
};
var invokeToggleEvents = function invokeToggleEvents(event, expanded) {
if (expanded) {
if (props.onExpand) {
props.onExpand({
originalEvent: event,
node: props.node
});
}
} else {
if (props.onCollapse) {
props.onCollapse({
originalEvent: event,
node: props.node
});
}
}
};
var onClick = function onClick(event) {
if (props.onRowClick) {
props.onRowClick(event, props.node);
}
nodeTouched.current = false;
};
var onTouchEnd = function onTouchEnd() {
nodeTouched.current = true;
};
var onCheckboxChange = function onCheckboxChange(event) {
var checked = isChecked();
var selectionKeys = props.selectionKeys ? _objectSpread$2({}, props.selectionKeys) : {};
if (checked) {
if (props.propagateSelectionDown) propagateDown(props.node, false, selectionKeys);else delete selectionKeys[props.node.key];
if (props.propagateSelectionUp && props.onPropagateUp) {
props.onPropagateUp({
originalEvent: event,
check: false,
selectionKeys: selectionKeys
});
}
if (props.onUnselect) {
props.onUnselect({
originalEvent: event,
node: props.node
});
}
} else {
if (props.propagateSelectionDown) propagateDown(props.node, true, selectionKeys);else selectionKeys[props.node.key] = {
checked: true
};
if (props.propagateSelectionUp && props.onPropagateUp) {
props.onPropagateUp({
originalEvent: event,
check: true,
selectionKeys: selectionKeys
});
}
if (props.onSelect) {
props.onSelect({
originalEvent: event,
node: props.node
});
}
}
if (props.onSelectionChange) {
props.onSelectionChange({
originalEvent: event,
value: selectionKeys
});
}
DomHandler.clearSelection();
};
var onCheckboxFocus = function onCheckboxFocus() {
DomHandler.addClass(checkboxBoxRef.current, 'p-focus');
DomHandler.addClass(checkboxRef.current, 'p-checkbox-focused');
};
var onCheckboxBlur = function onCheckboxBlur() {
DomHandler.removeClass(checkboxBoxRef.current, 'p-focus');
DomHandler.removeClass(checkboxRef.current, 'p-checkbox-focused');
};
var propagateUp = function propagateUp(event) {
var check = event.check;
var selectionKeys = event.selectionKeys;
var checkedChildCount = 0;
var childPartialSelected = false;
var _iterator = _createForOfIteratorHelper$3(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 === props.node.children.length) {
selectionKeys[props.node.key] = {
checked: true,
partialChecked: false
};
} else {
if (!check) {
delete selectionKeys[props.node.key];
}
if (childPartialSelected || checkedChildCount > 0 && checkedChildCount !== props.node.children.length) selectionKeys[props.node.key] = {
checked: false,
partialChecked: true
};else selectionKeys[props.node.key] = {
checked: false,
partialChecked: false
};
}
if (props.propagateSelectionUp && props.onPropagateUp) {
props.onPropagateUp(event);
}
};
var propagateDown = 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++) {
propagateDown(node.children[i], check, selectionKeys);
}
}
};
var onRightClick = function onRightClick(event) {
DomHandler.clearSelection();
if (props.onContextMenuSelectionChange) {
props.onContextMenuSelectionChange({
originalEvent: event,
value: props.node.key
});
}
if (props.onContextMenu) {
props.onContextMenu({
originalEvent: event,
node: props.node
});
}
};
var onKeyDown = function onKeyDown(event) {
if (event.target === elementRef.current) {
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 (!expanded) {
expand(event);
}
event.preventDefault();
break;
//left arrow
case 37:
if (expanded) {
collapse(event);
}
event.preventDefault();
break;
//enter
case 13:
onClick(event);
event.preventDefault();
break;
}
}
};
var isSelected = function isSelected() {
if ((props.selectionMode === 'single' || props.selectionMode === 'multiple') && props.selectionKeys) return props.selectionMode === 'single' ? props.selectionKeys === props.node.key : props.selectionKeys[props.node.key] !== undefined;else return false;
};
var isChecked = function isChecked() {
return props.selectionKeys ? props.selectionKeys[props.node.key] && props.selectionKeys[props.node.key].checked : false;
};
var isPartialChecked = function isPartialChecked() {
return props.selectionKeys ? props.selectionKeys[props.node.key] && props.selectionKeys[props.node.key].partialChecked : false;
};
var createToggler = function createToggler() {
var label = expanded ? ariaLabel('collapseLabel') : ariaLabel('expandLabel');
var iconClassName = classNames('p-treetable-toggler-icon pi pi-fw', {
'pi-chevron-right': !expanded,
'pi-chevron-down': expanded
});
var style = {
marginLeft: props.level * 16 + 'px',
visibility: props.node.leaf === false || props.node.children && props.node.children.length ? 'visible' : 'hidden'
};
return /*#__PURE__*/React__namespace.createElement("button", {
type: "button",
className: "p-treetable-toggler p-link p-unselectable-text",
onClick: onTogglerClick,
tabIndex: -1,
style: style,
"aria-label": label
}, /*#__PURE__*/React__namespace.createElement("i", {
className: iconClassName,
"aria-hidden": "true"
}), /*#__PURE__*/React__namespace.createElement(Ripple, null));
};
var createCheckbox = function createCheckbox() {
if (props.selectionMode === 'checkbox' && props.node.selectable !== false) {
var checked = isChecked();
var partialChecked = 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__namespace.createElement("div", {
className: "p-checkbox p-treetable-checkbox p-component",
ref: checkboxRef,
onClick: onCheckboxChange,
role: "checkbox",
"aria-checked": checked
}, /*#__PURE__*/React__namespace.createElement("div", {
className: "p-hidden-accessible"
}, /*#__PURE__*/React__namespace.createElement("input", {
type: "checkbox",
onFocus: onCheckboxFocus,
onBlur: onCheckboxBlur
})), /*#__PURE__*/React__namespace.createElement("div", {
className: _className,
ref: checkboxBoxRef
}, /*#__PURE__*/React__namespace.createElement("span", {
className: icon
})));
} else {
return null;
}
};
var createCell = function createCell(column, index) {
var toggler, checkbox;
if (getColumnProp(column, 'expander')) {
toggler = createToggler();
checkbox = createCheckbox();
}
return /*#__PURE__*/React__namespace.createElement(TreeTableBodyCell, _extends({
key: "".concat(getColumnProp(column, 'columnKey') || getColumnProp(column, 'field'), "_").concat(index)
}, ColumnBase.getCProps(column), {
column: column,
selectOnEdit: props.selectOnEdit,
selected: isSelected(),
node: props.node,
rowIndex: props.rowIndex
}), toggler, checkbox);
};
var createChildren = function createChildren() {
if (expanded && props.node.children) {
return props.node.children.map(function (childNode, index) {
return /*#__PURE__*/React__namespace.createElement(TreeTableRow, {
key: "".concat(childNode.key || JSON.stringify(childNode.data), "_").concat(index),
level: props.level + 1,
rowIndex: props.rowIndex + '_' + index,
node: childNode,
columns: props.columns,
expandedKeys: props.expandedKeys,
selectOnEdit: props.selectOnEdit,
onToggle: props.onToggle,
onExpand: props.onExpand,
onCollapse: props.onCollapse,
selectionMode: props.selectionMode,
selectionKeys: props.selectionKeys,
onSelectionChange: props.onSelectionChange,
metaKeySelection: props.metaKeySelection,
onRowClick: props.onRowClick,
onSelect: props.onSelect,
onUnselect: props.onUnselect,
propagateSelectionUp: props.propagateSelectionUp,
propagateSelectionDown: props.propagateSelectionDown,
onPropagateUp: propagateUp,
rowClassName: props.rowClassName,
contextMenuSelectionKey: props.contextMenuSelectionKey,
onContextMenuSelectionChange: props.onContextMenuSelectionChange,
onContextMenu: props.onContextMenu
});
});
} else {
return null;
}
};
var cells = props.columns.map(createCell);
var children = createChildren();
var className = {
'p-highlight': isSelected(),
'p-highlight-contextmenu': props.contextMenuSelectionKey && props.contextMenuSelectionKey === props.node.key
};
if (props.rowClassName) {
var rowClassName = props.rowClassName(props.node);
className = _objectSpread$2(_objectSpread$2({}, className), rowClassName);
}
className = classNames(className, props.node.className);
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement("tr", {
ref: elementRef,
tabIndex: 0,
className: className,
style: props.node.style,
onClick: onClick,
onTouchEnd: onTouchEnd,
onContextMenu: onRightClick,
onKeyDown: onKeyDown
}, cells), children);
});
TreeTableRow.displayName = 'TreeTableRow';
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 _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; }
var TreeTableBody = /*#__PURE__*/React__namespace.memo(function (props) {
var isSingleSelectionMode = props.selectionMode === 'single';
var isMultipleSelectionMode = props.selectionMode === 'multiple';
var flattenizeTree = function flattenizeTree(nodes) {
var rows = [];
nodes = nodes || props.value;
var _iterator = _createForOfIteratorHelper$2(nodes),
_step;
try {
for (_iterator.s(); !(_step = _iterator.n()).done;) {
var node = _step.value;
rows.push(node.key);
if (isExpandedKey(node.key)) {
rows = rows.concat(flattenizeTree(node.children));
}
}
} catch (err) {
_iterator.e(err);
} finally {
_iterator.f();
}
return rows;
};
var isExpandedKey = function isExpandedKey(key) {
return props.expandedKeys && !!props.expandedKeys[key];
};
var onRowClick = function onRowClick(event, node) {
if (props.onRowClick) {
props.onRowClick({
originalEvent: event,
node: node
});
}
var targetNode = event.target.nodeName;
if (targetNode === 'INPUT' || targetNode === 'BUTTON' || targetNode === 'A' || DomHandler.hasClass(event.target, 'p-clickable')) {
return;
}
if ((isSingleSelectionMode || isMultipleSelectionMode) && node.selectable !== false) {
var selectionKeys;
var selected = isSelected(node);
var metaSelection = props.metaKeySelection;
var flatKeys = flattenizeTree();
var rowIndex = flatKeys.findIndex(function (key) {
return key === node.key;
});
if (isMultipleSelectionMode && event.shiftKey) {
DomHandler.clearSelection();
// find first selected row
var anchorRowIndex = flatKeys.findIndex(function (key) {
return props.selectionKeys[key];
});
var rangeStart = Math.min(rowIndex, anchorRowIndex);
var rangeEnd = Math.max(rowIndex, anchorRowIndex);
selectionKeys = _objectSpread$1({}, props.selectionKeys);
for (var i = rangeStart; i <= rangeEnd; i++) {
var rowKey = flatKeys[i];
selectionKeys[rowKey] = true;
}
} else {
//anchorRowIndex = rowIndex;
if (metaSelection) {
var metaKey = event.metaKey || event.ctrlKey;
if (selected && metaKey) {
if (isSingleSelectionMode) {
selectionKeys = null;
} else {
selectionKeys = _objectSpread$1({}, props.selectionKeys);
delete selectionKeys[node.key];
}
if (props.onUnselect) {
props.onUnselect({
originalEvent: event,
node: node
});
}
} else {
if (isSingleSelectionMode) {
selectionKeys = node.key;
} else if (isMultipleSelectionMode) {
selectionKeys = !metaKey ? {} : props.selectionKeys ? _objectSpread$1({}, props.selectionKeys) : {};
selectionKeys[node.key] = true;
}
if (props.onSelect) {
props.onSelect({
originalEvent: event,
node: node
});
}
}
} else {
if (isSingleSelectionMode) {
if (selected) {
selectionKeys = null;
if (props.onUnselect) {
props.onUnselect({
originalEvent: event,
node: node
});
}
} else {
selectionKeys = node.key;
if (props.onSelect) {
props.onSelect({
originalEvent: event,
node: node
});
}
}
} else {
if (selected) {
selectionKeys = _objectSpread$1({}, props.selectionKeys);
delete selectionKeys[node.key];
if (props.onUnselect) {
props.onUnselect({
originalEvent: event,
node: node
});
}
} else {
selectionKeys = props.selectionKeys ? _objectSpread$1({}, props.selectionKeys) : {};
selectionKeys[node.key] = true;
if (props.onSelect) {
props.onSelect({
originalEvent: event,
node: node
});
}
}
}
}
}
if (props.onSelectionChange) {
props.onSelectionChange({
originalEvent: event,
value: selectionKeys
});
}
}
};
var isSelected = function isSelected(node) {
if ((isSingleSelectionMode || isMultipleSelectionMode) && props.selectionKeys) return isSingleSelectionMode ? props.selectionKeys === node.key : props.selectionKeys[node.key] !== undefined;else return false;
};
var createRow = function createRow(node, index) {
return /*#__PURE__*/React__namespace.createElement(TreeTableRow, {
key: "".concat(node.key || JSON.stringify(node.data), "_").concat(index),
level: 0,
rowIndex: index,
selectOnEdit: props.selectOnEdit,
node: node,
columns: props.columns,
expandedKeys: props.expandedKeys,
onToggle: props.onToggle,
onExpand: props.onExpand,
onCollapse: props.onCollapse,
selectionMode: props.selectionMode,
selectionKeys: props.selectionKeys,
onSelectionChange: props.onSelectionChange,
metaKeySelection: props.metaKeySelection,
onRowClick: onRowClick,
onSelect: props.onSelect,
onUnselect: props.onUnselect,
propagateSelectionUp: props.propagateSelectionUp,
propagateSelectionDown: props.propagateSelectionDown,
rowClassName: props.rowClassName,
contextMenuSelectionKey: props.contextMenuSelectionKey,
onContextMenuSelectionChange: props.onContextMenuSelectionChange,
onContextMenu: props.onContextMenu
});
};
var createRows = function createRows() {
if (props.paginator && !props.lazy) {
var rpp = props.rows || 0;
var startIndex = props.first || 0;
var endIndex = startIndex + rpp;
var rows = [];
for (var i = startIndex; i < endIndex; i++) {
var rowData = props.value[i];
if (rowData) rows.push(createRow(props.value[i]));else break;
}
return rows;
} else {
return props.value.map(createRow);
}
};
var createEmptyMessage = function createEmptyMessage() {
if (props.loading) {
return null;
} else {
var colSpan = props.columns ? props.columns.length : null;
var _content = props.emptyMessage || localeOption('emptyMessage');
return /*#__PURE__*/React__namespace.createElement("tr", null, /*#__PURE__*/React__namespace.createElement("td", {
className: "p-treetable-emptymessage",
colSpan: colSpan
}, _content));
}
};
var content = props.value && props.value.length ? createRows() : createEmptyMessage();
return /*#__PURE__*/React__namespace.createElement("tbody", {
className: "p-treetable-tbody"
}, content);
});
TreeTableBody.displayName = 'TreeTableBody';
var TreeTableFooter = /*#__PURE__*/React__namespace.memo(function (props) {
var getColumnProp = function getColumnProp(column, name) {
return ColumnBase.getCProp(column, name);
};
var createFooterCell = function createFooterCell(column, index) {
return /*#__PURE__*/React__namespace.createElement("td", {
key: column.field || index,
className: getColumnProp(column, 'footerClassName') || getColumnProp(column, 'className'),
style: getColumnProp(column, 'footerStyle') || getColumnProp(column, 'style'),
rowSpan: getColumnProp(column, 'rowSpan'),
colSpan: getColumnProp(column, 'colSpan')
}, getColumnProp(column, 'footer'));
};
var createFooterRow = function createFooterRow(row, index) {
var rowColumns = React__namespace.Children.toArray(RowBase.getCProp(row, 'children'));
var rowFooterCells = rowColumns.map(createFooterCell);
return /*#__PURE__*/React__namespace.createElement("tr", {
key: index
}, rowFooterCells);
};
var createColumnGroup = function createColumnGroup() {
var rows = React__namespace.Children.toArray(ColumnGroupBase.getCProp(props.columnGroup, 'children'));
return rows.map(createFooterRow);
};
var createColumns = function createColumns(columns) {
if (columns) {
var headerCells = columns.map(createFooterCell);
return /*#__PURE__*/React__namespace.createElement("tr", null, headerCells);
} else {
return null;
}
};
var hasFooter = function hasFooter() {
if (props.columnGroup) {
return true;
} else {
for (var i = 0; i < props.columns.length; i++) {
if (getColumnProp(props.columns[i], 'footer')) {
return true;
}
}
}
return false;
};
var content = props.columnGroup ? createColumnGroup() : createColumns(props.columns);
if (hasFooter()) {
return /*#__PURE__*/React__namespace.createElement("tfoot", {
className: "p-treetable-tfoot"
}, content);
} else {
return null;
}
});
TreeTableFooter.displayName = 'TreeTableFooter';
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; }
var TreeTableHeader = /*#__PURE__*/React__namespace.memo(function (props) {
var filterTimeout = React__namespace.useRef(null);
var onHeaderClick = function onHeaderClick(event, column) {
if (getColumnProp(column, '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')) {
props.onSort({
originalEvent: event,
sortField: getColumnProp(column, 'sortField') || getColumnProp(column, 'field'),
sortFunction: getColumnProp(column, 'sortFunction'),
sortable: getColumnProp(column, 'sortable')
});
DomHandler.clearSelection();
}
}
};
var onHeaderMouseDown = function onHeaderMouseDown(event, column) {
if (props.reorderableColumns && getColumnProp(column, 'reorderable')) {
if (event.target.nodeName !== 'INPUT') event.currentTarget.draggable = true;else if (event.target.nodeName === 'INPUT') event.currentTarget.draggable = false;
}
};
var onHeaderKeyDown = function onHeaderKeyDown(event, column) {
if (event.key === 'Enter') {
onHeaderClick(event, column);
event.preventDefault();
}
};
var getMultiSortMetaDataIndex = function getMultiSortMetaDataIndex(column) {
if (props.multiSortMeta) {
for (var i = 0; i < props.multiSortMeta.length; i++) {
if (props.multiSortMeta[i].field === getColumnProp(column, 'field')) {
return i;
}
}
}
return -1;
};
var onResizerMouseDown = function onResizerMouseDown(event, column) {
if (props.resizableColumns && props.onResizeStart) {
props.onResizeStart({
originalEvent: event,
columnEl: event.target.parentElement,
column: column
});
}
};
var _onDragStart = function onDragStart(event, column) {
if (props.onDragStart) {
props.onDragStart({
originalEvent: event,
column: column
});
}
};
var _onDragOver = function onDragOver(event, column) {
if (props.onDragOver) {
props.onDragOver({
originalEvent: event,
column: column
});
}
};
var _onDragLeave = function onDragLeave(event, column) {
if (props.onDragLeave) {
props.onDragLeave({
originalEvent: event,
column: column
});
}
};
var _onDrop = function onDrop(event, column) {
if (props.onDrop) {
props.onDrop({
originalEvent: event,
column: column
});
}
};
var onFilterInput = function onFilterInput(e, column) {
if (getColumnProp(column, 'filter') && props.onFilter) {
if (filterTimeout.current) {
clearTimeout(filterTimeout.current);
}
var filterValue = e.target.value;
filterTimeout.current = setTimeout(function () {
props.onFilter({
value: filterValue,
field: getColumnProp(column, 'field'),
matchMode: getColumnProp(column, 'filterMatchMode') || 'startsWith'
});
filterTimeout.current = null;
}, props.filterDelay);
}
};
var hasColumnFilter = function hasColumnFilter(columns) {
if (columns) {
var _iterator = _createForOfIteratorHelper$1(columns),
_step;
try {
for (_iterator.s(); !(_step = _iterator.n()).done;) {
var col = _step.value;
if (getColumnProp(col, 'filter')) {
return true;
}
}
} catch (err) {
_iterator.e(err);
} finally {
_iterator.f();
}
}
return false;
};
var getAriaSort = function getAriaSort(column, sorted, sortOrder) {
if (getColumnProp(column, '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;
}
};
var getColumnProp = function getColumnProp(column) {
return column ? typeof (arguments.length <= 1 ? undefined : arguments[1]) === 'string' ? ColumnBase.getCProp(column, arguments.length <= 1 ? undefined : arguments[1]) : ColumnBase.getCProp((arguments.length <= 1 ? undefined : arguments[1]) || column, arguments.length <= 2 ? undefined : arguments[2]) : null;
};
var createSortIcon = function createSortIcon(column, sorted, sortOrder) {
if (getColumnProp(column, '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__namespace.createElement("span", {
className: sortIconClassName
});
} else {
return null;
}
};
var createResizer = function createResizer(column) {
if (props.resizableColumns) {
return /*#__PURE__*/React__namespace.createElement("span", {
className: "p-column-resizer p-clickable",
onMouseDown: function onMouseDown(e) {
return onResizerMouseDown(e, column);
}
});
} else {
return null;
}
};
var createSortBadge = function createSortBadge(sortMetaDataIndex) {
if (sortMetaDataIndex !== -1 && props.multiSortMeta && props.multiSortMeta.length > 1) {
return /*#__PURE__*/React__namespace.createElement("span", {
className: "p-sortable-column-badge"
}, sortMetaDataIndex + 1);
}
return null;
};
var createHeaderCell = function createHeaderCell(column, options) {
var filterElement;
if (getColumnProp(column, 'filter') && options.renderFilter) {
filterElement = getColumnProp(column, 'filterElement') || /*#__PURE__*/React__namespace.createElement(InputText, {
onInput: function onInput(e) {
return onFilterInput(e, column);
},
type: props.filterType,
defaultValue: props.filters && props.filters[getColumnProp(column, 'field')] ? props.filters[getColumnProp(column, 'field')].value : null,
className: "p-column-filter",
placeholder: getColumnProp(column, 'filterPlaceholder'),
maxLength: getColumnProp(column, 'filterMaxLength')
});
}
if (options.filterOnly) {
return /*#__PURE__*/React__namespace.createElement("th", {
key: getColumnProp(column, 'columnKey') || getColumnProp(column, 'field') || options.index,
className: classNames('p-filter-column', getColumnProp(column, 'filterHeaderClassName')),
style: getColumnProp(column, 'filterHeaderStyle') || getColumnProp(column, 'style'),
rowSpan: getColumnProp(column, 'rowSpan'),
colSpan: getColumnProp(column, 'colSpan')
}, filterElement);
} else {
var headerCellRef = /*#__PURE__*/React__namespace.createRef(null);
var sortMetaDataIndex = getMultiSortMetaDataIndex(column);
var multiSortMetaData = sortMetaDataIndex !== -1 ? props.multiSortMeta[sortMetaDataIndex] : null;
var singleSorted = getColumnProp(column, 'field') === props.sortField;
var multipleSorted = multiSortMetaData !== null;
var sorted = getColumnProp(column, 'sortable') && (singleSorted || multipleSorted);
var sortOrder = 0;
if (singleSorted) sortOrder = props.sortOrder;else if (multipleSorted) sortOrder = multiSortMetaData.order;
var sortIconElement = createSortIcon(column, sorted, sortOrder);
var ariaSortData = getAriaSort(column, sorted, sortOrder);
var sortBadge = createSortBadge(sortMetaDataIndex);
var className = classNames(getColumnProp(column, 'headerClassName') || getColumnProp(column, 'className'), {
'p-sortable-column': getColumnProp(column, 'sortable'),
'p-highlight': sorted,
'p-resizable-column': props.resizableColumns && getColumnProp(column, 'resizeable')
});
var headerTooltip = getColumnProp(column, 'headerTooltip');
var hasTooltip = ObjectUtils.isNotEmpty(headerTooltip);
var resizer = createResizer(column);
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, {
key: column.columnKey || column.field || options.index
}, /*#__PURE__*/React__namespace.createElement("th", {
ref: headerCellRef,
className: className,
style: getColumnProp(column, 'headerStyle') || getColumnProp(column, 'style'),
tabIndex: getColumnProp(column, 'sortable') ? props.tabIndex : null,
onClick: function onClick(e) {
return onHeaderClick(e, column);
},
onMouseDown: function onMouseDown(e) {
return onHeaderMouseDown(e, column);
},
onKeyDown: function onKeyDown(e) {
return onHeaderKeyDown(e, column);
},
rowSpan: getColumnProp(column, 'rowSpan'),
colSpan: getColumnProp(column, 'colSpan'),
"aria-sort": ariaSortData,
onDragStart: function onDragStart(e) {
return _onDragStart(e, column);
},
onDragOver: function onDragOver(e) {
return _onDragOver(e, column);
},
onDragLeave: function onDragLeave(e) {
return _onDragLeave(e, column);
},
onDrop: function onDrop(e) {
return _onDrop(e, column);
}
}, resizer, /*#__PURE__*/React__namespace.createElement("span", {
className: "p-column-title"
}, getColumnProp(column, 'header')), sortIconElement, sortBadge, filterElement), hasTooltip && /*#__PURE__*/React__namespace.createElement(Tooltip, _extends({
target: headerCellRef,
content: headerTooltip
}, getColumnProp(column, 'headerTooltipOptions'))));
}
};
var createHeaderRow = function createHeaderRow(row, index) {
var rowColumns = React__namespace.Children.toArray(RowBase.getCProp(row, 'children'));
var rowHeaderCells = rowColumns.map(function (col, i) {
return createHeaderCell(col, {
index: i,
filterOnly: false,
renderFilter: true
});
});
return /*#__PURE__*/React__namespace.createElement("tr", {
key: index
}, rowHeaderCells);
};
var createColumnGroup = function createColumnGroup() {
var rows = React__namespace.Children.toArray(ColumnGroupBase.getCProp(props.columnGroup, 'children'));
return rows.map(createHeaderRow);
};
var createColumns = function createColumns(columns) {
if (columns) {
if (hasColumnFilter(columns)) {
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement("tr", null, columns.map(function (col, i) {
return createHeaderCell(col, {
index: i,
filterOnly: false,
renderFilter: false
});
})), /*#__PURE__*/React__namespace.createElement("tr", null, columns.map(function (col, i) {
return createHeaderCell(col, {
index: i,
filterOnly: true,
renderFilter: true
});
})));
} else {
return /*#__PURE__*/React__namespace.createElement("tr", null, columns.map(function (col, i) {
return createHeaderCell(col, {
index: i,
filterOnly: false,
renderFilter: false
});
}));
}
} else {
return null;
}
};
var content = props.columnGroup ? createColumnGroup() : createColumns(props.columns);
return /*#__PURE__*/React__namespace.createElement("thead", {
className: "p-treetable-thead"
}, content);
});
TreeTableHeader.displayName = 'TreeTableHeader';
var TreeTableScrollableView = /*#__PURE__*/React__namespace.memo(function (props) {
var elementRef = React__namespace.useRef(null);
var scrollHeaderRef = React__namespace.useRef(null);
var scrollHeaderBoxRef = React__namespace.useRef(null);
var scrollBodyRef = React__namespace.useRef(null);
var scrollTableRef = React__namespace.useRef(null);
var scrollFooterRef = React__namespace.useRef(null);
var scrollFooterBoxRef = React__namespace.useRef(null);
var setScrollHeight = function setScrollHeight() {
if (props.scrollHeight) {
if (props.scrollHeight.indexOf('%') !== -1) {
var datatableContainer = findDataTableContainer(elementRef.current);
scrollBodyRef.current.style.visibility = 'hidden';
scrollBodyRef.current.style.height = '100px'; //temporary height to calculate static height
var containerHeight = DomHandler.getOuterHeight(datatableContainer);
var relativeHeight = DomHandler.getOuterHeight(datatableContainer.parentElement) * parseInt(props.scrollHeight, 10) / 100;
var staticHeight = containerHeight - 100; //total height of headers, footers, paginators
var scrollBodyHeight = relativeHeight - staticHeight;
scrollBodyRef.current.style.height = 'auto';
scrollBodyRef.current.style.maxHeight = scrollBodyHeight + 'px';
scrollBodyRef.current.style.visibility = 'visible';
} else {
scrollBodyRef.current.style.maxHeight = props.scrollHeight;
}
}
};
var findDataTableContainer = function findDataTableContainer(element) {
if (element) {
var el = element;
while (el && !DomHandler.hasClass(el, 'p-treetable')) {
el = el.parentElement;
}
return el;
} else {
return null;
}
};
var onHeaderScroll = function onHeaderScroll() {
scrollHeaderRef.current.scrollLeft = 0;
};
var onBodyScroll = function onBodyScroll() {
var frozenView = elementRef.current.previousElementSibling;
var frozenScrollBody;
if (frozenView) {
frozenScrollBody = DomHandler.findSingle(frozenView, '.p-treetable-scrollable-body');
}
scrollHeaderBoxRef.current.style.marginLeft = -1 * scrollBodyRef.current.scrollLeft + 'px';
if (scrollFooterBoxRef.current) {
scrollFooterBoxRef.current.style.marginLeft = -1 * scrollBodyRef.current.scrollLeft + 'px';
}
if (frozenScrollBody) {
frozenScrollBody.scrollTop = scrollBodyRef.current.scrollTop;
}
};
useMountEffect(function () {
if (!props.frozen) {
var scrollBarWidth = DomHandler.calculateScrollbarWidth();
scrollHeaderBoxRef.current.style.marginRight = scrollBarWidth + 'px';
if (scrollFooterBoxRef.current) {
scrollFooterBoxRef.current.style.marginRight = scrollBarWidth + 'px';
}
} else {
scrollBodyRef.current.style.paddingBottom = DomHandler.calculateScrollbarWidth() + 'px';
}
});
React__namespace.useEffect(function () {
setScrollHeight();
});
var createColGroup = function createColGroup() {
if (ObjectUtils.isNotEmpty(props.columns)) {
var cols = props.columns.map(function (col, i) {
return /*#__PURE__*/React__namespace.createElement("col", {
key: col.field + '_' + i
});
});
return /*#__PURE__*/React__namespace.createElement("colgroup", {
className: "p-treetable-scrollable-colgroup"
}, cols);
} else {
return null;
}
};
var className = classNames('p-treetable-scrollable-view', {
'p-treetable-frozen-view': props.frozen,
'p-treetable-unfrozen-view': !props.frozen && props.frozenWidth
});
var width = props.frozen ? props.frozenWidth : 'calc(100% - ' + props.frozenWidth + ')';
var left = props.frozen ? null : props.frozenWidth;
var colGroup = createColGroup();
var scrollableBodyStyle = !props.frozen && props.scrollHeight ? {
overflowY: 'scroll'
} : null;
return /*#__PURE__*/React__namespace.createElement("div", {
className: className,
style: {
width: width,
left: left
},
ref: elementRef
}, /*#__PURE__*/React__namespace.createElement("div", {
className: "p-treetable-scrollable-header",
ref: scrollHeaderRef,
onScroll: onHeaderScroll
}, /*#__PURE__*/React__namespace.createElement("div", {
className: "p-treetable-scrollable-header-box",
ref: scrollHeaderBoxRef
}, /*#__PURE__*/React__namespace.createElement("table", {
className: "p-treetable-scrollable-header-table"
}, colGroup, props.header))), /*#__PURE__*/React__namespace.createElement("div", {
className: "p-treetable-scrollable-body",
ref: scrollBodyRef,
style: scrollableBodyStyle,
onScroll: onBodyScroll
}, /*#__PURE__*/React__namespace.createElement("table", {
ref: scrollTableRef,
style: {
top: '0'
},
className: "p-treetable-scrollable-body-table"
}, colGroup, props.body)), /*#__PURE__*/React__namespace.createElement("div", {
className: "p-treetable-scrollable-footer",
ref: scrollFooterRef
}, /*#__PURE__*/React__namespace.createElement("div", {
className: "p-treetable-scrollable-footer-box",
ref: scrollFooterBoxRef
}, /*#__PURE__*/React__namespace.createElement("table", {
className: "p-treetable-scrollable-footer-table"
}, colGroup, props.footer))));
});
TreeTableScrollableView.displayName = 'TreeTableScrollableView';
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(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; }
var TreeTable = /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = TreeTableBase.getProps(inProps);
var _React$useState = React__namespace.useState(props.expandedKeys),
_React$useState2 = _slicedToArray(_React$useState, 2),
expandedKeysState = _React$useState2[0],
setExpandedKeysState = _React$useState2[1];
var _React$useState3 = React__namespace.useState(props.first),
_React$useState4 = _slicedToArray(_React$useState3, 2),
firstState = _React$useState4[0],
setFirstState = _React$useState4[1];
var _React$useState5 = React__namespace.useState(props.rows),
_React$useState6 = _slicedToArray(_React$useState5, 2),
rowsState = _React$useState6[0],
setRowsState = _React$useState6[1];
var _React$useState7 = React__namespace.useState(props.sortField),
_React$useState8 = _slicedToArray(_React$useState7, 2),
sortFieldState = _React$useState8[0],
setSortFieldState = _React$useState8[1];
var _React$useState9 = React__namespace.useState(props.sortOrder),
_React$useState10 = _slicedToArray(_React$useState9, 2),
sortOrderState = _React$useState10[0],
setSortOrderState = _React$useState10[1];
var _React$useState11 = React__namespace.useState(props.multiSortMeta),
_React$useState12 = _slicedToArray(_React$useState11, 2),
multiSortMetaState = _React$useState12[0],
setMultiSortMetaState = _React$useState12[1];
var _React$useState13 = React__namespace.useState(props.filters),
_React$useState14 = _slicedToArray(_React$useState13, 2),
filtersState = _React$useState14[0],
setFiltersState = _React$useState14[1];
var _React$useState15 = React__namespace.useState([]),
_React$useState16 = _slicedToArray(_React$useState15, 2),
columnOrderState = _React$useState16[0],
setColumnOrderState = _React$useState16[1];
var elementRef = React__namespace.useRef(null);
var tableRef = React__namespace.useRef(null);
var resizerHelperRef = React__namespace.useRef(null);
var reorderIndicatorUpRef = React__namespace.useRef(null);
var reorderIndicatorDownRef = React__namespace.useRef(null);
var columnResizing = React__namespace.useRef(null);
var resizeColumn = React__namespace.useRef(null);
var resizeColumnProps = React__namespace.useRef(null);
var lastResizerHelperX = React__namespace.useRef(0);
var iconWidth = React__namespace.useRef(0);
var iconHeight = React__namespace.useRef(0);
var draggedColumnEl = React__namespace.useRef(null);
var draggedColumn = React__namespace.useRef(null);
var dropPosition = React__namespace.useRef(null);
var columnSortable = React__namespace.useRef(null);
var columnSortFunction = React__namespace.useRef(null);
var columnField = React__namespace.useRef(null);
var _useEventListener = useEventListener({
type: 'mousemove',
listener: function listener(event) {
if (columnResizing.current) {
onColumnResize(event);
}
}
}),
_useEventListener2 = _slicedToArray(_useEventListener, 2),
bindDocumentMouseMoveListener = _useEventListener2[0],
unbindDocumentMouseMoveListener = _useEventListener2[1];
var _useEventListener3 = useEventListener({
type: 'mouseup',
listener: function listener(event) {
if (columnResizing.current) {
columnResizing.current = false;
onColumnResizeEnd();
}
}
}),
_useEventListener4 = _slicedToArray(_useEventListener3, 2),
bindDocumentMouseUpListener = _useEventListener4[0],
unbindDocumentMouseUpListener = _useEventListener4[1];
var onToggle = function onToggle(event) {
if (props.onToggle) {
props.onToggle(event);
} else {
setExpandedKeysState(event.value);
}
};
var onPageChange = function onPageChange(event) {
if (props.onPage) {
props.onPage(event);
} else {
setFirstState(event.first);
setRowsState(event.rows);
}
};
var onSort = function onSort(event) {
var sortField = event.sortField;
var sortOrder = props.defaultSortOrder;
var multiSortMeta;
var eventMeta;
columnSortable.current = event.sortable;
columnSortFunction.current = event.sortFunction;
columnField.current = event.sortField;
if (props.sortMode === 'multiple') {
var metaKey = event.originalEvent.metaKey || event.originalEvent.ctrlKey;
multiSortMeta = _toConsumableArray(getMultiSortMeta());
if (multiSortMeta && multiSortMeta instanceof Array) {
var sortMeta = multiSortMeta.find(function (sortMeta) {
return sortMeta.field === sortField;
});
sortOrder = sortMeta ? getCalculatedSortOrder(sortMeta.order) : sortOrder;
}
var newMetaData = {
field: sortField,
order: sortOrder
};
if (sortOrder) {
if (!multiSortMeta || !metaKey) {
multiSortMeta = [];
}
addSortMeta(newMetaData, multiSortMeta);
} else if (props.removableSort && multiSortMeta) {
removeSortMeta(newMetaData, multiSortMeta);
}
eventMeta = {
multiSortMeta: multiSortMeta
};
} else {
sortOrder = getSortField() === sortField ? getCalculatedSortOrder(getSortOrder()) : sortOrder;
if (props.removableSort) {
sortField = sortOrder ? sortField : null;
}
eventMeta = {
sortField: sortField,
sortOrder: sortOrder
};
}
if (props.onSort) {
props.onSort(eventMeta);
} else {
setFirstState(0);
setSortFieldState(eventMeta.sortField);
setSortOrderState(eventMeta.sortOrder);
setMultiSortMetaState(eventMeta.multiSortMeta);
}
};
var getCalculatedSortOrder = function getCalculatedSortOrder(currentOrder) {
return props.removableSort ? props.defaultSortOrder === currentOrder ? currentOrder * -1 : 0 : currentOrder * -1;
};
var addSortMeta = 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);
};
var removeSortMeta = 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;
};
var sortSingle = function sortSingle(data) {
return sortNodes(data);
};
var sortNodes = function sortNodes(data) {
var value = _toConsumableArray(data);
if (columnSortable.current && columnSortable.current === 'custom' && columnSortFunction.current) {
value = columnSortFunction.current({
data: data,
field: getSortField(),
order: getSortOrder()
});
} else {
value.sort(function (node1, node2) {
var sortField = getSortField();
var value1 = ObjectUtils.resolveFieldData(node1.data, sortField);
var value2 = ObjectUtils.resolveFieldData(node2.data, sortField);
return compareValuesOnSort(value1, value2, getSortOrder());
});
for (var i = 0; i < value.length; i++) {
if (value[i].children && value[i].children.length) {
value[i].children = sortNodes(value[i].children);
}
}
}
return value;
};
var sortMultiple = function sortMultiple(data) {
var multiSortMeta = getMultiSortMeta();
if (multiSortMeta) return sortMultipleNodes(data, multiSortMeta);else return data;
};
var sortMultipleNodes = function sortMultipleNodes(data, multiSortMeta) {
var value = _toConsumableArray(data);
value.sort(function (node1, node2) {
return multisortField(node1, node2, multiSortMeta, 0);
});
for (var i = 0; i < value.length; i++) {
if (value[i].children && value[i].children.length) {
value[i].children = sortMultipleNodes(value[i].children, multiSortMeta);
}
}
return value;
};
var multisortField = function multisortField(node1, node2, multiSortMeta, index) {
var value1 = ObjectUtils.resolveFieldData(node1.data, multiSortMeta[index].field);
var value2 = ObjectUtils.resolveFieldData(node2.data, multiSortMeta[index].field);
// check if they are equal handling dates and locales
if (ObjectUtils.compare(value1, value2, PrimeReact.locale) === 0) {
return multiSortMeta.length - 1 > index ? multisortField(node1, node2, multiSortMeta, index + 1) : 0;
}
return compareValuesOnSort(value1, value2, multiSortMeta[index].order);
};
var compareValuesOnSort = function compareValuesOnSort(value1, value2, order) {
return ObjectUtils.sort(value1, value2, order, PrimeReact.locale, PrimeReact.nullSortOrder);
};
var filter = function filter(value, field, mode) {
onFilter({
value: value,
field: field,
matchMode: mode
});
};
var onFilter = function onFilter(event) {
var filters = getFilters();
var newFilters = filters ? _objectSpread({}, filters) : {};
if (!isFilterBlank(event.value)) newFilters[event.field] = {
value: event.value,
matchMode: event.matchMode
};else if (newFilters[event.field]) delete newFilters[event.field];
if (props.onFilter) {
props.onFilter({
filters: newFilters
});
} else {
setFirstState(0);
setFiltersState(newFilters);
}
};
var isFilterBlank = 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;
};
var onColumnResizeStart = function onColumnResizeStart(event) {
var containerLeft = DomHandler.getOffset(elementRef.current).left;
resizeColumn.current = event.columnEl;
resizeColumnProps.current = event.column;
columnResizing.current = true;
lastResizerHelperX.current = event.originalEvent.pageX - containerLeft + elementRef.current.scrollLeft;
bindColumnResizeEvents();
};
var onColumnResize = function onColumnResize(event) {
var containerLeft = DomHandler.getOffset(elementRef.current).left;
DomHandler.addClass(elementRef.current, 'p-unselectable-text');
resizerHelperRef.current.style.height = elementRef.current.offsetHeight + 'px';
resizerHelperRef.current.style.top = 0 + 'px';
resizerHelperRef.current.style.left = event.pageX - containerLeft + elementRef.current.scrollLeft + 'px';
resizerHelperRef.current.style.display = 'block';
};
var onColumnResizeEnd = function onColumnResizeEnd(event) {
var delta = resizerHelperRef.current.offsetLeft - lastResizerHelperX.current;
var columnWidth = resizeColumn.current.offsetWidth;
var newColumnWidth = columnWidth + delta;
var minWidth = resizeColumn.current.style.minWidth || 15;
if (columnWidth + delta > parseInt(minWidth, 10)) {
if (props.columnResizeMode === 'fit') {
var nextColumn = resizeColumn.current.nextElementSibling;
var nextColumnWidth = nextColumn.offsetWidth - delta;
if (newColumnWidth > 15 && nextColumnWidth > 15) {
if (props.scrollable) {
var scrollableView = findParentScrollableView(resizeColumn.current);
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(resizeColumn.current);
resizeColGroup(scrollableHeaderTable, resizeColumnIndex, newColumnWidth, nextColumnWidth);
resizeColGroup(scrollableBodyTable, resizeColumnIndex, newColumnWidth, nextColumnWidth);
resizeColGroup(scrollableFooterTable, resizeColumnIndex, newColumnWidth, nextColumnWidth);
} else {
resizeColumn.current.style.width = newColumnWidth + 'px';
if (nextColumn) {
nextColumn.style.width = nextColumnWidth + 'px';
}
}
}
} else if (props.columnResizeMode === 'expand') {
if (props.scrollable) {
var _scrollableView = findParentScrollableView(resizeColumn.current);
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(resizeColumn.current);
resizeColGroup(_scrollableHeaderTable, _resizeColumnIndex, newColumnWidth, null);
resizeColGroup(_scrollableBodyTable, _resizeColumnIndex, newColumnWidth, null);
resizeColGroup(_scrollableFooterTable, _resizeColumnIndex, newColumnWidth, null);
} else {
tableRef.current.style.width = tableRef.current.offsetWidth + delta + 'px';
resizeColumn.current.style.width = newColumnWidth + 'px';
}
}
if (props.onColumnResizeEnd) {
props.onColumnResizeEnd({
element: resizeColumn.current,
column: resizeColumnProps.current,
delta: delta
});
}
}
resizerHelperRef.current.style.display = 'none';
resizeColumn.current = null;
resizeColumnProps.current = null;
DomHandler.removeClass(elementRef.current, 'p-unselectable-text');
unbindColumnResizeEvents();
};
var findParentScrollableView = 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;
}
};
var resizeColGroup = 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');
}
}
};
var bindColumnResizeEvents = function bindColumnResizeEvents() {
bindDocumentMouseMoveListener();
bindDocumentMouseUpListener();
};
var unbindColumnResizeEvents = function unbindColumnResizeEvents() {
unbindDocumentMouseMoveListener();
unbindDocumentMouseUpListener();
};
var onColumnDragStart = function onColumnDragStart(e) {
var event = e.originalEvent,
column = e.column;
if (columnResizing.current) {
event.preventDefault();
return;
}
iconWidth.current = DomHandler.getHiddenElementOuterWidth(reorderIndicatorUpRef.current);
iconHeight.current = DomHandler.getHiddenElementOuterHeight(reorderIndicatorUpRef.current);
draggedColumnEl.current = findParentHeader(event.currentTarget);
draggedColumn.current = column;
event.dataTransfer.setData('text', 'b'); // Firefox requires this to make dragging possible
};
var onColumnDragOver = function onColumnDragOver(e) {
var event = e.originalEvent;
var dropHeader = findParentHeader(event.currentTarget);
if (props.reorderableColumns && draggedColumnEl.current && dropHeader) {
event.preventDefault();
var containerOffset = DomHandler.getOffset(elementRef.current);
var dropHeaderOffset = DomHandler.getOffset(dropHeader);
if (draggedColumnEl.current !== dropHeader) {
var targetLeft = dropHeaderOffset.left - containerOffset.left;
//let targetTop = containerOffset.top - dropHeaderOffset.top;
var columnCenter = dropHeaderOffset.left + dropHeader.offsetWidth / 2;
reorderIndicatorUpRef.current.style.top = dropHeaderOffset.top - containerOffset.top - (iconHeight.current - 1) + 'px';
reorderIndicatorDownRef.current.style.top = dropHeaderOffset.top - containerOffset.top + dropHeader.offsetHeight + 'px';
if (event.pageX > columnCenter) {
reorderIndicatorUpRef.current.style.left = targetLeft + dropHeader.offsetWidth - Math.ceil(iconWidth.current / 2) + 'px';
reorderIndicatorDownRef.current.style.left = targetLeft + dropHeader.offsetWidth - Math.ceil(iconWidth.current / 2) + 'px';
dropPosition.current = 1;
} else {
reorderIndicatorUpRef.current.style.left = targetLeft - Math.ceil(iconWidth.current / 2) + 'px';
reorderIndicatorDownRef.current.style.left = targetLeft - Math.ceil(iconWidth.current / 2) + 'px';
dropPosition.current = -1;
}
reorderIndicatorUpRef.current.style.display = 'block';
reorderIndicatorDownRef.current.style.display = 'block';
}
}
};
var onColumnDragLeave = function onColumnDragLeave(e) {
var event = e.originalEvent;
if (props.reorderableColumns && draggedColumnEl.current) {
event.preventDefault();
reorderIndicatorUpRef.current.style.display = 'none';
reorderIndicatorDownRef.current.style.display = 'none';
}
};
var onColumnDrop = function onColumnDrop(e) {
var event = e.originalEvent,
column = e.column;
event.preventDefault();
if (draggedColumnEl.current) {
var dragIndex = DomHandler.index(draggedColumnEl.current);
var dropIndex = DomHandler.index(findParentHeader(event.currentTarget));
var allowDrop = dragIndex !== dropIndex;
if (allowDrop && (dropIndex - dragIndex === 1 && dropPosition.current === -1 || dragIndex - dropIndex === 1 && dropPosition.current === 1)) {
allowDrop = false;
}
if (allowDrop) {
var columns = columnOrderState ? getColumns() : React__namespace.Children.toArray(props.children);
var isSameColumn = function isSameColumn(col1, col2) {
return getColumnProp(col1, 'columnKey') || getColumnProp(col2, 'columnKey') ? ObjectUtils.equals(col1, col2, 'props.columnKey') : ObjectUtils.equals(col1, col2, 'props.field');
};
var dragColIndex = columns.findIndex(function (child) {
return isSameColumn(child, draggedColumn.current);
});
var dropColIndex = columns.findIndex(function (child) {
return isSameColumn(child, column);
});
if (dropColIndex < dragColIndex && dropPosition.current === 1) {
dropColIndex++;
}
if (dropColIndex > dragColIndex && dropPosition.current === -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(getColumnProp(_column, 'columnKey') || getColumnProp(_column, 'field'));
}
} catch (err) {
_iterator.e(err);
} finally {
_iterator.f();
}
setColumnOrderState(columnOrder);
if (props.onColReorder) {
props.onColReorder({
dragIndex: dragColIndex,
dropIndex: dropColIndex,
columns: columns
});
}
}
reorderIndicatorUpRef.current.style.display = 'none';
reorderIndicatorDownRef.current.style.display = 'none';
draggedColumnEl.current.draggable = false;
draggedColumnEl.current = null;
dropPosition.current = null;
}
};
var findParentHeader = 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;
}
};
var getColumnProp = function getColumnProp(column, name) {
return ColumnBase.getCProp(column, name);
};
var getExpandedKeys = function getExpandedKeys() {
return props.onToggle ? props.expandedKeys : expandedKeysState;
};
var getFirst = function getFirst() {
return props.onPage ? props.first : firstState;
};
var getRows = function getRows() {
return props.onPage ? props.rows : rowsState;
};
var getSortField = function getSortField() {
return props.onSort ? props.sortField : sortFieldState;
};
var getSortOrder = function getSortOrder() {
return props.onSort ? props.sortOrder : sortOrderState;
};
var getMultiSortMeta = function getMultiSortMeta() {
return (props.onSort ? props.multiSortMeta : multiSortMetaState) || [];
};
var getFilters = function getFilters() {
return props.onFilter ? props.filters : filtersState;
};
var findColumnByKey = function findColumnByKey(columns, key) {
if (columns && columns.length) {
for (var i = 0; i < columns.length; i++) {
var child = columns[i];
if (getColumnProp(child, 'columnKey') === key || getColumnProp(child, 'field') === key) {
return child;
}
}
}
return null;
};
var getColumns = function getColumns() {
var columns = React__namespace.Children.toArray(props.children);
if (columns && columns.length) {
if (props.reorderableColumns && columnOrderState) {
var orderedColumns = [];
var _iterator2 = _createForOfIteratorHelper(columnOrderState),
_step2;
try {
for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
var columnKey = _step2.value;
var column = 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;
};
var getTotalRecords = function getTotalRecords(data) {
return props.lazy ? props.totalRecords : data ? data.length : 0;
};
var isSingleSelectionMode = function isSingleSelectionMode() {
return props.selectionMode && props.selectionMode === 'single';
};
var isMultipleSelectionMode = function isMultipleSelectionMode() {
return props.selectionMode && props.selectionMode === 'multiple';
};
var isRowSelectionMode = function isRowSelectionMode() {
return isSingleSelectionMode() || isMultipleSelectionMode();
};
var getFrozenColumns = function getFrozenColumns(columns) {
var frozenColumns = null;
var _iterator3 = _createForOfIteratorHelper(columns),
_step3;
try {
for (_iterator3.s(); !(_step3 = _iterator3.n()).done;) {
var col = _step3.value;
if (getColumnProp(col, 'frozen')) {
frozenColumns = frozenColumns || [];
frozenColumns.push(col);
}
}
} catch (err) {
_iterator3.e(err);
} finally {
_iterator3.f();
}
return frozenColumns;
};
var getScrollableColumns = function getScrollableColumns(columns) {
var scrollableColumns = null;
var _iterator4 = _createForOfIteratorHelper(columns),
_step4;
try {
for (_iterator4.s(); !(_step4 = _iterator4.n()).done;) {
var col = _step4.value;
if (!getColumnProp(col, 'frozen')) {
scrollableColumns = scrollableColumns || [];
scrollableColumns.push(col);
}
}
} catch (err) {
_iterator4.e(err);
} finally {
_iterator4.f();
}
return scrollableColumns;
};
var filterLocal = function filterLocal(value) {
var filteredNodes = [];
var filters = getFilters();
var columns = React__namespace.Children.toArray(props.children);
var isStrictMode = props.filterMode === 'strict';
var _iterator5 = _createForOfIteratorHelper(value),
_step5;
try {
for (_iterator5.s(); !(_step5 = _iterator5.n()).done;) {
var node = _step5.value;
var copyNode = _objectSpread({}, node);
var localMatch = true;
var globalMatch = false;
for (var j = 0; j < columns.length; j++) {
var col = columns[j];
var filterMeta = filters ? filters[getColumnProp(col, 'field')] : null;
var filterField = getColumnProp(col, 'field');
var filterValue = void 0,
filterConstraint = void 0,
paramsWithoutNode = void 0,
options = void 0;
//local
if (filterMeta) {
var filterMatchMode = filterMeta.matchMode || getColumnProp(col, 'filterMatchMode') || 'startsWith';
filterValue = filterMeta.value;
filterConstraint = filterMatchMode === 'custom' ? getColumnProp(col, 'filterFunction') : FilterService.filters[filterMatchMode];
options = {
rowData: node,
filters: filters,
props: props,
column: {
filterMeta: filterMeta,
filterField: filterField,
props: ColumnBase.getCProps(col)
}
};
paramsWithoutNode = {
filterField: filterField,
filterValue: filterValue,
filterConstraint: filterConstraint,
isStrictMode: isStrictMode,
options: options
};
if (isStrictMode && !(findFilteredNodes(copyNode, paramsWithoutNode) || isFilterMatched(copyNode, paramsWithoutNode)) || !isStrictMode && !(isFilterMatched(copyNode, paramsWithoutNode) || findFilteredNodes(copyNode, paramsWithoutNode))) {
localMatch = false;
}
if (!localMatch) {
break;
}
}
//global
if (props.globalFilter && !globalMatch) {
var copyNodeForGlobal = _objectSpread({}, copyNode);
filterValue = props.globalFilter;
filterConstraint = FilterService.filters[props.globalFilterMatchMode];
paramsWithoutNode = {
filterField: filterField,
filterValue: filterValue,
filterConstraint: filterConstraint,
isStrictMode: isStrictMode
};
if (isStrictMode && (findFilteredNodes(copyNodeForGlobal, paramsWithoutNode) || isFilterMatched(copyNodeForGlobal, paramsWithoutNode)) || !isStrictMode && (isFilterMatched(copyNodeForGlobal, paramsWithoutNode) || findFilteredNodes(copyNodeForGlobal, paramsWithoutNode))) {
globalMatch = true;
copyNode = copyNodeForGlobal;
}
}
}
var matches = localMatch;
if (props.globalFilter) {
matches = localMatch && globalMatch;
}
if (matches) {
filteredNodes.push(copyNode);
}
}
} catch (err) {
_iterator5.e(err);
} finally {
_iterator5.f();
}
return filteredNodes;
};
var findFilteredNodes = 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({}, childNode);
if (isFilterMatched(copyChildNode, paramsWithoutNode)) {
matched = true;
node.children.push(copyChildNode);
}
}
} catch (err) {
_iterator6.e(err);
} finally {
_iterator6.f();
}
}
if (matched) {
return true;
}
}
};
var isFilterMatched = 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, props.filterLocale, options)) {
matched = true;
}
if (!matched || isStrictMode && !isNodeLeaf(node)) {
matched = findFilteredNodes(node, {
filterField: filterField,
filterValue: filterValue,
filterConstraint: filterConstraint,
isStrictMode: isStrictMode
}) || matched;
}
return matched;
};
var isNodeLeaf = function isNodeLeaf(node) {
return node.leaf === false ? false : !(node.children && node.children.length);
};
var processData = function processData() {
var data = props.value || [];
if (!props.lazy) {
if (data && data.length) {
var filters = getFilters();
var sortField = getSortField();
var multiSortMeta = getMultiSortMeta();
if (ObjectUtils.isNotEmpty(filters) || props.globalFilter) {
data = filterLocal(data);
}
if (sortField || ObjectUtils.isNotEmpty(multiSortMeta)) {
if (props.sortMode === 'single') data = sortSingle(data);else if (props.sortMode === 'multiple') data = sortMultiple(data);
}
}
}
return data;
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
filter: filter,
getElement: function getElement() {
return elementRef.current;
}
};
});
var createTableHeader = function createTableHeader(columns, columnGroup) {
var sortField = getSortField();
var sortOrder = getSortOrder();
var multiSortMeta = _toConsumableArray(getMultiSortMeta());
var filters = getFilters();
return /*#__PURE__*/React__namespace.createElement(TreeTableHeader, {
columns: columns,
columnGroup: columnGroup,
tabIndex: props.tabIndex,
onSort: onSort,
sortField: sortField,
sortOrder: sortOrder,
multiSortMeta: multiSortMeta,
resizableColumns: props.resizableColumns,
onResizeStart: onColumnResizeStart,
reorderableColumns: props.reorderableColumns,
onDragStart: onColumnDragStart,
onDragOver: onColumnDragOver,
onDragLeave: onColumnDragLeave,
onDrop: onColumnDrop,
onFilter: onFilter,
filters: filters,
filterDelay: props.filterDelay
});
};
var createTableFooter = function createTableFooter(columns, columnGroup) {
return /*#__PURE__*/React__namespace.createElement(TreeTableFooter, {
columns: columns,
columnGroup: columnGroup
});
};
var createTableBody = function createTableBody(value, columns) {
return /*#__PURE__*/React__namespace.createElement(TreeTableBody, {
value: value,
columns: columns,
expandedKeys: getExpandedKeys(),
selectOnEdit: props.selectOnEdit,
onToggle: onToggle,
onExpand: props.onExpand,
onCollapse: props.onCollapse,
paginator: props.paginator,
first: getFirst(),
rows: getRows(),
selectionMode: props.selectionMode,
selectionKeys: props.selectionKeys,
onSelectionChange: props.onSelectionChange,
metaKeySelection: props.metaKeySelection,
onRowClick: props.onRowClick,
onSelect: props.onSelect,
onUnselect: props.onUnselect,
propagateSelectionUp: props.propagateSelectionUp,
propagateSelectionDown: props.propagateSelectionDown,
lazy: props.lazy,
rowClassName: props.rowClassName,
emptyMessage: props.emptyMessage,
loading: props.loading,
contextMenuSelectionKey: props.contextMenuSelectionKey,
onContextMenuSelectionChange: props.onContextMenuSelectionChange,
onContextMenu: props.onContextMenu
});
};
var createPaginator = function createPaginator(position, totalRecords) {
var className = classNames('p-paginator-' + position, props.paginatorClassName);
return /*#__PURE__*/React__namespace.createElement(Paginator, {
first: getFirst(),
rows: getRows(),
pageLinkSize: props.pageLinkSize,
className: className,
onPageChange: onPageChange,
template: props.paginatorTemplate,
totalRecords: totalRecords,
rowsPerPageOptions: props.rowsPerPageOptions,
currentPageReportTemplate: props.currentPageReportTemplate,
leftContent: props.paginatorLeft,
rightContent: props.paginatorRight,
alwaysShow: props.alwaysShowPaginator,
dropdownAppendTo: props.paginatorDropdownAppendTo
});
};
var createScrollableView = function createScrollableView(value, columns, frozen, headerColumnGroup, footerColumnGroup) {
var header = createTableHeader(columns, headerColumnGroup);
var footer = createTableFooter(columns, footerColumnGroup);
var body = createTableBody(value, columns);
return /*#__PURE__*/React__namespace.createElement(TreeTableScrollableView, {
columns: columns,
header: header,
body: body,
footer: footer,
scrollHeight: props.scrollHeight,
frozen: frozen,
frozenWidth: props.frozenWidth
});
};
var createScrollableTable = function createScrollableTable(value) {
var columns = getColumns();
var frozenColumns = getFrozenColumns(columns);
var scrollableColumns = frozenColumns ? getScrollableColumns(columns) : columns;
var frozenView, scrollableView;
if (frozenColumns) {
frozenView = createScrollableView(value, frozenColumns, true, props.frozenHeaderColumnGroup, props.frozenFooterColumnGroup);
}
scrollableView = createScrollableView(value, scrollableColumns, false, props.headerColumnGroup, props.footerColumnGroup);
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-treetable-wrapper p-treetable-scrollable-wrapper"
}, frozenView, scrollableView);
};
var createRegularTable = function createRegularTable(value) {
var columns = getColumns();
var header = createTableHeader(columns, props.headerColumnGroup);
var footer = createTableFooter(columns, props.footerColumnGroup);
var body = createTableBody(value, columns);
var tableClassName = classNames('p-treetable-table', {
'p-treetable-scrollable-table': props.scrollable,
'p-treetable-resizable-table': props.resizableColumns,
'p-treetable-resizable-table-fit': props.resizableColumns && props.columnResizeMode === 'fit'
}, props.tableClassName);
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-treetable-wrapper"
}, /*#__PURE__*/React__namespace.createElement("table", {
ref: tableRef,
style: props.tableStyle,
className: tableClassName
}, header, footer, body));
};
var createTable = function createTable(value) {
return props.scrollable ? createScrollableTable(value) : createRegularTable(value);
};
var createLoader = function createLoader() {
if (props.loading) {
var iconClassName = classNames('p-treetable-loading-icon pi-spin', props.loadingIcon);
return /*#__PURE__*/React__namespace.createElement("div", {
className: "p-treetable-loading"
}, /*#__PURE__*/React__namespace.createElement("div", {
className: "p-treetable-loading-overlay p-component-overlay"
}, /*#__PURE__*/React__namespace.createElement("i", {
className: iconClassName
})));
}
return null;
};
var data = processData();
var otherProps = ObjectUtils.findDiffKeys(props, TreeTable.defaultProps);
var className = classNames('p-treetable p-component', {
'p-treetable-hoverable-rows': props.rowHover,
'p-treetable-selectable': isRowSelectionMode(),
'p-treetable-resizable': props.resizableColumns,
'p-treetable-resizable-fit': props.resizableColumns && props.columnResizeMode === 'fit',
'p-treetable-striped': props.stripedRows,
'p-treetable-gridlines': props.showGridlines
}, props.className);
var table = createTable(data);
var totalRecords = getTotalRecords(data);
var headerFacet = props.header && /*#__PURE__*/React__namespace.createElement("div", {
className: "p-treetable-header"
}, props.header);
var footerFacet = props.footer && /*#__PURE__*/React__namespace.createElement("div", {
className: "p-treetable-footer"
}, props.footer);
var paginatorTop = props.paginator && props.paginatorPosition !== 'bottom' && createPaginator('top', totalRecords);
var paginatorBottom = props.paginator && props.paginatorPosition !== 'top' && createPaginator('bottom', totalRecords);
var loader = createLoader();
var resizeHelper = props.resizableColumns && /*#__PURE__*/React__namespace.createElement("div", {
ref: resizerHelperRef,
className: "p-column-resizer-helper",
style: {
display: 'none'
}
});
var reorderIndicatorUp = props.reorderableColumns && /*#__PURE__*/React__namespace.createElement("span", {
ref: reorderIndicatorUpRef,
className: "pi pi-arrow-down p-datatable-reorder-indicator-up",
style: {
position: 'absolute',
display: 'none'
}
});
var reorderIndicatorDown = props.reorderableColumns && /*#__PURE__*/React__namespace.createElement("span", {
ref: reorderIndicatorDownRef,
className: "pi pi-arrow-up p-datatable-reorder-indicator-down",
style: {
position: 'absolute',
display: 'none'
}
});
return /*#__PURE__*/React__namespace.createElement("div", _extends({
ref: elementRef,
id: props.id,
className: className,
style: props.style,
"data-scrollselectors": ".p-treetable-wrapper"
}, otherProps), loader, headerFacet, paginatorTop, table, paginatorBottom, footerFacet, resizeHelper, reorderIndicatorUp, reorderIndicatorDown);
});
TreeTable.displayName = 'TreeTable';
var TriStateCheckboxBase = {
defaultProps: {
__TYPE: 'TriStateCheckbox',
id: null,
value: null,
style: null,
className: null,
disabled: false,
readOnly: false,
tabIndex: '0',
tooltip: null,
tooltipOptions: null,
onChange: null,
children: undefined
},
getProps: function getProps(props) {
return ObjectUtils.getMergedProps(props, TriStateCheckboxBase.defaultProps);
},
getOtherProps: function getOtherProps(props) {
return ObjectUtils.getDiffProps(props, TriStateCheckboxBase.defaultProps);
}
};
var TriStateCheckbox = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
var props = TriStateCheckboxBase.getProps(inProps);
var _React$useState = React__namespace.useState(false),
_React$useState2 = _slicedToArray(_React$useState, 2),
focusedState = _React$useState2[0],
setFocusedState = _React$useState2[1];
var elementRef = React__namespace.useRef(null);
var onClick = function onClick(event) {
if (!props.disabled && !props.readOnly) {
toggle(event);
}
};
var toggle = function toggle(event) {
var newValue;
if (props.value === null || props.value === undefined) newValue = true;else if (props.value === true) newValue = false;else if (props.value === false) newValue = null;
if (props.onChange) {
props.onChange({
originalEvent: event,
value: newValue,
stopPropagation: function stopPropagation() {},
preventDefault: function preventDefault() {},
target: {
name: props.name,
id: props.id,
value: newValue
}
});
}
};
var onFocus = function onFocus() {
setFocusedState(true);
};
var onBlur = function onBlur() {
setFocusedState(false);
};
var onKeyDown = function onKeyDown(e) {
if (e.keyCode === 32) {
toggle(e);
e.preventDefault();
}
};
React__namespace.useImperativeHandle(ref, function () {
return {
props: props,
focus: function focus() {
return DomHandler.focusFirstElement(elementRef.current);
},
getElement: function getElement() {
return elementRef.current;
}
};
});
var hasTooltip = ObjectUtils.isNotEmpty(props.tooltip);
var otherProps = TriStateCheckboxBase.getOtherProps(props);
var ariaProps = ObjectUtils.reduceKeys(otherProps, DomHandler.ARIA_PROPS);
var className = classNames('p-tristatecheckbox p-checkbox p-component', props.className, {
'p-checkbox-disabled': props.disabled
});
var boxClassName = classNames('p-checkbox-box', {
'p-highlight': (props.value || !props.value) && props.value !== null,
'p-disabled': props.disabled,
'p-focus': focusedState
});
var iconClassName = classNames('p-checkbox-icon p-c', {
'pi pi-check': props.value === true,
'pi pi-times': props.value === false
});
var ariaValueLabel = props.value ? ariaLabel('trueLabel') : props.value === false ? ariaLabel('falseLabel') : ariaLabel('nullLabel');
var ariaChecked = props.value ? 'true' : 'false';
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement("div", _extends({
ref: elementRef,
id: props.id,
className: className,
style: props.style
}, otherProps, {
onClick: onClick
}), /*#__PURE__*/React__namespace.createElement("div", _extends({
className: boxClassName,
tabIndex: props.tabIndex,
onFocus: onFocus,
onBlur: onBlur,
onKeyDown: onKeyDown,
role: "checkbox",
"aria-checked": ariaChecked
}, ariaProps), /*#__PURE__*/React__namespace.createElement("span", {
className: iconClassName
})), focusedState && /*#__PURE__*/React__namespace.createElement("span", {
className: "p-sr-only",
"aria-live": "polite"
}, ariaValueLabel)), hasTooltip && /*#__PURE__*/React__namespace.createElement(Tooltip, _extends({
target: elementRef,
content: props.tooltip
}, props.tooltipOptions)));
}));
TriStateCheckbox.displayName = 'TriStateCheckbox';
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.CSSTransition = CSSTransition;
exports.Calendar = Calendar;
exports.Card = Card;
exports.Carousel = Carousel;
exports.CascadeSelect = CascadeSelect;
exports.Chart = PrimeReactChart;
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.DataViewItem = DataViewItem;
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.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.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.Slider = Slider;
exports.SortOrder = SortOrder;
exports.SpeedDial = SpeedDial;
exports.SplitButton = SplitButton;
exports.Splitter = Splitter;
exports.SplitterPanel = SplitterPanel;
exports.Steps = Steps;
exports.StyleClass = StyleClass;
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.ariaLabel = ariaLabel;
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.updateLocaleOption = updateLocaleOption;
exports.updateLocaleOptions = updateLocaleOptions;
exports.useClickOutside = useClickOutside;
exports.useCounter = useCounter;
exports.useDebounce = useDebounce;
exports.useEventListener = useEventListener;
exports.useFavicon = useFavicon;
exports.useIntersectionObserver = useIntersectionObserver;
exports.useInterval = useInterval;
exports.useLocalStorage = useLocalStorage;
exports.useMatchMedia = useMatchMedia;
exports.useMountEffect = useMountEffect;
exports.useMouse = useMouse;
exports.useMove = useMove;
exports.useOverlayListener = useOverlayListener;
exports.useOverlayScrollListener = useOverlayScrollListener;
exports.usePrevious = usePrevious;
exports.useResizeListener = useResizeListener;
exports.useSessionStorage = useSessionStorage;
exports.useStorage = useStorage;
exports.useTimeout = useTimeout;
exports.useUnmountEffect = useUnmountEffect;
exports.useUpdateEffect = useUpdateEffect;
Object.defineProperty(exports, '__esModule', { value: true });
return exports;
})({}, React, ReactTransitionGroup, ReactDOM);