` by default. You can change this\n * behavior by providing a `component` prop.\n * If you use React v16+ and would like to avoid a wrapping `
` element\n * you can pass in `component={null}`. This is useful if the wrapping div\n * borks your css styles.\n */\n component: PropTypes.any,\n\n /**\n * A set of `
` components, that are toggled `in` and out as they\n * leave. the `` will inject specific transition props, so\n * remember to spread them through if you are wrapping the `` as\n * with our `` example.\n *\n * While this component is meant for multiple `Transition` or `CSSTransition`\n * children, sometimes you may want to have a single transition child with\n * content that you want to be transitioned out and in when you change it\n * (e.g. routes, images etc.) In that case you can change the `key` prop of\n * the transition child as you change its content, this will cause\n * `TransitionGroup` to transition the child out and back in.\n */\n children: PropTypes.node,\n\n /**\n * A convenience prop that enables or disables appear animations\n * for all children. Note that specifying this will override any defaults set\n * on individual children Transitions.\n */\n appear: PropTypes.bool,\n\n /**\n * A convenience prop that enables or disables enter animations\n * for all children. Note that specifying this will override any defaults set\n * on individual children Transitions.\n */\n enter: PropTypes.bool,\n\n /**\n * A convenience prop that enables or disables exit animations\n * for all children. Note that specifying this will override any defaults set\n * on individual children Transitions.\n */\n exit: PropTypes.bool,\n\n /**\n * You may need to apply reactive updates to a child as it is exiting.\n * This is generally done by using `cloneElement` however in the case of an exiting\n * child the element has already been removed and not accessible to the consumer.\n *\n * If you do need to update a child as it leaves you can provide a `childFactory`\n * to wrap every child, even the ones that are leaving.\n *\n * @type Function(child: ReactElement) -> ReactElement\n */\n childFactory: PropTypes.func\n} : {};\nTransitionGroup.defaultProps = defaultProps;\nexport default TransitionGroup;","function _assertThisInitialized(e) {\n if (void 0 === e) throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\");\n return e;\n}\nexport { _assertThisInitialized as default };","import * as React from 'react';\nimport { TransitionGroup } from 'react-transition-group';\nimport PrimeReact$1 from 'primereact/api';\nimport { CSSTransition } from 'primereact/csstransition';\nimport { useTimeout, useUnmountEffect } from 'primereact/hooks';\nimport { Portal } from 'primereact/portal';\nimport { classNames, DomHandler, ObjectUtils, ZIndexUtils } from 'primereact/utils';\nimport { Ripple } from 'primereact/ripple';\n\nfunction _extends() {\n _extends = Object.assign ? Object.assign.bind() : function (target) {\n for (var i = 1; i < arguments.length; i++) {\n var source = arguments[i];\n for (var key in source) {\n if (Object.prototype.hasOwnProperty.call(source, key)) {\n target[key] = source[key];\n }\n }\n }\n return target;\n };\n return _extends.apply(this, arguments);\n}\n\nfunction _arrayLikeToArray(arr, len) {\n if (len == null || len > arr.length) len = arr.length;\n for (var i = 0, arr2 = new Array(len); i < len; i++) {\n arr2[i] = arr[i];\n }\n return arr2;\n}\n\nfunction _arrayWithoutHoles(arr) {\n if (Array.isArray(arr)) return _arrayLikeToArray(arr);\n}\n\nfunction _iterableToArray(iter) {\n if (typeof Symbol !== \"undefined\" && iter[Symbol.iterator] != null || iter[\"@@iterator\"] != null) return Array.from(iter);\n}\n\nfunction _unsupportedIterableToArray(o, minLen) {\n if (!o) return;\n if (typeof o === \"string\") return _arrayLikeToArray(o, minLen);\n var n = Object.prototype.toString.call(o).slice(8, -1);\n if (n === \"Object\" && o.constructor) n = o.constructor.name;\n if (n === \"Map\" || n === \"Set\") return Array.from(o);\n if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);\n}\n\nfunction _nonIterableSpread() {\n throw new TypeError(\"Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\");\n}\n\nfunction _toConsumableArray(arr) {\n return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread();\n}\n\nfunction _arrayWithHoles(arr) {\n if (Array.isArray(arr)) return arr;\n}\n\nfunction _iterableToArrayLimit(arr, i) {\n var _i = null == arr ? null : \"undefined\" != typeof Symbol && arr[Symbol.iterator] || arr[\"@@iterator\"];\n if (null != _i) {\n var _s,\n _e,\n _x,\n _r,\n _arr = [],\n _n = !0,\n _d = !1;\n try {\n if (_x = (_i = _i.call(arr)).next, 0 === i) {\n if (Object(_i) !== _i) return;\n _n = !1;\n } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0) {\n ;\n }\n } catch (err) {\n _d = !0, _e = err;\n } finally {\n try {\n if (!_n && null != _i[\"return\"] && (_r = _i[\"return\"](), Object(_r) !== _r)) return;\n } finally {\n if (_d) throw _e;\n }\n }\n return _arr;\n }\n}\n\nfunction _nonIterableRest() {\n throw new TypeError(\"Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\");\n}\n\nfunction _slicedToArray(arr, i) {\n return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();\n}\n\nfunction _typeof(obj) {\n \"@babel/helpers - typeof\";\n\n return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (obj) {\n return typeof obj;\n } : function (obj) {\n return obj && \"function\" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj;\n }, _typeof(obj);\n}\n\nfunction _toPrimitive(input, hint) {\n if (_typeof(input) !== \"object\" || input === null) return input;\n var prim = input[Symbol.toPrimitive];\n if (prim !== undefined) {\n var res = prim.call(input, hint || \"default\");\n if (_typeof(res) !== \"object\") return res;\n throw new TypeError(\"@@toPrimitive must return a primitive value.\");\n }\n return (hint === \"string\" ? String : Number)(input);\n}\n\nfunction _toPropertyKey(arg) {\n var key = _toPrimitive(arg, \"string\");\n return _typeof(key) === \"symbol\" ? key : String(key);\n}\n\nfunction _defineProperty(obj, key, value) {\n key = _toPropertyKey(key);\n if (key in obj) {\n Object.defineProperty(obj, key, {\n value: value,\n enumerable: true,\n configurable: true,\n writable: true\n });\n } else {\n obj[key] = value;\n }\n return obj;\n}\n\nfunction _defineProperties(target, props) {\n for (var i = 0; i < props.length; i++) {\n var descriptor = props[i];\n descriptor.enumerable = descriptor.enumerable || false;\n descriptor.configurable = true;\n if (\"value\" in descriptor) descriptor.writable = true;\n Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);\n }\n}\nfunction _createClass(Constructor, protoProps, staticProps) {\n if (protoProps) _defineProperties(Constructor.prototype, protoProps);\n if (staticProps) _defineProperties(Constructor, staticProps);\n Object.defineProperty(Constructor, \"prototype\", {\n writable: false\n });\n return Constructor;\n}\n\nfunction _classCallCheck(instance, Constructor) {\n if (!(instance instanceof Constructor)) {\n throw new TypeError(\"Cannot call a class as a function\");\n }\n}\n\nvar FilterMatchMode = Object.freeze({\n STARTS_WITH: 'startsWith',\n CONTAINS: 'contains',\n NOT_CONTAINS: 'notContains',\n ENDS_WITH: 'endsWith',\n EQUALS: 'equals',\n NOT_EQUALS: 'notEquals',\n IN: 'in',\n LESS_THAN: 'lt',\n LESS_THAN_OR_EQUAL_TO: 'lte',\n GREATER_THAN: 'gt',\n GREATER_THAN_OR_EQUAL_TO: 'gte',\n BETWEEN: 'between',\n DATE_IS: 'dateIs',\n DATE_IS_NOT: 'dateIsNot',\n DATE_BEFORE: 'dateBefore',\n DATE_AFTER: 'dateAfter',\n CUSTOM: 'custom'\n});\n\nvar PrimeReact = /*#__PURE__*/_createClass(function PrimeReact() {\n _classCallCheck(this, PrimeReact);\n});\n_defineProperty(PrimeReact, \"ripple\", false);\n_defineProperty(PrimeReact, \"inputStyle\", 'outlined');\n_defineProperty(PrimeReact, \"locale\", 'en');\n_defineProperty(PrimeReact, \"appendTo\", null);\n_defineProperty(PrimeReact, \"cssTransition\", true);\n_defineProperty(PrimeReact, \"autoZIndex\", true);\n_defineProperty(PrimeReact, \"nonce\", null);\n_defineProperty(PrimeReact, \"nullSortOrder\", 1);\n_defineProperty(PrimeReact, \"zIndex\", {\n modal: 1100,\n overlay: 1000,\n menu: 1000,\n tooltip: 1100,\n toast: 1200\n});\n_defineProperty(PrimeReact, \"filterMatchModeOptions\", {\n text: [FilterMatchMode.STARTS_WITH, FilterMatchMode.CONTAINS, FilterMatchMode.NOT_CONTAINS, FilterMatchMode.ENDS_WITH, FilterMatchMode.EQUALS, FilterMatchMode.NOT_EQUALS],\n numeric: [FilterMatchMode.EQUALS, FilterMatchMode.NOT_EQUALS, FilterMatchMode.LESS_THAN, FilterMatchMode.LESS_THAN_OR_EQUAL_TO, FilterMatchMode.GREATER_THAN, FilterMatchMode.GREATER_THAN_OR_EQUAL_TO],\n date: [FilterMatchMode.DATE_IS, FilterMatchMode.DATE_IS_NOT, FilterMatchMode.DATE_BEFORE, FilterMatchMode.DATE_AFTER]\n});\n\nvar locales = {\n en: {\n startsWith: 'Starts with',\n contains: 'Contains',\n notContains: 'Not contains',\n endsWith: 'Ends with',\n equals: 'Equals',\n notEquals: 'Not equals',\n noFilter: 'No Filter',\n filter: 'Filter',\n lt: 'Less than',\n lte: 'Less than or equal to',\n gt: 'Greater than',\n gte: 'Greater than or equal to',\n dateIs: 'Date is',\n dateIsNot: 'Date is not',\n dateBefore: 'Date is before',\n dateAfter: 'Date is after',\n custom: 'Custom',\n clear: 'Clear',\n close: 'Close',\n apply: 'Apply',\n matchAll: 'Match All',\n matchAny: 'Match Any',\n addRule: 'Add Rule',\n removeRule: 'Remove Rule',\n accept: 'Yes',\n reject: 'No',\n choose: 'Choose',\n upload: 'Upload',\n cancel: 'Cancel',\n dayNames: ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'],\n dayNamesShort: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'],\n dayNamesMin: ['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa'],\n monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],\n monthNamesShort: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],\n today: 'Today',\n weekHeader: 'Wk',\n firstDayOfWeek: 0,\n dateFormat: 'mm/dd/yy',\n weak: 'Weak',\n medium: 'Medium',\n strong: 'Strong',\n passwordPrompt: 'Enter a password',\n emptyFilterMessage: 'No available options',\n emptyMessage: 'No results found',\n aria: {\n trueLabel: 'True',\n falseLabel: 'False',\n nullLabel: 'Not Selected',\n pageLabel: 'Page',\n firstPageLabel: 'First Page',\n lastPageLabel: 'Last Page',\n nextPageLabel: 'Next Page',\n previousPageLabel: 'Previous Page',\n selectLabel: 'Select',\n unselectLabel: 'Unselect',\n expandLabel: 'Expand',\n collapseLabel: 'Collapse'\n }\n }\n};\nfunction localeOption(key, locale) {\n var _locale = locale || PrimeReact.locale;\n try {\n return localeOptions(_locale)[key];\n } catch (error) {\n throw new Error(\"The \".concat(key, \" option is not found in the current locale('\").concat(_locale, \"').\"));\n }\n}\nfunction localeOptions(locale) {\n var _locale = locale || PrimeReact.locale;\n return locales[_locale];\n}\n\nvar ToastMessage = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (props, ref) {\n var messageInfo = props.messageInfo;\n var _messageInfo$message = messageInfo.message,\n severity = _messageInfo$message.severity,\n content = _messageInfo$message.content,\n summary = _messageInfo$message.summary,\n detail = _messageInfo$message.detail,\n closable = _messageInfo$message.closable,\n life = _messageInfo$message.life,\n sticky = _messageInfo$message.sticky,\n _className = _messageInfo$message.className,\n style = _messageInfo$message.style,\n _contentClassName = _messageInfo$message.contentClassName,\n contentStyle = _messageInfo$message.contentStyle;\n var _React$useState = React.useState(false),\n _React$useState2 = _slicedToArray(_React$useState, 2),\n focused = _React$useState2[0],\n setFocused = _React$useState2[1];\n var _useTimeout = useTimeout(function () {\n onClose();\n }, life || 3000, !sticky && !focused),\n _useTimeout2 = _slicedToArray(_useTimeout, 1),\n clearTimer = _useTimeout2[0];\n var onClose = function onClose() {\n clearTimer();\n props.onClose && props.onClose(messageInfo);\n };\n var onClick = function onClick(event) {\n if (props.onClick && !(DomHandler.hasClass(event.target, 'p-toast-icon-close') || DomHandler.hasClass(event.target, 'p-toast-icon-close-icon'))) {\n props.onClick(messageInfo.message);\n }\n };\n var onMouseEnter = function onMouseEnter(event) {\n props.onMouseEnter && props.onMouseEnter(event);\n\n // do not continue if the user has canceled the event\n if (event.defaultPrevented) {\n return;\n }\n\n // stop timer while user has focused message\n if (!sticky) {\n clearTimer();\n setFocused(true);\n }\n };\n var onMouseLeave = function onMouseLeave(event) {\n props.onMouseLeave && props.onMouseLeave(event);\n\n // do not continue if the user has canceled the event\n if (event.defaultPrevented) {\n return;\n }\n\n // restart timer when user has left message\n if (!sticky) {\n setFocused(false);\n }\n };\n var createCloseIcon = function createCloseIcon() {\n if (closable !== false) {\n return /*#__PURE__*/React.createElement(\"div\", null, /*#__PURE__*/React.createElement(\"button\", {\n type: \"button\",\n className: \"p-toast-icon-close p-link\",\n onClick: onClose,\n \"aria-label\": localeOption('close')\n }, /*#__PURE__*/React.createElement(\"span\", {\n className: \"p-toast-icon-close-icon pi pi-times\",\n \"aria-hidden\": \"true\"\n }), /*#__PURE__*/React.createElement(Ripple, null)));\n }\n return null;\n };\n var createMessage = function createMessage() {\n if (messageInfo) {\n var contentEl = ObjectUtils.getJSXElement(content, {\n message: messageInfo.message,\n onClick: onClick,\n onClose: onClose\n });\n var iconClassName = classNames('p-toast-message-icon pi', {\n 'pi-info-circle': severity === 'info',\n 'pi-exclamation-triangle': severity === 'warn',\n 'pi-times': severity === 'error',\n 'pi-check': severity === 'success'\n });\n return contentEl || /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(\"span\", {\n className: iconClassName\n }), /*#__PURE__*/React.createElement(\"div\", {\n className: \"p-toast-message-text\"\n }, /*#__PURE__*/React.createElement(\"span\", {\n className: \"p-toast-summary\"\n }, summary), detail && /*#__PURE__*/React.createElement(\"div\", {\n className: \"p-toast-detail\"\n }, detail)));\n }\n return null;\n };\n var className = classNames('p-toast-message', _defineProperty({}, \"p-toast-message-\".concat(severity), severity), _className);\n var contentClassName = classNames('p-toast-message-content', _contentClassName);\n var message = createMessage();\n var closeIcon = createCloseIcon();\n return /*#__PURE__*/React.createElement(\"div\", {\n ref: ref,\n className: className,\n style: style,\n role: \"alert\",\n \"aria-live\": \"assertive\",\n \"aria-atomic\": \"true\",\n onClick: onClick,\n onMouseEnter: onMouseEnter,\n onMouseLeave: onMouseLeave\n }, /*#__PURE__*/React.createElement(\"div\", {\n className: contentClassName,\n style: contentStyle\n }, message, closeIcon));\n}));\nToastMessage.displayName = 'ToastMessage';\n\nvar messageIdx = 0;\nvar Toast = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (props, ref) {\n var _React$useState = React.useState([]),\n _React$useState2 = _slicedToArray(_React$useState, 2),\n messagesState = _React$useState2[0],\n setMessagesState = _React$useState2[1];\n var containerRef = React.useRef(null);\n var show = function show(messageInfo) {\n if (messageInfo) {\n var messages = assignIdentifiers(messageInfo, true);\n messagesState.length === 0 && ZIndexUtils.set('toast', containerRef.current, PrimeReact$1.autoZIndex, props.baseZIndex || PrimeReact$1.zIndex['toast']);\n setMessagesState(messages);\n }\n };\n var assignIdentifiers = function assignIdentifiers(messageInfo, copy) {\n var messages;\n if (Array.isArray(messageInfo)) {\n var multipleMessages = messageInfo.reduce(function (acc, message) {\n acc.push({\n _pId: messageIdx++,\n message: message\n });\n return acc;\n }, []);\n if (copy) {\n messages = messagesState ? [].concat(_toConsumableArray(messagesState), _toConsumableArray(multipleMessages)) : multipleMessages;\n } else {\n messages = multipleMessages;\n }\n } else {\n var message = {\n _pId: messageIdx++,\n message: messageInfo\n };\n if (copy) {\n messages = messagesState ? [].concat(_toConsumableArray(messagesState), [message]) : [message];\n } else {\n messages = [message];\n }\n }\n return messages;\n };\n var clear = function clear() {\n ZIndexUtils.clear(containerRef.current);\n setMessagesState([]);\n };\n var replace = function replace(messageInfo) {\n var replaced = assignIdentifiers(messageInfo, false);\n setMessagesState(replaced);\n };\n var remove = function remove(messageInfo) {\n var messages = messagesState.filter(function (msg) {\n return msg._pId !== messageInfo._pId;\n });\n setMessagesState(messages);\n props.onRemove && props.onRemove(messageInfo.message);\n };\n var onClose = function onClose(messageInfo) {\n remove(messageInfo);\n };\n var onEntered = function onEntered() {\n props.onShow && props.onShow();\n };\n var onExited = function onExited() {\n messagesState.length === 1 && ZIndexUtils.clear(containerRef.current);\n props.onHide && props.onHide();\n };\n useUnmountEffect(function () {\n ZIndexUtils.clear(containerRef.current);\n });\n React.useImperativeHandle(ref, function () {\n return {\n props: props,\n show: show,\n replace: replace,\n remove: remove,\n clear: clear,\n getElement: function getElement() {\n return containerRef.current;\n }\n };\n });\n var createElement = function createElement() {\n var otherProps = ObjectUtils.findDiffKeys(props, Toast.defaultProps);\n var className = classNames('p-toast p-component p-toast-' + props.position, props.className);\n return /*#__PURE__*/React.createElement(\"div\", _extends({\n ref: containerRef,\n id: props.id,\n className: className,\n style: props.style\n }, otherProps), /*#__PURE__*/React.createElement(TransitionGroup, null, messagesState && messagesState.map(function (messageInfo) {\n var messageRef = /*#__PURE__*/React.createRef();\n return /*#__PURE__*/React.createElement(CSSTransition, {\n nodeRef: messageRef,\n key: messageInfo._pId,\n classNames: \"p-toast-message\",\n unmountOnExit: true,\n timeout: {\n enter: 300,\n exit: 300\n },\n onEntered: onEntered,\n onExited: onExited,\n options: props.transitionOptions\n }, /*#__PURE__*/React.createElement(ToastMessage, {\n ref: messageRef,\n messageInfo: messageInfo,\n onClick: props.onClick,\n onClose: onClose,\n onMouseEnter: props.onMouseEnter,\n onMouseLeave: props.onMouseLeave\n }));\n })));\n };\n var element = createElement();\n return /*#__PURE__*/React.createElement(Portal, {\n element: element,\n appendTo: props.appendTo\n });\n}));\nToast.displayName = 'Toast';\nToast.defaultProps = {\n __TYPE: 'Toast',\n id: null,\n className: null,\n style: null,\n baseZIndex: 0,\n position: 'top-right',\n transitionOptions: null,\n appendTo: 'self',\n onClick: null,\n onRemove: null,\n onShow: null,\n onHide: null,\n onMouseEnter: null,\n onMouseLeave: null\n};\n\nexport { Toast };\n","import * as React from 'react';\nimport PrimeReact, { localeOption } from 'primereact/api';\nimport { CSSTransition } from 'primereact/csstransition';\nimport { useEventListener, useMountEffect, useUpdateEffect, useUnmountEffect } from 'primereact/hooks';\nimport { Portal } from 'primereact/portal';\nimport { Ripple } from 'primereact/ripple';\nimport { DomHandler, UniqueComponentId, ZIndexUtils, ObjectUtils, classNames } from 'primereact/utils';\n\nfunction _extends() {\n _extends = Object.assign ? Object.assign.bind() : function (target) {\n for (var i = 1; i < arguments.length; i++) {\n var source = arguments[i];\n for (var key in source) {\n if (Object.prototype.hasOwnProperty.call(source, key)) {\n target[key] = source[key];\n }\n }\n }\n return target;\n };\n return _extends.apply(this, arguments);\n}\n\nfunction _arrayLikeToArray(arr, len) {\n if (len == null || len > arr.length) len = arr.length;\n for (var i = 0, arr2 = new Array(len); i < len; i++) {\n arr2[i] = arr[i];\n }\n return arr2;\n}\n\nfunction _arrayWithoutHoles(arr) {\n if (Array.isArray(arr)) return _arrayLikeToArray(arr);\n}\n\nfunction _iterableToArray(iter) {\n if (typeof Symbol !== \"undefined\" && iter[Symbol.iterator] != null || iter[\"@@iterator\"] != null) return Array.from(iter);\n}\n\nfunction _unsupportedIterableToArray(o, minLen) {\n if (!o) return;\n if (typeof o === \"string\") return _arrayLikeToArray(o, minLen);\n var n = Object.prototype.toString.call(o).slice(8, -1);\n if (n === \"Object\" && o.constructor) n = o.constructor.name;\n if (n === \"Map\" || n === \"Set\") return Array.from(o);\n if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);\n}\n\nfunction _nonIterableSpread() {\n throw new TypeError(\"Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\");\n}\n\nfunction _toConsumableArray(arr) {\n return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread();\n}\n\nfunction _arrayWithHoles(arr) {\n if (Array.isArray(arr)) return arr;\n}\n\nfunction _iterableToArrayLimit(arr, i) {\n var _i = null == arr ? null : \"undefined\" != typeof Symbol && arr[Symbol.iterator] || arr[\"@@iterator\"];\n if (null != _i) {\n var _s,\n _e,\n _x,\n _r,\n _arr = [],\n _n = !0,\n _d = !1;\n try {\n if (_x = (_i = _i.call(arr)).next, 0 === i) {\n if (Object(_i) !== _i) return;\n _n = !1;\n } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0) {\n ;\n }\n } catch (err) {\n _d = !0, _e = err;\n } finally {\n try {\n if (!_n && null != _i[\"return\"] && (_r = _i[\"return\"](), Object(_r) !== _r)) return;\n } finally {\n if (_d) throw _e;\n }\n }\n return _arr;\n }\n}\n\nfunction _nonIterableRest() {\n throw new TypeError(\"Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\");\n}\n\nfunction _slicedToArray(arr, i) {\n return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();\n}\n\nvar Dialog = /*#__PURE__*/React.forwardRef(function (props, ref) {\n var _React$useState = React.useState(props.id),\n _React$useState2 = _slicedToArray(_React$useState, 2),\n idState = _React$useState2[0],\n setIdState = _React$useState2[1];\n var _React$useState3 = React.useState(false),\n _React$useState4 = _slicedToArray(_React$useState3, 2),\n maskVisibleState = _React$useState4[0],\n setMaskVisibleState = _React$useState4[1];\n var _React$useState5 = React.useState(false),\n _React$useState6 = _slicedToArray(_React$useState5, 2),\n visibleState = _React$useState6[0],\n setVisibleState = _React$useState6[1];\n var _React$useState7 = React.useState(props.maximized),\n _React$useState8 = _slicedToArray(_React$useState7, 2),\n maximizedState = _React$useState8[0],\n setMaximizedState = _React$useState8[1];\n var dialogRef = React.useRef(null);\n var maskRef = React.useRef(null);\n var contentRef = React.useRef(null);\n var headerRef = React.useRef(null);\n var footerRef = React.useRef(null);\n var closeRef = React.useRef(null);\n var dragging = React.useRef(false);\n var resizing = React.useRef(false);\n var lastPageX = React.useRef(null);\n var lastPageY = React.useRef(null);\n var styleElement = React.useRef(null);\n var attributeSelector = React.useRef('');\n var maximized = props.onMaximize ? props.maximized : maximizedState;\n var _useEventListener = useEventListener({\n type: 'keydown',\n listener: function listener(event) {\n return onKeyDown(event);\n }\n }),\n _useEventListener2 = _slicedToArray(_useEventListener, 2),\n bindDocumentKeyDownListener = _useEventListener2[0],\n unbindDocumentKeyDownListener = _useEventListener2[1];\n var _useEventListener3 = useEventListener({\n type: 'mousemove',\n target: function target() {\n return window.document;\n },\n listener: function listener(event) {\n return onResize(event);\n }\n }),\n _useEventListener4 = _slicedToArray(_useEventListener3, 2),\n bindDocumentResizeListener = _useEventListener4[0],\n unbindDocumentResizeListener = _useEventListener4[1];\n var _useEventListener5 = useEventListener({\n type: 'mouseup',\n target: function target() {\n return window.document;\n },\n listener: function listener(event) {\n return onResizeEnd(event);\n }\n }),\n _useEventListener6 = _slicedToArray(_useEventListener5, 2),\n bindDocumentResizeEndListener = _useEventListener6[0],\n unbindDocumentResizEndListener = _useEventListener6[1];\n var _useEventListener7 = useEventListener({\n type: 'mousemove',\n target: function target() {\n return window.document;\n },\n listener: function listener(event) {\n return onDrag(event);\n }\n }),\n _useEventListener8 = _slicedToArray(_useEventListener7, 2),\n bindDocumentDragListener = _useEventListener8[0],\n unbindDocumentDragListener = _useEventListener8[1];\n var _useEventListener9 = useEventListener({\n type: 'mouseup',\n target: function target() {\n return window.document;\n },\n listener: function listener(event) {\n return onDragEnd(event);\n }\n }),\n _useEventListener10 = _slicedToArray(_useEventListener9, 2),\n bindDocumentDragEndListener = _useEventListener10[0],\n unbindDocumentDragEndListener = _useEventListener10[1];\n var onClose = function onClose(event) {\n props.onHide();\n event.preventDefault();\n };\n var focus = function focus() {\n var activeElement = document.activeElement;\n var isActiveElementInDialog = activeElement && dialogRef.current && dialogRef.current.contains(activeElement);\n if (!isActiveElementInDialog && props.closable && props.showHeader) {\n closeRef.current.focus();\n }\n };\n var onMaskClick = function onMaskClick(event) {\n if (props.dismissableMask && props.modal && maskRef.current === event.target) {\n onClose(event);\n }\n props.onMaskClick && props.onMaskClick(event);\n };\n var toggleMaximize = function toggleMaximize(event) {\n if (props.onMaximize) {\n props.onMaximize({\n originalEvent: event,\n maximized: !maximized\n });\n } else {\n setMaximizedState(function (prevMaximized) {\n return !prevMaximized;\n });\n }\n event.preventDefault();\n };\n var onKeyDown = function onKeyDown(event) {\n var currentTarget = event.currentTarget;\n if (!currentTarget || !currentTarget.primeDialogParams) {\n return;\n }\n var params = currentTarget.primeDialogParams;\n var paramLength = params.length;\n var dialogId = params[paramLength - 1] ? params[paramLength - 1].id : undefined;\n if (dialogId !== idState) {\n return;\n }\n var dialog = document.getElementById(dialogId);\n if (props.closable && props.closeOnEscape && event.key === 'Escape') {\n onClose(event);\n event.stopImmediatePropagation();\n params.splice(paramLength - 1, 1);\n } else if (event.key === 'Tab') {\n event.preventDefault();\n var focusableElements = DomHandler.getFocusableElements(dialog);\n if (focusableElements && focusableElements.length > 0) {\n if (!document.activeElement) {\n focusableElements[0].focus();\n } else {\n var focusedIndex = focusableElements.indexOf(document.activeElement);\n if (event.shiftKey) {\n if (focusedIndex === -1 || focusedIndex === 0) focusableElements[focusableElements.length - 1].focus();else focusableElements[focusedIndex - 1].focus();\n } else {\n if (focusedIndex === -1 || focusedIndex === focusableElements.length - 1) focusableElements[0].focus();else focusableElements[focusedIndex + 1].focus();\n }\n }\n }\n }\n };\n var onDragStart = function onDragStart(event) {\n if (DomHandler.hasClass(event.target, 'p-dialog-header-icon') || DomHandler.hasClass(event.target.parentElement, 'p-dialog-header-icon')) {\n return;\n }\n if (props.draggable) {\n dragging.current = true;\n lastPageX.current = event.pageX;\n lastPageY.current = event.pageY;\n dialogRef.current.style.margin = '0';\n DomHandler.addClass(document.body, 'p-unselectable-text');\n props.onDragStart && props.onDragStart(event);\n }\n };\n var onDrag = function onDrag(event) {\n if (dragging.current) {\n var width = DomHandler.getOuterWidth(dialogRef.current);\n var height = DomHandler.getOuterHeight(dialogRef.current);\n var deltaX = event.pageX - lastPageX.current;\n var deltaY = event.pageY - lastPageY.current;\n var offset = dialogRef.current.getBoundingClientRect();\n var leftPos = offset.left + deltaX;\n var topPos = offset.top + deltaY;\n var viewport = DomHandler.getViewport();\n dialogRef.current.style.position = 'fixed';\n if (props.keepInViewport) {\n if (leftPos >= props.minX && leftPos + width < viewport.width) {\n lastPageX.current = event.pageX;\n dialogRef.current.style.left = leftPos + 'px';\n }\n if (topPos >= props.minY && topPos + height < viewport.height) {\n lastPageY.current = event.pageY;\n dialogRef.current.style.top = topPos + 'px';\n }\n } else {\n lastPageX.current = event.pageX;\n dialogRef.current.style.left = leftPos + 'px';\n lastPageY.current = event.pageY;\n dialogRef.current.style.top = topPos + 'px';\n }\n props.onDrag && props.onDrag(event);\n }\n };\n var onDragEnd = function onDragEnd(event) {\n if (dragging.current) {\n dragging.current = false;\n DomHandler.removeClass(document.body, 'p-unselectable-text');\n props.onDragEnd && props.onDragEnd(event);\n }\n };\n var onResizeStart = function onResizeStart(event) {\n if (props.resizable) {\n resizing.current = true;\n lastPageX.current = event.pageX;\n lastPageY.current = event.pageY;\n DomHandler.addClass(document.body, 'p-unselectable-text');\n props.onResizeStart && props.onResizeStart(event);\n }\n };\n var convertToPx = function convertToPx(value, property, viewport) {\n !viewport && (viewport = DomHandler.getViewport());\n var val = parseInt(value);\n if (/^(\\d+|(\\.\\d+))(\\.\\d+)?%$/.test(value)) {\n return val * (viewport[property] / 100);\n }\n return val;\n };\n var onResize = function onResize(event) {\n if (resizing.current) {\n var deltaX = event.pageX - lastPageX.current;\n var deltaY = event.pageY - lastPageY.current;\n var width = DomHandler.getOuterWidth(dialogRef.current);\n var height = DomHandler.getOuterHeight(dialogRef.current);\n var offset = dialogRef.current.getBoundingClientRect();\n var viewport = DomHandler.getViewport();\n var hasBeenDragged = !parseInt(dialogRef.current.style.top) || !parseInt(dialogRef.current.style.left);\n var minWidth = convertToPx(dialogRef.current.style.minWidth, 'width', viewport);\n var minHeight = convertToPx(dialogRef.current.style.minHeight, 'height', viewport);\n var newWidth = width + deltaX;\n var newHeight = height + deltaY;\n if (hasBeenDragged) {\n newWidth += deltaX;\n newHeight += deltaY;\n }\n if ((!minWidth || newWidth > minWidth) && offset.left + newWidth < viewport.width) {\n dialogRef.current.style.width = newWidth + 'px';\n }\n if ((!minHeight || newHeight > minHeight) && offset.top + newHeight < viewport.height) {\n dialogRef.current.style.height = newHeight + 'px';\n }\n lastPageX.current = event.pageX;\n lastPageY.current = event.pageY;\n props.onResize && props.onResize(event);\n }\n };\n var onResizeEnd = function onResizeEnd(event) {\n if (resizing.current) {\n resizing.current = false;\n DomHandler.removeClass(document.body, 'p-unselectable-text');\n props.onResizeEnd && props.onResizeEnd(event);\n }\n };\n var resetPosition = function resetPosition() {\n dialogRef.current.style.position = '';\n dialogRef.current.style.left = '';\n dialogRef.current.style.top = '';\n dialogRef.current.style.margin = '';\n };\n var getPositionClass = function getPositionClass() {\n var positions = ['center', 'left', 'right', 'top', 'top-left', 'top-right', 'bottom', 'bottom-left', 'bottom-right'];\n var pos = positions.find(function (item) {\n return item === props.position || item.replace('-', '') === props.position;\n });\n return pos ? \"p-dialog-\".concat(pos) : '';\n };\n var onEnter = function onEnter() {\n dialogRef.current.setAttribute(attributeSelector.current, '');\n };\n var onEntered = function onEntered() {\n props.onShow && props.onShow();\n if (props.focusOnShow) {\n focus();\n }\n enableDocumentSettings();\n };\n var onExiting = function onExiting() {\n if (props.modal) {\n DomHandler.addClass(maskRef.current, 'p-component-overlay-leave');\n }\n if (props.blockScroll) {\n DomHandler.removeClass(document.body, 'p-overflow-hidden');\n }\n };\n var onExited = function onExited() {\n dragging.current = false;\n ZIndexUtils.clear(maskRef.current);\n setMaskVisibleState(false);\n disableDocumentSettings();\n };\n var enableDocumentSettings = function enableDocumentSettings() {\n bindGlobalListeners();\n if (props.blockScroll || props.maximizable && maximized) {\n DomHandler.addClass(document.body, 'p-overflow-hidden');\n }\n };\n var disableDocumentSettings = function disableDocumentSettings() {\n unbindGlobalListeners();\n var isMaximized = props.maximizable && maximized;\n if (props.modal) {\n var hasBlockScroll = document.primeDialogParams && document.primeDialogParams.some(function (param) {\n return param.hasBlockScroll;\n });\n if (hasBlockScroll || isMaximized) {\n DomHandler.removeClass(document.body, 'p-overflow-hidden');\n }\n } else if (props.blockScroll || isMaximized) {\n DomHandler.removeClass(document.body, 'p-overflow-hidden');\n }\n };\n var bindGlobalListeners = function bindGlobalListeners() {\n if (props.draggable) {\n bindDocumentDragListener();\n bindDocumentDragEndListener();\n }\n if (props.resizable) {\n bindDocumentResizeListener();\n bindDocumentResizeEndListener();\n }\n bindDocumentKeyDownListener();\n var newParam = {\n id: idState,\n hasBlockScroll: props.blockScroll\n };\n document.primeDialogParams = document.primeDialogParams ? [].concat(_toConsumableArray(document.primeDialogParams), [newParam]) : [newParam];\n };\n var unbindGlobalListeners = function unbindGlobalListeners() {\n unbindDocumentDragListener();\n unbindDocumentDragEndListener();\n unbindDocumentResizeListener();\n unbindDocumentResizEndListener();\n unbindDocumentKeyDownListener();\n document.primeDialogParams = document.primeDialogParams && document.primeDialogParams.filter(function (param) {\n return param.id !== idState;\n });\n };\n var createStyle = function createStyle() {\n if (!styleElement.current) {\n styleElement.current = DomHandler.createInlineStyle(PrimeReact.nonce);\n var innerHTML = '';\n for (var breakpoint in props.breakpoints) {\n 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 \");\n }\n styleElement.current.innerHTML = innerHTML;\n }\n };\n var changeScrollOnMaximizable = function changeScrollOnMaximizable() {\n if (!props.blockScroll) {\n var funcName = maximized ? 'addClass' : 'removeClass';\n DomHandler[funcName](document.body, 'p-overflow-hidden');\n }\n };\n useMountEffect(function () {\n var unqiueId = UniqueComponentId();\n if (!idState) {\n setIdState(unqiueId);\n }\n if (!attributeSelector.current) {\n attributeSelector.current = unqiueId;\n }\n if (props.visible) {\n setMaskVisibleState(true);\n }\n if (props.breakpoints) {\n createStyle();\n }\n });\n useUpdateEffect(function () {\n if (props.visible && !maskVisibleState) {\n setMaskVisibleState(true);\n }\n if (props.visible !== visibleState && maskVisibleState) {\n setVisibleState(props.visible);\n }\n });\n useUpdateEffect(function () {\n if (maskVisibleState) {\n ZIndexUtils.set('modal', maskRef.current, PrimeReact.autoZIndex, props.baseZIndex || PrimeReact.zIndex['modal']);\n setVisibleState(true);\n }\n }, [maskVisibleState]);\n useUpdateEffect(function () {\n changeScrollOnMaximizable();\n }, [props.maximized, maximizedState]);\n useUnmountEffect(function () {\n disableDocumentSettings();\n DomHandler.removeInlineStyle(styleElement.current);\n ZIndexUtils.clear(maskRef.current);\n });\n React.useImperativeHandle(ref, function () {\n return {\n props: props,\n resetPosition: resetPosition,\n getElement: function getElement() {\n return dialogRef.current;\n },\n getMask: function getMask() {\n return maskRef.current;\n },\n getContent: function getContent() {\n return contentRef.current;\n },\n getHeader: function getHeader() {\n return headerRef.current;\n },\n getFooter: function getFooter() {\n return footerRef.current;\n },\n getCloseButton: function getCloseButton() {\n return closeRef.current;\n }\n };\n });\n var createCloseIcon = function createCloseIcon() {\n if (props.closable) {\n var ariaLabel = props.ariaCloseIconLabel || localeOption('close');\n return /*#__PURE__*/React.createElement(\"button\", {\n ref: closeRef,\n type: \"button\",\n className: \"p-dialog-header-icon p-dialog-header-close p-link\",\n \"aria-label\": ariaLabel,\n onClick: onClose\n }, /*#__PURE__*/React.createElement(\"span\", {\n className: \"p-dialog-header-close-icon pi pi-times\",\n \"aria-hidden\": \"true\"\n }), /*#__PURE__*/React.createElement(Ripple, null));\n }\n return null;\n };\n var createMaximizeIcon = function createMaximizeIcon() {\n var iconClassName = classNames('p-dialog-header-maximize-icon pi', {\n 'pi-window-maximize': !maximized,\n 'pi-window-minimize': maximized\n });\n if (props.maximizable) {\n return /*#__PURE__*/React.createElement(\"button\", {\n type: \"button\",\n className: \"p-dialog-header-icon p-dialog-header-maximize p-link\",\n onClick: toggleMaximize\n }, /*#__PURE__*/React.createElement(\"span\", {\n className: iconClassName\n }), /*#__PURE__*/React.createElement(Ripple, null));\n }\n return null;\n };\n var createHeader = function createHeader() {\n if (props.showHeader) {\n var closeIcon = createCloseIcon();\n var maximizeIcon = createMaximizeIcon();\n var icons = ObjectUtils.getJSXElement(props.icons, props);\n var header = ObjectUtils.getJSXElement(props.header, props);\n var headerId = idState + '_header';\n var headerClassName = classNames('p-dialog-header', props.headerClassName);\n return /*#__PURE__*/React.createElement(\"div\", {\n ref: headerRef,\n style: props.headerStyle,\n className: headerClassName,\n onMouseDown: onDragStart\n }, /*#__PURE__*/React.createElement(\"div\", {\n id: headerId,\n className: \"p-dialog-title\"\n }, header), /*#__PURE__*/React.createElement(\"div\", {\n className: \"p-dialog-header-icons\"\n }, icons, maximizeIcon, closeIcon));\n }\n return null;\n };\n var createContent = function createContent() {\n var className = classNames('p-dialog-content', props.contentClassName);\n var contentId = idState + '_content';\n return /*#__PURE__*/React.createElement(\"div\", {\n id: contentId,\n ref: contentRef,\n className: className,\n style: props.contentStyle\n }, props.children);\n };\n var createFooter = function createFooter() {\n var footer = ObjectUtils.getJSXElement(props.footer, props);\n return footer && /*#__PURE__*/React.createElement(\"div\", {\n ref: footerRef,\n className: \"p-dialog-footer\"\n }, footer);\n };\n var createResizer = function createResizer() {\n if (props.resizable) {\n return /*#__PURE__*/React.createElement(\"span\", {\n className: \"p-resizable-handle\",\n style: {\n zIndex: 90\n },\n onMouseDown: onResizeStart\n });\n }\n return null;\n };\n var createElement = function createElement() {\n var otherProps = ObjectUtils.findDiffKeys(props, Dialog.defaultProps);\n var className = classNames('p-dialog p-component', props.className, {\n 'p-dialog-rtl': props.rtl,\n 'p-dialog-maximized': maximized,\n 'p-dialog-default': !maximized\n });\n var maskClassName = classNames('p-dialog-mask', getPositionClass(), {\n 'p-component-overlay p-component-overlay-enter': props.modal,\n 'p-dialog-visible': maskVisibleState,\n 'p-dialog-draggable': props.draggable,\n 'p-dialog-resizable': props.resizable\n }, props.maskClassName);\n var header = createHeader();\n var content = createContent();\n var footer = createFooter();\n var resizer = createResizer();\n var headerId = idState + '_header';\n var contentId = idState + '_content';\n var transitionTimeout = {\n enter: props.position === 'center' ? 150 : 300,\n exit: props.position === 'center' ? 150 : 300\n };\n return /*#__PURE__*/React.createElement(\"div\", {\n ref: maskRef,\n style: props.maskStyle,\n className: maskClassName,\n onClick: onMaskClick\n }, /*#__PURE__*/React.createElement(CSSTransition, {\n nodeRef: dialogRef,\n classNames: \"p-dialog\",\n timeout: transitionTimeout,\n \"in\": visibleState,\n options: props.transitionOptions,\n unmountOnExit: true,\n onEnter: onEnter,\n onEntered: onEntered,\n onExiting: onExiting,\n onExited: onExited\n }, /*#__PURE__*/React.createElement(\"div\", _extends({\n ref: dialogRef,\n id: idState,\n className: className,\n style: props.style,\n onClick: props.onClick,\n role: \"dialog\"\n }, otherProps, {\n \"aria-labelledby\": headerId,\n \"aria-describedby\": contentId,\n \"aria-modal\": props.modal\n }), header, content, footer, resizer)));\n };\n var createDialog = function createDialog() {\n var element = createElement();\n return /*#__PURE__*/React.createElement(Portal, {\n element: element,\n appendTo: props.appendTo,\n visible: true\n });\n };\n return maskVisibleState && createDialog();\n});\nDialog.displayName = 'Dialog';\nDialog.defaultProps = {\n __TYPE: 'Dialog',\n appendTo: null,\n ariaCloseIconLabel: null,\n baseZIndex: 0,\n blockScroll: false,\n breakpoints: null,\n className: null,\n closable: true,\n closeOnEscape: true,\n contentClassName: null,\n contentStyle: null,\n dismissableMask: false,\n draggable: true,\n focusOnShow: true,\n footer: null,\n header: null,\n headerClassName: null,\n headerStyle: null,\n icons: null,\n id: null,\n keepInViewport: true,\n maskClassName: null,\n maskStyle: null,\n maximizable: false,\n maximized: false,\n minX: 0,\n minY: 0,\n modal: true,\n onClick: null,\n onDrag: null,\n onDragEnd: null,\n onDragStart: null,\n onHide: null,\n onMaskClick: null,\n onMaximize: null,\n onResize: null,\n onResizeEnd: null,\n onResizeStart: null,\n onShow: null,\n position: 'center',\n resizable: true,\n rtl: false,\n showHeader: true,\n style: null,\n transitionOptions: null,\n visible: false\n};\n\nexport { Dialog };\n","import * as React from 'react';\nimport { useUpdateEffect } from 'primereact/hooks';\nimport { Tooltip } from 'primereact/tooltip';\nimport { ObjectUtils, DomHandler, classNames, IconUtils } from 'primereact/utils';\n\nfunction _extends() {\n _extends = Object.assign ? Object.assign.bind() : function (target) {\n for (var i = 1; i < arguments.length; i++) {\n var source = arguments[i];\n for (var key in source) {\n if (Object.prototype.hasOwnProperty.call(source, key)) {\n target[key] = source[key];\n }\n }\n }\n return target;\n };\n return _extends.apply(this, arguments);\n}\n\nfunction _arrayWithHoles(arr) {\n if (Array.isArray(arr)) return arr;\n}\n\nfunction _iterableToArrayLimit(arr, i) {\n var _i = null == arr ? null : \"undefined\" != typeof Symbol && arr[Symbol.iterator] || arr[\"@@iterator\"];\n if (null != _i) {\n var _s,\n _e,\n _x,\n _r,\n _arr = [],\n _n = !0,\n _d = !1;\n try {\n if (_x = (_i = _i.call(arr)).next, 0 === i) {\n if (Object(_i) !== _i) return;\n _n = !1;\n } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0) {\n ;\n }\n } catch (err) {\n _d = !0, _e = err;\n } finally {\n try {\n if (!_n && null != _i[\"return\"] && (_r = _i[\"return\"](), Object(_r) !== _r)) return;\n } finally {\n if (_d) throw _e;\n }\n }\n return _arr;\n }\n}\n\nfunction _arrayLikeToArray(arr, len) {\n if (len == null || len > arr.length) len = arr.length;\n for (var i = 0, arr2 = new Array(len); i < len; i++) {\n arr2[i] = arr[i];\n }\n return arr2;\n}\n\nfunction _unsupportedIterableToArray(o, minLen) {\n if (!o) return;\n if (typeof o === \"string\") return _arrayLikeToArray(o, minLen);\n var n = Object.prototype.toString.call(o).slice(8, -1);\n if (n === \"Object\" && o.constructor) n = o.constructor.name;\n if (n === \"Map\" || n === \"Set\") return Array.from(o);\n if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);\n}\n\nfunction _nonIterableRest() {\n throw new TypeError(\"Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\");\n}\n\nfunction _slicedToArray(arr, i) {\n return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();\n}\n\nvar Checkbox = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (props, ref) {\n var _React$useState = React.useState(false),\n _React$useState2 = _slicedToArray(_React$useState, 2),\n focusedState = _React$useState2[0],\n setFocusedState = _React$useState2[1];\n var elementRef = React.useRef(null);\n var inputRef = React.useRef(props.inputRef);\n var onClick = function onClick(event) {\n if (!props.disabled && !props.readOnly && props.onChange) {\n var _checked = isChecked();\n var checkboxClicked = event.target instanceof HTMLDivElement || event.target instanceof HTMLSpanElement;\n var isInputToggled = event.target === inputRef.current;\n var isCheckboxToggled = checkboxClicked && event.target.checked !== _checked;\n if (isInputToggled || isCheckboxToggled) {\n var value = _checked ? props.falseValue : props.trueValue;\n props.onChange({\n originalEvent: event,\n value: props.value,\n checked: value,\n stopPropagation: function stopPropagation() {},\n preventDefault: function preventDefault() {},\n target: {\n type: 'checkbox',\n name: props.name,\n id: props.id,\n value: props.value,\n checked: value\n }\n });\n }\n DomHandler.focus(inputRef.current);\n event.preventDefault();\n }\n };\n var onFocus = function onFocus() {\n setFocusedState(true);\n };\n var onBlur = function onBlur() {\n setFocusedState(false);\n };\n var onKeyDown = function onKeyDown(event) {\n if (event.code === 'Space') {\n onClick(event);\n }\n };\n var isChecked = function isChecked() {\n return props.checked === props.trueValue;\n };\n React.useImperativeHandle(ref, function () {\n return {\n props: props,\n getElement: function getElement() {\n return elementRef.current;\n },\n getInput: function getInput() {\n return inputRef.current;\n }\n };\n });\n React.useEffect(function () {\n ObjectUtils.combinedRefs(inputRef, props.inputRef);\n }, [inputRef, props.inputRef]);\n useUpdateEffect(function () {\n inputRef.current.checked = isChecked();\n }, [props.checked, props.trueValue]);\n var checked = isChecked();\n var hasTooltip = ObjectUtils.isNotEmpty(props.tooltip);\n var otherProps = ObjectUtils.findDiffKeys(props, Checkbox.defaultProps);\n var ariaProps = ObjectUtils.reduceKeys(otherProps, DomHandler.ARIA_PROPS);\n var className = classNames('p-checkbox p-component', {\n 'p-checkbox-checked': checked,\n 'p-checkbox-disabled': props.disabled,\n 'p-checkbox-focused': focusedState\n }, props.className);\n var boxClass = classNames('p-checkbox-box', {\n 'p-highlight': checked,\n 'p-disabled': props.disabled,\n 'p-focus': focusedState\n });\n var icon = IconUtils.getJSXIcon(checked ? props.icon : '', {\n className: 'p-checkbox-icon p-c'\n }, {\n props: props,\n checked: checked\n });\n return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(\"div\", _extends({\n ref: elementRef,\n id: props.id,\n className: className,\n style: props.style\n }, otherProps, {\n onClick: onClick,\n onContextMenu: props.onContextMenu,\n onMouseDown: props.onMouseDown\n }), /*#__PURE__*/React.createElement(\"div\", {\n className: \"p-hidden-accessible\"\n }, /*#__PURE__*/React.createElement(\"input\", _extends({\n ref: inputRef,\n type: \"checkbox\",\n id: props.inputId,\n name: props.name,\n tabIndex: props.tabIndex,\n defaultChecked: checked,\n onFocus: onFocus,\n onBlur: onBlur,\n onKeyDown: onKeyDown,\n disabled: props.disabled,\n readOnly: props.readOnly,\n required: props.required\n }, ariaProps))), /*#__PURE__*/React.createElement(\"div\", {\n className: boxClass\n }, icon)), hasTooltip && /*#__PURE__*/React.createElement(Tooltip, _extends({\n target: elementRef,\n content: props.tooltip\n }, props.tooltipOptions)));\n}));\nCheckbox.displayName = 'Checkbox';\nCheckbox.defaultProps = {\n __TYPE: 'Checkbox',\n id: null,\n inputRef: null,\n inputId: null,\n value: null,\n name: null,\n checked: false,\n trueValue: true,\n falseValue: false,\n style: null,\n className: null,\n disabled: false,\n required: false,\n readOnly: false,\n tabIndex: null,\n icon: 'pi pi-check',\n tooltip: null,\n tooltipOptions: null,\n onChange: null,\n onMouseDown: null,\n onContextMenu: null\n};\n\nexport { Checkbox };\n","import React, { useEffect, useRef, useState } from \"react\";\nimport { Dialog } from \"primereact/dialog\";\nimport { Button } from \"primereact/button\";\nimport { Checkbox } from \"primereact/checkbox\";\n\nconst TermsAndCondition = ({ OnAccept, OnCancel }) => {\n const [isVisible, setVisible] = useState(true);\n const [isEnabled, setEnabled] = useState(false);\n const [elementRendered, setElementRendered] = useState(false);\n const [checked, setChecked] = useState(false);\n\n const handleCheckBox = (e) => {\n if (e.checked) {\n setEnabled(true);\n } else {\n setEnabled(false);\n }\n\n setChecked(e.checked);\n };\n\n const onAcceptTerms = () => {\n if (OnAccept) {\n OnAccept();\n }\n };\n\n const onCancelTerms = () => {\n if (OnCancel) {\n OnCancel();\n }\n };\n\n const Header = (\n <>\n Terms and Conditions
\n Accept to continue
\n \n );\n\n const footer = (\n <>\n \n
\n \n \n
\n
\n \n \n
\n
\n
\n Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad\n minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit\n in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui\n officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt\n ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo\n consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint\n occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur\n adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation\n ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore\n eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est\n laborum. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut\n enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in\n reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in\n culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor\n incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea\n commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur\n sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet,\n consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud\n exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse\n cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim\n id est laborum. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna\n aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure\n dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident,\n sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod\n tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip\n ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.\n Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit\n amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis\n nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit\n esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit\n anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore\n magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute\n irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.\n Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.\n
\n
\n
Create a Duqact Account
\n
Enter your names for personalized identification.
\n
\n
\n \n setSubmitted(false)}\n value={firstname}\n onChange={(e) => setFirstname(e.target.value)}\n placeholder=\"First name\"\n className={classNames({\n \"error-input\": submitted === true && !firstname\n })}\n />\n {submitted && !firstname && }\n
\n
\n \n setSubmitted(false)}\n type=\"text\"\n value={lastname}\n onChange={(e) => setLastname(e.target.value)}\n placeholder=\"Last name\"\n className={classNames({\n \"error-input\": submitted === true && !lastname\n })}\n />\n {submitted && !lastname && }\n
\n
\n \n\n \n
\n
\n
Bio data
\n
Enter your birthday and gender.
\n
\n
\n
\n \n setMonth(e.value)}\n options={months}\n placeholder=\"Month\"\n className={classNames({\n \"error-input-drop\": submitted === true && !month,\n \"drop-down month\": true\n })}\n />\n
\n
\n \n setSubmitted(false)}\n htmlFor=\"day\"\n //\n className={classNames({\n \"error-input\": submitted === true && !validateDay(day)\n })}\n onChange={(e) => setDay(e.target.value)}\n type=\"text\"\n placeholder=\"01\"\n />\n
\n
\n \n setYear(e.target.value)}\n type=\"text\"\n placeholder=\"2000\"\n className={classNames({\n \"error-input\": submitted === true && !isValidYear(year)\n })}\n >\n
\n {error &&
}\n
\n
\n \n setGender(e.value)}\n options={genderOptions}\n className={classNames({\n \"error-input-drop\": submitted === true && !gender,\n \"genderDr drop-down\": true\n })}\n placeholder=\"Gender\"\n optionLabel=\"name\"\n />\n {submitted && !gender && }\n
\n
\n \n\n \n
\n
\n
Primary phone number and Email
\n
For verification and authentication.
\n
\n
\n \n setSubmitted(false)}\n value={email}\n onChange={(e) => setEmail(e.target.value)}\n name=\"email\"\n type=\"email\"\n placeholder=\"Email\"\n //className={isInputValid1 ? '' : 'error-input'}\n className={classNames({\n \"error-input\": submitted === true && !isValidEmail(email)\n })}\n />\n {submitted && !isValidEmail(email) && }\n
\n
\n
\n
setPhoneNumber(e)}\n country={\"ug\"}\n inputProps={{\n required: true\n }}\n onFocus={() => setSubmitted(false)}\n />\n\n {submitted && !validateContact(phoneNumber) && }\n \n
\n \n \n
\n
\n
Password Security
\n
Enter a strong password you can remember.
\n
\n
\n \n {!hidden && }\n {hidden && }\n setSubmitted(false)}\n onChange={(e) => setNewPassword(e.target.value)}\n type={hidden ? \"password\" : \"text\"}\n placeholder=\"New Password\"\n //className={isInputValid1 ? '' : 'error-input'}\n className={classNames({\n \"error-input\": validatePassword(newpassword)[0] > 0\n })}\n />\n {newpassword && }\n
\n
\n \n setSubmitted(false)}\n onChange={(e) => setConfirmPassword(e.target.value)}\n type={hidden ? \"password\" : \"text\"}\n placeholder=\"Confirm Password\"\n //className={isInputValid2 ? '' : 'error-input'}\n className={classNames({\n \"error-input\": newpassword && confirmpassword !== newpassword\n })}\n />\n\n {newpassword && confirmpassword !== newpassword && }\n
\n
\n \n \n
\n
\n
Congratulation!
\n \n \n
\n Your account has been created successfully! Kindly wait for our team to verify your details and you will receive an email to access\n your account.\n
\n\n
\n \n
\n
\n
Error!
\n \n \n
{errorMessage}
\n\n
\n \n
\n
{store.getState()}
\r\n * }\r\n */\n\nexport const useReduxContext = /*#__PURE__*/createReduxContextHook();","import { useCallback, useDebugValue, useRef } from 'react';\nimport { createReduxContextHook, useReduxContext as useDefaultReduxContext } from './useReduxContext';\nimport { ReactReduxContext } from '../components/Context';\nimport { notInitialized } from '../utils/useSyncExternalStore';\nlet useSyncExternalStoreWithSelector = notInitialized;\nexport const initializeUseSelector = fn => {\n useSyncExternalStoreWithSelector = fn;\n};\n\nconst refEquality = (a, b) => a === b;\n/**\r\n * Hook factory, which creates a `useSelector` hook bound to a given context.\r\n *\r\n * @param {React.Context} [context=ReactReduxContext] Context passed to your ``.\r\n * @returns {Function} A `useSelector` hook bound to the specified context.\r\n */\n\n\nexport function createSelectorHook(context = ReactReduxContext) {\n const useReduxContext = context === ReactReduxContext ? useDefaultReduxContext : createReduxContextHook(context);\n return function useSelector(selector, equalityFnOrOptions = {}) {\n const {\n equalityFn = refEquality,\n stabilityCheck = undefined,\n noopCheck = undefined\n } = typeof equalityFnOrOptions === 'function' ? {\n equalityFn: equalityFnOrOptions\n } : equalityFnOrOptions;\n\n if (process.env.NODE_ENV !== 'production') {\n if (!selector) {\n throw new Error(`You must pass a selector to useSelector`);\n }\n\n if (typeof selector !== 'function') {\n throw new Error(`You must pass a function as a selector to useSelector`);\n }\n\n if (typeof equalityFn !== 'function') {\n throw new Error(`You must pass a function as an equality function to useSelector`);\n }\n }\n\n const {\n store,\n subscription,\n getServerState,\n stabilityCheck: globalStabilityCheck,\n noopCheck: globalNoopCheck\n } = useReduxContext();\n const firstRun = useRef(true);\n const wrappedSelector = useCallback({\n [selector.name](state) {\n const selected = selector(state);\n\n if (process.env.NODE_ENV !== 'production') {\n const finalStabilityCheck = typeof stabilityCheck === 'undefined' ? globalStabilityCheck : stabilityCheck;\n\n if (finalStabilityCheck === 'always' || finalStabilityCheck === 'once' && firstRun.current) {\n const toCompare = selector(state);\n\n if (!equalityFn(selected, toCompare)) {\n let stack = undefined;\n\n try {\n throw new Error();\n } catch (e) {\n ;\n ({\n stack\n } = e);\n }\n\n console.warn('Selector ' + (selector.name || 'unknown') + ' returned a different result when called with the same parameters. This can lead to unnecessary rerenders.' + '\\nSelectors that return a new reference (such as an object or an array) should be memoized: https://redux.js.org/usage/deriving-data-selectors#optimizing-selectors-with-memoization', {\n state,\n selected,\n selected2: toCompare,\n stack\n });\n }\n }\n\n const finalNoopCheck = typeof noopCheck === 'undefined' ? globalNoopCheck : noopCheck;\n\n if (finalNoopCheck === 'always' || finalNoopCheck === 'once' && firstRun.current) {\n // @ts-ignore\n if (selected === state) {\n let stack = undefined;\n\n try {\n throw new Error();\n } catch (e) {\n ;\n ({\n stack\n } = e);\n }\n\n console.warn('Selector ' + (selector.name || 'unknown') + ' returned the root state when called. This can lead to unnecessary rerenders.' + '\\nSelectors that return the entire state are almost certainly a mistake, as they will cause a rerender whenever *anything* in state changes.', {\n stack\n });\n }\n }\n\n if (firstRun.current) firstRun.current = false;\n }\n\n return selected;\n }\n\n }[selector.name], [selector, globalStabilityCheck, stabilityCheck]);\n const selectedState = useSyncExternalStoreWithSelector(subscription.addNestedSub, store.getState, getServerState || store.getState, wrappedSelector, equalityFn);\n useDebugValue(selectedState);\n return selectedState;\n };\n}\n/**\r\n * A hook to access the redux store's state. This hook takes a selector function\r\n * as an argument. The selector is called with the store state.\r\n *\r\n * This hook takes an optional equality comparison function as the second parameter\r\n * that allows you to customize the way the selected state is compared to determine\r\n * whether the component needs to be re-rendered.\r\n *\r\n * @param {Function} selector the selector function\r\n * @param {Function=} equalityFn the function that will be used to determine equality\r\n *\r\n * @returns {any} the selected state\r\n *\r\n * @example\r\n *\r\n * import React from 'react'\r\n * import { useSelector } from 'react-redux'\r\n *\r\n * export const CounterComponent = () => {\r\n * const counter = useSelector(state => state.counter)\r\n * return {counter}
\r\n * }\r\n */\n\nexport const useSelector = /*#__PURE__*/createSelectorHook();","export const notInitialized = () => {\n throw new Error('uSES not initialized!');\n};","import { getBatch } from './batch'; // encapsulates the subscription logic for connecting a component to the redux store, as\n// well as nesting subscriptions of descendant components, so that we can ensure the\n// ancestor components re-render before descendants\n\nfunction createListenerCollection() {\n const batch = getBatch();\n let first = null;\n let last = null;\n return {\n clear() {\n first = null;\n last = null;\n },\n\n notify() {\n batch(() => {\n let listener = first;\n\n while (listener) {\n listener.callback();\n listener = listener.next;\n }\n });\n },\n\n get() {\n let listeners = [];\n let listener = first;\n\n while (listener) {\n listeners.push(listener);\n listener = listener.next;\n }\n\n return listeners;\n },\n\n subscribe(callback) {\n let isSubscribed = true;\n let listener = last = {\n callback,\n next: null,\n prev: last\n };\n\n if (listener.prev) {\n listener.prev.next = listener;\n } else {\n first = listener;\n }\n\n return function unsubscribe() {\n if (!isSubscribed || first === null) return;\n isSubscribed = false;\n\n if (listener.next) {\n listener.next.prev = listener.prev;\n } else {\n last = listener.prev;\n }\n\n if (listener.prev) {\n listener.prev.next = listener.next;\n } else {\n first = listener.next;\n }\n };\n }\n\n };\n}\n\nconst nullListeners = {\n notify() {},\n\n get: () => []\n};\nexport function createSubscription(store, parentSub) {\n let unsubscribe;\n let listeners = nullListeners; // Reasons to keep the subscription active\n\n let subscriptionsAmount = 0; // Is this specific subscription subscribed (or only nested ones?)\n\n let selfSubscribed = false;\n\n function addNestedSub(listener) {\n trySubscribe();\n const cleanupListener = listeners.subscribe(listener); // cleanup nested sub\n\n let removed = false;\n return () => {\n if (!removed) {\n removed = true;\n cleanupListener();\n tryUnsubscribe();\n }\n };\n }\n\n function notifyNestedSubs() {\n listeners.notify();\n }\n\n function handleChangeWrapper() {\n if (subscription.onStateChange) {\n subscription.onStateChange();\n }\n }\n\n function isSubscribed() {\n return selfSubscribed;\n }\n\n function trySubscribe() {\n subscriptionsAmount++;\n\n if (!unsubscribe) {\n unsubscribe = parentSub ? parentSub.addNestedSub(handleChangeWrapper) : store.subscribe(handleChangeWrapper);\n listeners = createListenerCollection();\n }\n }\n\n function tryUnsubscribe() {\n subscriptionsAmount--;\n\n if (unsubscribe && subscriptionsAmount === 0) {\n unsubscribe();\n unsubscribe = undefined;\n listeners.clear();\n listeners = nullListeners;\n }\n }\n\n function trySubscribeSelf() {\n if (!selfSubscribed) {\n selfSubscribed = true;\n trySubscribe();\n }\n }\n\n function tryUnsubscribeSelf() {\n if (selfSubscribed) {\n selfSubscribed = false;\n tryUnsubscribe();\n }\n }\n\n const subscription = {\n addNestedSub,\n notifyNestedSubs,\n handleChangeWrapper,\n isSubscribed,\n trySubscribe: trySubscribeSelf,\n tryUnsubscribe: tryUnsubscribeSelf,\n getListeners: () => listeners\n };\n return subscription;\n}","import * as React from 'react'; // React currently throws a warning when using useLayoutEffect on the server.\n// To get around it, we can conditionally useEffect on the server (no-op) and\n// useLayoutEffect in the browser. We need useLayoutEffect to ensure the store\n// subscription callback always has the selector from the latest render commit\n// available, otherwise a store update may happen between render and the effect,\n// which may cause missed updates; we also must ensure the store subscription\n// is created synchronously, otherwise a store update may occur before the\n// subscription is created and an inconsistent state may be observed\n// Matches logic in React's `shared/ExecutionEnvironment` file\n\nexport const canUseDOM = !!(typeof window !== 'undefined' && typeof window.document !== 'undefined' && typeof window.document.createElement !== 'undefined');\nexport const useIsomorphicLayoutEffect = canUseDOM ? React.useLayoutEffect : React.useEffect;","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"reactReduxForwardedRef\"];\n\n/* eslint-disable valid-jsdoc, @typescript-eslint/no-unused-vars */\nimport hoistStatics from 'hoist-non-react-statics';\nimport * as React from 'react';\nimport { isValidElementType, isContextConsumer } from 'react-is';\nimport defaultSelectorFactory from '../connect/selectorFactory';\nimport { mapDispatchToPropsFactory } from '../connect/mapDispatchToProps';\nimport { mapStateToPropsFactory } from '../connect/mapStateToProps';\nimport { mergePropsFactory } from '../connect/mergeProps';\nimport { createSubscription } from '../utils/Subscription';\nimport { useIsomorphicLayoutEffect } from '../utils/useIsomorphicLayoutEffect';\nimport shallowEqual from '../utils/shallowEqual';\nimport warning from '../utils/warning';\nimport { ReactReduxContext } from './Context';\nimport { notInitialized } from '../utils/useSyncExternalStore';\nlet useSyncExternalStore = notInitialized;\nexport const initializeConnect = fn => {\n useSyncExternalStore = fn;\n}; // Define some constant arrays just to avoid re-creating these\n\nconst EMPTY_ARRAY = [null, 0];\nconst NO_SUBSCRIPTION_ARRAY = [null, null]; // Attempts to stringify whatever not-really-a-component value we were given\n// for logging in an error message\n\nconst stringifyComponent = Comp => {\n try {\n return JSON.stringify(Comp);\n } catch (err) {\n return String(Comp);\n }\n};\n\n// This is \"just\" a `useLayoutEffect`, but with two modifications:\n// - we need to fall back to `useEffect` in SSR to avoid annoying warnings\n// - we extract this to a separate function to avoid closing over values\n// and causing memory leaks\nfunction useIsomorphicLayoutEffectWithArgs(effectFunc, effectArgs, dependencies) {\n useIsomorphicLayoutEffect(() => effectFunc(...effectArgs), dependencies);\n} // Effect callback, extracted: assign the latest props values to refs for later usage\n\n\nfunction captureWrapperProps(lastWrapperProps, lastChildProps, renderIsScheduled, wrapperProps, // actualChildProps: unknown,\nchildPropsFromStoreUpdate, notifyNestedSubs) {\n // We want to capture the wrapper props and child props we used for later comparisons\n lastWrapperProps.current = wrapperProps;\n renderIsScheduled.current = false; // If the render was from a store update, clear out that reference and cascade the subscriber update\n\n if (childPropsFromStoreUpdate.current) {\n childPropsFromStoreUpdate.current = null;\n notifyNestedSubs();\n }\n} // Effect callback, extracted: subscribe to the Redux store or nearest connected ancestor,\n// check for updates after dispatched actions, and trigger re-renders.\n\n\nfunction subscribeUpdates(shouldHandleStateChanges, store, subscription, childPropsSelector, lastWrapperProps, lastChildProps, renderIsScheduled, isMounted, childPropsFromStoreUpdate, notifyNestedSubs, // forceComponentUpdateDispatch: React.Dispatch,\nadditionalSubscribeListener) {\n // If we're not subscribed to the store, nothing to do here\n if (!shouldHandleStateChanges) return () => {}; // Capture values for checking if and when this component unmounts\n\n let didUnsubscribe = false;\n let lastThrownError = null; // We'll run this callback every time a store subscription update propagates to this component\n\n const checkForUpdates = () => {\n if (didUnsubscribe || !isMounted.current) {\n // Don't run stale listeners.\n // Redux doesn't guarantee unsubscriptions happen until next dispatch.\n return;\n } // TODO We're currently calling getState ourselves here, rather than letting `uSES` do it\n\n\n const latestStoreState = store.getState();\n let newChildProps, error;\n\n try {\n // Actually run the selector with the most recent store state and wrapper props\n // to determine what the child props should be\n newChildProps = childPropsSelector(latestStoreState, lastWrapperProps.current);\n } catch (e) {\n error = e;\n lastThrownError = e;\n }\n\n if (!error) {\n lastThrownError = null;\n } // If the child props haven't changed, nothing to do here - cascade the subscription update\n\n\n if (newChildProps === lastChildProps.current) {\n if (!renderIsScheduled.current) {\n notifyNestedSubs();\n }\n } else {\n // Save references to the new child props. Note that we track the \"child props from store update\"\n // as a ref instead of a useState/useReducer because we need a way to determine if that value has\n // been processed. If this went into useState/useReducer, we couldn't clear out the value without\n // forcing another re-render, which we don't want.\n lastChildProps.current = newChildProps;\n childPropsFromStoreUpdate.current = newChildProps;\n renderIsScheduled.current = true; // TODO This is hacky and not how `uSES` is meant to be used\n // Trigger the React `useSyncExternalStore` subscriber\n\n additionalSubscribeListener();\n }\n }; // Actually subscribe to the nearest connected ancestor (or store)\n\n\n subscription.onStateChange = checkForUpdates;\n subscription.trySubscribe(); // Pull data from the store after first render in case the store has\n // changed since we began.\n\n checkForUpdates();\n\n const unsubscribeWrapper = () => {\n didUnsubscribe = true;\n subscription.tryUnsubscribe();\n subscription.onStateChange = null;\n\n if (lastThrownError) {\n // It's possible that we caught an error due to a bad mapState function, but the\n // parent re-rendered without this component and we're about to unmount.\n // This shouldn't happen as long as we do top-down subscriptions correctly, but\n // if we ever do those wrong, this throw will surface the error in our tests.\n // In that case, throw the error from here so it doesn't get lost.\n throw lastThrownError;\n }\n };\n\n return unsubscribeWrapper;\n} // Reducer initial state creation for our update reducer\n\n\nconst initStateUpdates = () => EMPTY_ARRAY;\n\nfunction strictEqual(a, b) {\n return a === b;\n}\n/**\r\n * Infers the type of props that a connector will inject into a component.\r\n */\n\n\nlet hasWarnedAboutDeprecatedPureOption = false;\n/**\r\n * Connects a React component to a Redux store.\r\n *\r\n * - Without arguments, just wraps the component, without changing the behavior / props\r\n *\r\n * - If 2 params are passed (3rd param, mergeProps, is skipped), default behavior\r\n * is to override ownProps (as stated in the docs), so what remains is everything that's\r\n * not a state or dispatch prop\r\n *\r\n * - When 3rd param is passed, we don't know if ownProps propagate and whether they\r\n * should be valid component props, because it depends on mergeProps implementation.\r\n * As such, it is the user's responsibility to extend ownProps interface from state or\r\n * dispatch props or both when applicable\r\n *\r\n * @param mapStateToProps A function that extracts values from state\r\n * @param mapDispatchToProps Setup for dispatching actions\r\n * @param mergeProps Optional callback to merge state and dispatch props together\r\n * @param options Options for configuring the connection\r\n *\r\n */\n\nfunction connect(mapStateToProps, mapDispatchToProps, mergeProps, {\n // The `pure` option has been removed, so TS doesn't like us destructuring this to check its existence.\n // @ts-ignore\n pure,\n areStatesEqual = strictEqual,\n areOwnPropsEqual = shallowEqual,\n areStatePropsEqual = shallowEqual,\n areMergedPropsEqual = shallowEqual,\n // use React's forwardRef to expose a ref of the wrapped component\n forwardRef = false,\n // the context consumer to use\n context = ReactReduxContext\n} = {}) {\n if (process.env.NODE_ENV !== 'production') {\n if (pure !== undefined && !hasWarnedAboutDeprecatedPureOption) {\n hasWarnedAboutDeprecatedPureOption = true;\n warning('The `pure` option has been removed. `connect` is now always a \"pure/memoized\" component');\n }\n }\n\n const Context = context;\n const initMapStateToProps = mapStateToPropsFactory(mapStateToProps);\n const initMapDispatchToProps = mapDispatchToPropsFactory(mapDispatchToProps);\n const initMergeProps = mergePropsFactory(mergeProps);\n const shouldHandleStateChanges = Boolean(mapStateToProps);\n\n const wrapWithConnect = WrappedComponent => {\n if (process.env.NODE_ENV !== 'production' && !isValidElementType(WrappedComponent)) {\n throw new Error(`You must pass a component to the function returned by connect. Instead received ${stringifyComponent(WrappedComponent)}`);\n }\n\n const wrappedComponentName = WrappedComponent.displayName || WrappedComponent.name || 'Component';\n const displayName = `Connect(${wrappedComponentName})`;\n const selectorFactoryOptions = {\n shouldHandleStateChanges,\n displayName,\n wrappedComponentName,\n WrappedComponent,\n // @ts-ignore\n initMapStateToProps,\n // @ts-ignore\n initMapDispatchToProps,\n initMergeProps,\n areStatesEqual,\n areStatePropsEqual,\n areOwnPropsEqual,\n areMergedPropsEqual\n };\n\n function ConnectFunction(props) {\n const [propsContext, reactReduxForwardedRef, wrapperProps] = React.useMemo(() => {\n // Distinguish between actual \"data\" props that were passed to the wrapper component,\n // and values needed to control behavior (forwarded refs, alternate context instances).\n // To maintain the wrapperProps object reference, memoize this destructuring.\n const {\n reactReduxForwardedRef\n } = props,\n wrapperProps = _objectWithoutPropertiesLoose(props, _excluded);\n\n return [props.context, reactReduxForwardedRef, wrapperProps];\n }, [props]);\n const ContextToUse = React.useMemo(() => {\n // Users may optionally pass in a custom context instance to use instead of our ReactReduxContext.\n // Memoize the check that determines which context instance we should use.\n return propsContext && propsContext.Consumer && // @ts-ignore\n isContextConsumer( /*#__PURE__*/React.createElement(propsContext.Consumer, null)) ? propsContext : Context;\n }, [propsContext, Context]); // Retrieve the store and ancestor subscription via context, if available\n\n const contextValue = React.useContext(ContextToUse); // The store _must_ exist as either a prop or in context.\n // We'll check to see if it _looks_ like a Redux store first.\n // This allows us to pass through a `store` prop that is just a plain value.\n\n const didStoreComeFromProps = Boolean(props.store) && Boolean(props.store.getState) && Boolean(props.store.dispatch);\n const didStoreComeFromContext = Boolean(contextValue) && Boolean(contextValue.store);\n\n if (process.env.NODE_ENV !== 'production' && !didStoreComeFromProps && !didStoreComeFromContext) {\n throw new Error(`Could not find \"store\" in the context of ` + `\"${displayName}\". Either wrap the root component in a , ` + `or pass a custom React context provider to and the corresponding ` + `React context consumer to ${displayName} in connect options.`);\n } // Based on the previous check, one of these must be true\n\n\n const store = didStoreComeFromProps ? props.store : contextValue.store;\n const getServerState = didStoreComeFromContext ? contextValue.getServerState : store.getState;\n const childPropsSelector = React.useMemo(() => {\n // The child props selector needs the store reference as an input.\n // Re-create this selector whenever the store changes.\n return defaultSelectorFactory(store.dispatch, selectorFactoryOptions);\n }, [store]);\n const [subscription, notifyNestedSubs] = React.useMemo(() => {\n if (!shouldHandleStateChanges) return NO_SUBSCRIPTION_ARRAY; // This Subscription's source should match where store came from: props vs. context. A component\n // connected to the store via props shouldn't use subscription from context, or vice versa.\n\n const subscription = createSubscription(store, didStoreComeFromProps ? undefined : contextValue.subscription); // `notifyNestedSubs` is duplicated to handle the case where the component is unmounted in\n // the middle of the notification loop, where `subscription` will then be null. This can\n // probably be avoided if Subscription's listeners logic is changed to not call listeners\n // that have been unsubscribed in the middle of the notification loop.\n\n const notifyNestedSubs = subscription.notifyNestedSubs.bind(subscription);\n return [subscription, notifyNestedSubs];\n }, [store, didStoreComeFromProps, contextValue]); // Determine what {store, subscription} value should be put into nested context, if necessary,\n // and memoize that value to avoid unnecessary context updates.\n\n const overriddenContextValue = React.useMemo(() => {\n if (didStoreComeFromProps) {\n // This component is directly subscribed to a store from props.\n // We don't want descendants reading from this store - pass down whatever\n // the existing context value is from the nearest connected ancestor.\n return contextValue;\n } // Otherwise, put this component's subscription instance into context, so that\n // connected descendants won't update until after this component is done\n\n\n return _extends({}, contextValue, {\n subscription\n });\n }, [didStoreComeFromProps, contextValue, subscription]); // Set up refs to coordinate values between the subscription effect and the render logic\n\n const lastChildProps = React.useRef();\n const lastWrapperProps = React.useRef(wrapperProps);\n const childPropsFromStoreUpdate = React.useRef();\n const renderIsScheduled = React.useRef(false);\n const isProcessingDispatch = React.useRef(false);\n const isMounted = React.useRef(false);\n const latestSubscriptionCallbackError = React.useRef();\n useIsomorphicLayoutEffect(() => {\n isMounted.current = true;\n return () => {\n isMounted.current = false;\n };\n }, []);\n const actualChildPropsSelector = React.useMemo(() => {\n const selector = () => {\n // Tricky logic here:\n // - This render may have been triggered by a Redux store update that produced new child props\n // - However, we may have gotten new wrapper props after that\n // If we have new child props, and the same wrapper props, we know we should use the new child props as-is.\n // But, if we have new wrapper props, those might change the child props, so we have to recalculate things.\n // So, we'll use the child props from store update only if the wrapper props are the same as last time.\n if (childPropsFromStoreUpdate.current && wrapperProps === lastWrapperProps.current) {\n return childPropsFromStoreUpdate.current;\n } // TODO We're reading the store directly in render() here. Bad idea?\n // This will likely cause Bad Things (TM) to happen in Concurrent Mode.\n // Note that we do this because on renders _not_ caused by store updates, we need the latest store state\n // to determine what the child props should be.\n\n\n return childPropsSelector(store.getState(), wrapperProps);\n };\n\n return selector;\n }, [store, wrapperProps]); // We need this to execute synchronously every time we re-render. However, React warns\n // about useLayoutEffect in SSR, so we try to detect environment and fall back to\n // just useEffect instead to avoid the warning, since neither will run anyway.\n\n const subscribeForReact = React.useMemo(() => {\n const subscribe = reactListener => {\n if (!subscription) {\n return () => {};\n }\n\n return subscribeUpdates(shouldHandleStateChanges, store, subscription, // @ts-ignore\n childPropsSelector, lastWrapperProps, lastChildProps, renderIsScheduled, isMounted, childPropsFromStoreUpdate, notifyNestedSubs, reactListener);\n };\n\n return subscribe;\n }, [subscription]);\n useIsomorphicLayoutEffectWithArgs(captureWrapperProps, [lastWrapperProps, lastChildProps, renderIsScheduled, wrapperProps, childPropsFromStoreUpdate, notifyNestedSubs]);\n let actualChildProps;\n\n try {\n actualChildProps = useSyncExternalStore( // TODO We're passing through a big wrapper that does a bunch of extra side effects besides subscribing\n subscribeForReact, // TODO This is incredibly hacky. We've already processed the store update and calculated new child props,\n // TODO and we're just passing that through so it triggers a re-render for us rather than relying on `uSES`.\n actualChildPropsSelector, getServerState ? () => childPropsSelector(getServerState(), wrapperProps) : actualChildPropsSelector);\n } catch (err) {\n if (latestSubscriptionCallbackError.current) {\n ;\n err.message += `\\nThe error may be correlated with this previous error:\\n${latestSubscriptionCallbackError.current.stack}\\n\\n`;\n }\n\n throw err;\n }\n\n useIsomorphicLayoutEffect(() => {\n latestSubscriptionCallbackError.current = undefined;\n childPropsFromStoreUpdate.current = undefined;\n lastChildProps.current = actualChildProps;\n }); // Now that all that's done, we can finally try to actually render the child component.\n // We memoize the elements for the rendered child component as an optimization.\n\n const renderedWrappedComponent = React.useMemo(() => {\n return (\n /*#__PURE__*/\n // @ts-ignore\n React.createElement(WrappedComponent, _extends({}, actualChildProps, {\n ref: reactReduxForwardedRef\n }))\n );\n }, [reactReduxForwardedRef, WrappedComponent, actualChildProps]); // If React sees the exact same element reference as last time, it bails out of re-rendering\n // that child, same as if it was wrapped in React.memo() or returned false from shouldComponentUpdate.\n\n const renderedChild = React.useMemo(() => {\n if (shouldHandleStateChanges) {\n // If this component is subscribed to store updates, we need to pass its own\n // subscription instance down to our descendants. That means rendering the same\n // Context instance, and putting a different value into the context.\n return /*#__PURE__*/React.createElement(ContextToUse.Provider, {\n value: overriddenContextValue\n }, renderedWrappedComponent);\n }\n\n return renderedWrappedComponent;\n }, [ContextToUse, renderedWrappedComponent, overriddenContextValue]);\n return renderedChild;\n }\n\n const _Connect = React.memo(ConnectFunction);\n\n // Add a hacky cast to get the right output type\n const Connect = _Connect;\n Connect.WrappedComponent = WrappedComponent;\n Connect.displayName = ConnectFunction.displayName = displayName;\n\n if (forwardRef) {\n const _forwarded = React.forwardRef(function forwardConnectRef(props, ref) {\n // @ts-ignore\n return /*#__PURE__*/React.createElement(Connect, _extends({}, props, {\n reactReduxForwardedRef: ref\n }));\n });\n\n const forwarded = _forwarded;\n forwarded.displayName = displayName;\n forwarded.WrappedComponent = WrappedComponent;\n return hoistStatics(forwarded, WrappedComponent);\n }\n\n return hoistStatics(Connect, WrappedComponent);\n };\n\n return wrapWithConnect;\n}\n\nexport default connect;","import * as React from 'react';\nimport { ReactReduxContext } from './Context';\nimport { createSubscription } from '../utils/Subscription';\nimport { useIsomorphicLayoutEffect } from '../utils/useIsomorphicLayoutEffect';\n\nfunction Provider({\n store,\n context,\n children,\n serverState,\n stabilityCheck = 'once',\n noopCheck = 'once'\n}) {\n const contextValue = React.useMemo(() => {\n const subscription = createSubscription(store);\n return {\n store,\n subscription,\n getServerState: serverState ? () => serverState : undefined,\n stabilityCheck,\n noopCheck\n };\n }, [store, serverState, stabilityCheck, noopCheck]);\n const previousState = React.useMemo(() => store.getState(), [store]);\n useIsomorphicLayoutEffect(() => {\n const {\n subscription\n } = contextValue;\n subscription.onStateChange = subscription.notifyNestedSubs;\n subscription.trySubscribe();\n\n if (previousState !== store.getState()) {\n subscription.notifyNestedSubs();\n }\n\n return () => {\n subscription.tryUnsubscribe();\n subscription.onStateChange = undefined;\n };\n }, [contextValue, previousState]);\n const Context = context || ReactReduxContext; // @ts-ignore 'AnyAction' is assignable to the constraint of type 'A', but 'A' could be instantiated with a different subtype\n\n return /*#__PURE__*/React.createElement(Context.Provider, {\n value: contextValue\n }, children);\n}\n\nexport default Provider;","import { ReactReduxContext } from '../components/Context';\nimport { useReduxContext as useDefaultReduxContext, createReduxContextHook } from './useReduxContext';\n/**\r\n * Hook factory, which creates a `useStore` hook bound to a given context.\r\n *\r\n * @param {React.Context} [context=ReactReduxContext] Context passed to your ``.\r\n * @returns {Function} A `useStore` hook bound to the specified context.\r\n */\n\nexport function createStoreHook(context = ReactReduxContext) {\n const useReduxContext = // @ts-ignore\n context === ReactReduxContext ? useDefaultReduxContext : // @ts-ignore\n createReduxContextHook(context);\n return function useStore() {\n const {\n store\n } = useReduxContext(); // @ts-ignore\n\n return store;\n };\n}\n/**\r\n * A hook to access the redux store.\r\n *\r\n * @returns {any} the redux store\r\n *\r\n * @example\r\n *\r\n * import React from 'react'\r\n * import { useStore } from 'react-redux'\r\n *\r\n * export const ExampleComponent = () => {\r\n * const store = useStore()\r\n * return {store.getState()}
\r\n * }\r\n */\n\nexport const useStore = /*#__PURE__*/createStoreHook();","import { ReactReduxContext } from '../components/Context';\nimport { useStore as useDefaultStore, createStoreHook } from './useStore';\n/**\r\n * Hook factory, which creates a `useDispatch` hook bound to a given context.\r\n *\r\n * @param {React.Context} [context=ReactReduxContext] Context passed to your ``.\r\n * @returns {Function} A `useDispatch` hook bound to the specified context.\r\n */\n\nexport function createDispatchHook(context = ReactReduxContext) {\n const useStore = // @ts-ignore\n context === ReactReduxContext ? useDefaultStore : createStoreHook(context);\n return function useDispatch() {\n const store = useStore(); // @ts-ignore\n\n return store.dispatch;\n };\n}\n/**\r\n * A hook to access the redux `dispatch` function.\r\n *\r\n * @returns {any|function} redux store's `dispatch` function\r\n *\r\n * @example\r\n *\r\n * import React, { useCallback } from 'react'\r\n * import { useDispatch } from 'react-redux'\r\n *\r\n * export const CounterComponent = ({ value }) => {\r\n * const dispatch = useDispatch()\r\n * const increaseCounter = useCallback(() => dispatch({ type: 'increase-counter' }), [])\r\n * return (\r\n * \r\n * {value}\r\n * \r\n *
\r\n * )\r\n * }\r\n */\n\nexport const useDispatch = /*#__PURE__*/createDispatchHook();","// The primary entry point assumes we're working with standard ReactDOM/RN, but\n// older versions that do not include `useSyncExternalStore` (React 16.9 - 17.x).\n// Because of that, the useSyncExternalStore compat shim is needed.\nimport { useSyncExternalStore } from 'use-sync-external-store/shim';\nimport { useSyncExternalStoreWithSelector } from 'use-sync-external-store/shim/with-selector';\nimport { unstable_batchedUpdates as batch } from './utils/reactBatchedUpdates';\nimport { setBatch } from './utils/batch';\nimport { initializeUseSelector } from './hooks/useSelector';\nimport { initializeConnect } from './components/connect';\ninitializeUseSelector(useSyncExternalStoreWithSelector);\ninitializeConnect(useSyncExternalStore); // Enable batched updates in our subscriptions for use\n// with standard React renderers (ReactDOM, React Native)\n\nsetBatch(batch);\nexport { batch };\nexport * from './exports';","export const ADD_PERMISSIONS = \"ADD_PERMISSIONS\";\n","import React, { useEffect, useRef, useState } from \"react\";\nimport { Button } from \"primereact/button\";\nimport { useNavigate } from \"react-router-dom\";\nimport { BaseApiService } from \"../utils/BaseApiService\";\nimport { UserSessionUtils } from \"../utils/UserSessionUtils\";\nimport { Toast } from \"primereact/toast\";\nimport \"react-phone-input-2/lib/style.css\";\nimport TermsAndCondition from \"./TermsAndConditions\";\nimport NamesInput from \"../components/OnBoarding/NamesInput\";\nimport BioDataComponent from \"../components/OnBoarding/BioData\";\nimport ContactInput from \"../components/OnBoarding/ContactInput\";\nimport PasswordInput from \"../components/OnBoarding/PasswordInput\";\nimport { convertToServerDate } from \"../utils/Utils\";\nimport CongsComponent from \"../components/OnBoarding/CongsComponent\";\nimport ErrorComponent from \"../components/OnBoarding/ErrorComponent\";\nimport { ReactComponent as Openeye } from \"../assets/icons/eye-alt-svgrepo-com.svg\";\nimport { ReactComponent as Closedeye } from \"../assets/icons/eye-slash-alt-svgrepo-com.svg\";\nimport { useDispatch } from \"react-redux\";\nimport { addPermissions } from \"duqactStore/actions/types\";\n\nexport const Login = () => {\n const navigate = useNavigate();\n const [loading, setLoading] = useState(false);\n const [checked, setChecked] = useState(false);\n const [names, setnames] = useState(null);\n const [bioData, setBioData] = useState(null);\n const [contactInfo, setContactInfo] = useState(null);\n const [isTermsVisible, setIsTermsVisible] = useState(false);\n\n const [visible, setVisible] = useState(false);\n const [isSignup, setIsSignUp] = useState(false);\n const dispatch = useDispatch();\n const [secNum, setSecNum] = useState(0);\n const main = 0;\n const secOne = 1;\n const secTwo = 2;\n const secThree = 3;\n const secFour = 4;\n const secFive = 5;\n\n const [errorMessage, setErrorMessage] = useState(\"\");\n\n const widthAdd = 212.5;\n\n const toast = useRef(null);\n\n const handleSession = () => {\n setIsSignUp(!isSignup);\n };\n\n const LoginComp = () => {\n const [loginUsername, setLoginUsername] = useState(\"\");\n const [loginPassword, setLoginPassword] = useState(\"\");\n const [forgotEmail, setForgotEmail] = useState(\"\");\n const [hidden, setHidden] = useState(true);\n\n const onLogin = () => {\n setLoading(true);\n\n new BaseApiService(\"/auth/login\")\n .postRequestWithJsonResponse({\n username: loginUsername,\n password: loginPassword,\n rememberMe: checked\n })\n .then((response) => {\n setLoading(false);\n const permissions = [\n ...new Set(response.user?.roles?.flatMap((item) => item?.permissions || [])?.map((perm) => JSON.stringify(perm)) || [])\n ].map((perm) => JSON.parse(perm));\n\n dispatch(addPermissions(permissions, response.user));\n\n UserSessionUtils.setFullSessionObject(response);\n UserSessionUtils.setUserDetails(response.user);\n UserSessionUtils.setUserAuthToken(response.accessToken);\n UserSessionUtils.setUserRefreshToken(response.refreshToken);\n UserSessionUtils.setUserPermissions(JSON.stringify(permissions));\n UserSessionUtils.setSuperAdmin(response.user.isSuperAdmin);\n UserSessionUtils.setShopOwner(response.user.isShopOwner);\n UserSessionUtils.setShopAttendant(response.user.isShopAttendant);\n UserSessionUtils.setShopOwnerId(response.user.shopOwnerId);\n UserSessionUtils.setShopId(response.user.attendantShopId);\n UserSessionUtils.setLoginTime(new Date());\n UserSessionUtils.setLoggedIn(true);\n navigate(\"/\", { replace: true });\n })\n .catch((error) => {\n setLoading(false);\n\n toast.current.show({\n severity: \"error\",\n summary: \"Bad Credentials\",\n detail: \"Incorrect username or password\",\n life: 3000\n });\n });\n };\n\n const handleForgotPassword = () => {\n setVisible(!visible);\n };\n\n const handleKey = (event) => {\n if (event.key === \"Enter\") {\n onLogin();\n }\n };\n\n return (\n <>\n \n {!visible && (\n <>\n
\n {!isSignup &&
Welcome!
}\n
![\"hyper\"](\"assets/demo/images/blocks/logos/Duqact)
\n
\n
\n
\n Duqact is a cutting-edge AccountingTech solution designed to streamline financial management for shop owners, suppliers,\n and manufacturers.\n
\n
\n Our platform offers comprehensive accounting features and marketing insights that are crucial for business growth in\n today’s competitive market.\n
\n
\n \n )}\n {!visible && (\n
\n
Welcome!
\n
\n \n setLoginUsername(e.target.value)}\n type=\"text\"\n name=\"usrname\"\n placeholder=\"johndoe@gmail.com\"\n >\n
\n
\n \n\n {!hidden && setHidden(!hidden)} className=\"eyes\" />}\n {hidden && setHidden(!hidden)} className=\"eyes\" />}\n setLoginPassword(e.target.value)}\n name=\"password\"\n placeholder=\"Password\"\n >\n
\n
\n
\n )}\n {visible && (\n
\n
Forgot Password?
\n
\n No worries, reset it here! Enter the email address you used to register at Duqact, and we'll send you a password reset link\n ASAP.\n
\n
\n )}\n {visible && (\n
\n
\n \n setForgotEmail(e.target.value)}\n type=\"text\"\n placeholder=\"johndoe@gmail.com\"\n >\n
\n
\n {\" \"}\n onKeyDown={handleKey}\n \n \n
\n
\n )}\n
\n {secNum === main &&
}\n {secNum === secOne &&
}\n {secNum === secTwo &&
}\n {secNum === secThree &&
}\n {isTermsVisible &&
}\n {secNum === secFour &&
}\n {secNum === secFive &&
}\n
\n
\n {!isSignup &&
Welcome!
}\n
\n
\n {!isSignup &&
}\n {isSignup && CreateAccountComponent}\n {isSignup &&
}\n
\n
Cannot display the map: google maps api key missing
;\n }\n\n return {children};\n};\n\nexport const GMP_API_KY = apiKeyHandler;\n","\nconst ARRAY_TYPES = [\n Int8Array, Uint8Array, Uint8ClampedArray, Int16Array, Uint16Array,\n Int32Array, Uint32Array, Float32Array, Float64Array\n];\n\n/** @typedef {Int8ArrayConstructor | Uint8ArrayConstructor | Uint8ClampedArrayConstructor | Int16ArrayConstructor | Uint16ArrayConstructor | Int32ArrayConstructor | Uint32ArrayConstructor | Float32ArrayConstructor | Float64ArrayConstructor} TypedArrayConstructor */\n\nconst VERSION = 1; // serialized format version\nconst HEADER_SIZE = 8;\n\nexport default class KDBush {\n\n /**\n * Creates an index from raw `ArrayBuffer` data.\n * @param {ArrayBuffer} data\n */\n static from(data) {\n if (!(data instanceof ArrayBuffer)) {\n throw new Error('Data must be an instance of ArrayBuffer.');\n }\n const [magic, versionAndType] = new Uint8Array(data, 0, 2);\n if (magic !== 0xdb) {\n throw new Error('Data does not appear to be in a KDBush format.');\n }\n const version = versionAndType >> 4;\n if (version !== VERSION) {\n throw new Error(`Got v${version} data when expected v${VERSION}.`);\n }\n const ArrayType = ARRAY_TYPES[versionAndType & 0x0f];\n if (!ArrayType) {\n throw new Error('Unrecognized array type.');\n }\n const [nodeSize] = new Uint16Array(data, 2, 1);\n const [numItems] = new Uint32Array(data, 4, 1);\n\n return new KDBush(numItems, nodeSize, ArrayType, data);\n }\n\n /**\n * Creates an index that will hold a given number of items.\n * @param {number} numItems\n * @param {number} [nodeSize=64] Size of the KD-tree node (64 by default).\n * @param {TypedArrayConstructor} [ArrayType=Float64Array] The array type used for coordinates storage (`Float64Array` by default).\n * @param {ArrayBuffer} [data] (For internal use only)\n */\n constructor(numItems, nodeSize = 64, ArrayType = Float64Array, data) {\n if (isNaN(numItems) || numItems < 0) throw new Error(`Unpexpected numItems value: ${numItems}.`);\n\n this.numItems = +numItems;\n this.nodeSize = Math.min(Math.max(+nodeSize, 2), 65535);\n this.ArrayType = ArrayType;\n this.IndexArrayType = numItems < 65536 ? Uint16Array : Uint32Array;\n\n const arrayTypeIndex = ARRAY_TYPES.indexOf(this.ArrayType);\n const coordsByteSize = numItems * 2 * this.ArrayType.BYTES_PER_ELEMENT;\n const idsByteSize = numItems * this.IndexArrayType.BYTES_PER_ELEMENT;\n const padCoords = (8 - idsByteSize % 8) % 8;\n\n if (arrayTypeIndex < 0) {\n throw new Error(`Unexpected typed array class: ${ArrayType}.`);\n }\n\n if (data && (data instanceof ArrayBuffer)) { // reconstruct an index from a buffer\n this.data = data;\n this.ids = new this.IndexArrayType(this.data, HEADER_SIZE, numItems);\n this.coords = new this.ArrayType(this.data, HEADER_SIZE + idsByteSize + padCoords, numItems * 2);\n this._pos = numItems * 2;\n this._finished = true;\n } else { // initialize a new index\n this.data = new ArrayBuffer(HEADER_SIZE + coordsByteSize + idsByteSize + padCoords);\n this.ids = new this.IndexArrayType(this.data, HEADER_SIZE, numItems);\n this.coords = new this.ArrayType(this.data, HEADER_SIZE + idsByteSize + padCoords, numItems * 2);\n this._pos = 0;\n this._finished = false;\n\n // set header\n new Uint8Array(this.data, 0, 2).set([0xdb, (VERSION << 4) + arrayTypeIndex]);\n new Uint16Array(this.data, 2, 1)[0] = nodeSize;\n new Uint32Array(this.data, 4, 1)[0] = numItems;\n }\n }\n\n /**\n * Add a point to the index.\n * @param {number} x\n * @param {number} y\n * @returns {number} An incremental index associated with the added item (starting from `0`).\n */\n add(x, y) {\n const index = this._pos >> 1;\n this.ids[index] = index;\n this.coords[this._pos++] = x;\n this.coords[this._pos++] = y;\n return index;\n }\n\n /**\n * Perform indexing of the added points.\n */\n finish() {\n const numAdded = this._pos >> 1;\n if (numAdded !== this.numItems) {\n throw new Error(`Added ${numAdded} items when expected ${this.numItems}.`);\n }\n // kd-sort both arrays for efficient search\n sort(this.ids, this.coords, this.nodeSize, 0, this.numItems - 1, 0);\n\n this._finished = true;\n return this;\n }\n\n /**\n * Search the index for items within a given bounding box.\n * @param {number} minX\n * @param {number} minY\n * @param {number} maxX\n * @param {number} maxY\n * @returns {number[]} An array of indices correponding to the found items.\n */\n range(minX, minY, maxX, maxY) {\n if (!this._finished) throw new Error('Data not yet indexed - call index.finish().');\n\n const {ids, coords, nodeSize} = this;\n const stack = [0, ids.length - 1, 0];\n const result = [];\n\n // recursively search for items in range in the kd-sorted arrays\n while (stack.length) {\n const axis = stack.pop() || 0;\n const right = stack.pop() || 0;\n const left = stack.pop() || 0;\n\n // if we reached \"tree node\", search linearly\n if (right - left <= nodeSize) {\n for (let i = left; i <= right; i++) {\n const x = coords[2 * i];\n const y = coords[2 * i + 1];\n if (x >= minX && x <= maxX && y >= minY && y <= maxY) result.push(ids[i]);\n }\n continue;\n }\n\n // otherwise find the middle index\n const m = (left + right) >> 1;\n\n // include the middle item if it's in range\n const x = coords[2 * m];\n const y = coords[2 * m + 1];\n if (x >= minX && x <= maxX && y >= minY && y <= maxY) result.push(ids[m]);\n\n // queue search in halves that intersect the query\n if (axis === 0 ? minX <= x : minY <= y) {\n stack.push(left);\n stack.push(m - 1);\n stack.push(1 - axis);\n }\n if (axis === 0 ? maxX >= x : maxY >= y) {\n stack.push(m + 1);\n stack.push(right);\n stack.push(1 - axis);\n }\n }\n\n return result;\n }\n\n /**\n * Search the index for items within a given radius.\n * @param {number} qx\n * @param {number} qy\n * @param {number} r Query radius.\n * @returns {number[]} An array of indices correponding to the found items.\n */\n within(qx, qy, r) {\n if (!this._finished) throw new Error('Data not yet indexed - call index.finish().');\n\n const {ids, coords, nodeSize} = this;\n const stack = [0, ids.length - 1, 0];\n const result = [];\n const r2 = r * r;\n\n // recursively search for items within radius in the kd-sorted arrays\n while (stack.length) {\n const axis = stack.pop() || 0;\n const right = stack.pop() || 0;\n const left = stack.pop() || 0;\n\n // if we reached \"tree node\", search linearly\n if (right - left <= nodeSize) {\n for (let i = left; i <= right; i++) {\n if (sqDist(coords[2 * i], coords[2 * i + 1], qx, qy) <= r2) result.push(ids[i]);\n }\n continue;\n }\n\n // otherwise find the middle index\n const m = (left + right) >> 1;\n\n // include the middle item if it's in range\n const x = coords[2 * m];\n const y = coords[2 * m + 1];\n if (sqDist(x, y, qx, qy) <= r2) result.push(ids[m]);\n\n // queue search in halves that intersect the query\n if (axis === 0 ? qx - r <= x : qy - r <= y) {\n stack.push(left);\n stack.push(m - 1);\n stack.push(1 - axis);\n }\n if (axis === 0 ? qx + r >= x : qy + r >= y) {\n stack.push(m + 1);\n stack.push(right);\n stack.push(1 - axis);\n }\n }\n\n return result;\n }\n}\n\n/**\n * @param {Uint16Array | Uint32Array} ids\n * @param {InstanceType} coords\n * @param {number} nodeSize\n * @param {number} left\n * @param {number} right\n * @param {number} axis\n */\nfunction sort(ids, coords, nodeSize, left, right, axis) {\n if (right - left <= nodeSize) return;\n\n const m = (left + right) >> 1; // middle index\n\n // sort ids and coords around the middle index so that the halves lie\n // either left/right or top/bottom correspondingly (taking turns)\n select(ids, coords, m, left, right, axis);\n\n // recursively kd-sort first half and second half on the opposite axis\n sort(ids, coords, nodeSize, left, m - 1, 1 - axis);\n sort(ids, coords, nodeSize, m + 1, right, 1 - axis);\n}\n\n/**\n * Custom Floyd-Rivest selection algorithm: sort ids and coords so that\n * [left..k-1] items are smaller than k-th item (on either x or y axis)\n * @param {Uint16Array | Uint32Array} ids\n * @param {InstanceType} coords\n * @param {number} k\n * @param {number} left\n * @param {number} right\n * @param {number} axis\n */\nfunction select(ids, coords, k, left, right, axis) {\n\n while (right > left) {\n if (right - left > 600) {\n const n = right - left + 1;\n const m = k - left + 1;\n const z = Math.log(n);\n const s = 0.5 * Math.exp(2 * z / 3);\n const sd = 0.5 * Math.sqrt(z * s * (n - s) / n) * (m - n / 2 < 0 ? -1 : 1);\n const newLeft = Math.max(left, Math.floor(k - m * s / n + sd));\n const newRight = Math.min(right, Math.floor(k + (n - m) * s / n + sd));\n select(ids, coords, k, newLeft, newRight, axis);\n }\n\n const t = coords[2 * k + axis];\n let i = left;\n let j = right;\n\n swapItem(ids, coords, left, k);\n if (coords[2 * right + axis] > t) swapItem(ids, coords, left, right);\n\n while (i < j) {\n swapItem(ids, coords, i, j);\n i++;\n j--;\n while (coords[2 * i + axis] < t) i++;\n while (coords[2 * j + axis] > t) j--;\n }\n\n if (coords[2 * left + axis] === t) swapItem(ids, coords, left, j);\n else {\n j++;\n swapItem(ids, coords, j, right);\n }\n\n if (j <= k) left = j + 1;\n if (k <= j) right = j - 1;\n }\n}\n\n/**\n * @param {Uint16Array | Uint32Array} ids\n * @param {InstanceType} coords\n * @param {number} i\n * @param {number} j\n */\nfunction swapItem(ids, coords, i, j) {\n swap(ids, i, j);\n swap(coords, 2 * i, 2 * j);\n swap(coords, 2 * i + 1, 2 * j + 1);\n}\n\n/**\n * @param {InstanceType} arr\n * @param {number} i\n * @param {number} j\n */\nfunction swap(arr, i, j) {\n const tmp = arr[i];\n arr[i] = arr[j];\n arr[j] = tmp;\n}\n\n/**\n * @param {number} ax\n * @param {number} ay\n * @param {number} bx\n * @param {number} by\n */\nfunction sqDist(ax, ay, bx, by) {\n const dx = ax - bx;\n const dy = ay - by;\n return dx * dx + dy * dy;\n}\n","\nimport KDBush from 'kdbush';\n\nconst defaultOptions = {\n minZoom: 0, // min zoom to generate clusters on\n maxZoom: 16, // max zoom level to cluster the points on\n minPoints: 2, // minimum points to form a cluster\n radius: 40, // cluster radius in pixels\n extent: 512, // tile extent (radius is calculated relative to it)\n nodeSize: 64, // size of the KD-tree leaf node, affects performance\n log: false, // whether to log timing info\n\n // whether to generate numeric ids for input features (in vector tiles)\n generateId: false,\n\n // a reduce function for calculating custom cluster properties\n reduce: null, // (accumulated, props) => { accumulated.sum += props.sum; }\n\n // properties to use for individual points when running the reducer\n map: props => props // props => ({sum: props.my_value})\n};\n\nconst fround = Math.fround || (tmp => ((x) => { tmp[0] = +x; return tmp[0]; }))(new Float32Array(1));\n\nconst OFFSET_ZOOM = 2;\nconst OFFSET_ID = 3;\nconst OFFSET_PARENT = 4;\nconst OFFSET_NUM = 5;\nconst OFFSET_PROP = 6;\n\nexport default class Supercluster {\n constructor(options) {\n this.options = Object.assign(Object.create(defaultOptions), options);\n this.trees = new Array(this.options.maxZoom + 1);\n this.stride = this.options.reduce ? 7 : 6;\n this.clusterProps = [];\n }\n\n load(points) {\n const {log, minZoom, maxZoom} = this.options;\n\n if (log) console.time('total time');\n\n const timerId = `prepare ${ points.length } points`;\n if (log) console.time(timerId);\n\n this.points = points;\n\n // generate a cluster object for each point and index input points into a KD-tree\n const data = [];\n\n for (let i = 0; i < points.length; i++) {\n const p = points[i];\n if (!p.geometry) continue;\n\n const [lng, lat] = p.geometry.coordinates;\n const x = fround(lngX(lng));\n const y = fround(latY(lat));\n // store internal point/cluster data in flat numeric arrays for performance\n data.push(\n x, y, // projected point coordinates\n Infinity, // the last zoom the point was processed at\n i, // index of the source feature in the original input array\n -1, // parent cluster id\n 1 // number of points in a cluster\n );\n if (this.options.reduce) data.push(0); // noop\n }\n let tree = this.trees[maxZoom + 1] = this._createTree(data);\n\n if (log) console.timeEnd(timerId);\n\n // cluster points on max zoom, then cluster the results on previous zoom, etc.;\n // results in a cluster hierarchy across zoom levels\n for (let z = maxZoom; z >= minZoom; z--) {\n const now = +Date.now();\n\n // create a new set of clusters for the zoom and index them with a KD-tree\n tree = this.trees[z] = this._createTree(this._cluster(tree, z));\n\n if (log) console.log('z%d: %d clusters in %dms', z, tree.numItems, +Date.now() - now);\n }\n\n if (log) console.timeEnd('total time');\n\n return this;\n }\n\n getClusters(bbox, zoom) {\n let minLng = ((bbox[0] + 180) % 360 + 360) % 360 - 180;\n const minLat = Math.max(-90, Math.min(90, bbox[1]));\n let maxLng = bbox[2] === 180 ? 180 : ((bbox[2] + 180) % 360 + 360) % 360 - 180;\n const maxLat = Math.max(-90, Math.min(90, bbox[3]));\n\n if (bbox[2] - bbox[0] >= 360) {\n minLng = -180;\n maxLng = 180;\n } else if (minLng > maxLng) {\n const easternHem = this.getClusters([minLng, minLat, 180, maxLat], zoom);\n const westernHem = this.getClusters([-180, minLat, maxLng, maxLat], zoom);\n return easternHem.concat(westernHem);\n }\n\n const tree = this.trees[this._limitZoom(zoom)];\n const ids = tree.range(lngX(minLng), latY(maxLat), lngX(maxLng), latY(minLat));\n const data = tree.data;\n const clusters = [];\n for (const id of ids) {\n const k = this.stride * id;\n clusters.push(data[k + OFFSET_NUM] > 1 ? getClusterJSON(data, k, this.clusterProps) : this.points[data[k + OFFSET_ID]]);\n }\n return clusters;\n }\n\n getChildren(clusterId) {\n const originId = this._getOriginId(clusterId);\n const originZoom = this._getOriginZoom(clusterId);\n const errorMsg = 'No cluster with the specified id.';\n\n const tree = this.trees[originZoom];\n if (!tree) throw new Error(errorMsg);\n\n const data = tree.data;\n if (originId * this.stride >= data.length) throw new Error(errorMsg);\n\n const r = this.options.radius / (this.options.extent * Math.pow(2, originZoom - 1));\n const x = data[originId * this.stride];\n const y = data[originId * this.stride + 1];\n const ids = tree.within(x, y, r);\n const children = [];\n for (const id of ids) {\n const k = id * this.stride;\n if (data[k + OFFSET_PARENT] === clusterId) {\n children.push(data[k + OFFSET_NUM] > 1 ? getClusterJSON(data, k, this.clusterProps) : this.points[data[k + OFFSET_ID]]);\n }\n }\n\n if (children.length === 0) throw new Error(errorMsg);\n\n return children;\n }\n\n getLeaves(clusterId, limit, offset) {\n limit = limit || 10;\n offset = offset || 0;\n\n const leaves = [];\n this._appendLeaves(leaves, clusterId, limit, offset, 0);\n\n return leaves;\n }\n\n getTile(z, x, y) {\n const tree = this.trees[this._limitZoom(z)];\n const z2 = Math.pow(2, z);\n const {extent, radius} = this.options;\n const p = radius / extent;\n const top = (y - p) / z2;\n const bottom = (y + 1 + p) / z2;\n\n const tile = {\n features: []\n };\n\n this._addTileFeatures(\n tree.range((x - p) / z2, top, (x + 1 + p) / z2, bottom),\n tree.data, x, y, z2, tile);\n\n if (x === 0) {\n this._addTileFeatures(\n tree.range(1 - p / z2, top, 1, bottom),\n tree.data, z2, y, z2, tile);\n }\n if (x === z2 - 1) {\n this._addTileFeatures(\n tree.range(0, top, p / z2, bottom),\n tree.data, -1, y, z2, tile);\n }\n\n return tile.features.length ? tile : null;\n }\n\n getClusterExpansionZoom(clusterId) {\n let expansionZoom = this._getOriginZoom(clusterId) - 1;\n while (expansionZoom <= this.options.maxZoom) {\n const children = this.getChildren(clusterId);\n expansionZoom++;\n if (children.length !== 1) break;\n clusterId = children[0].properties.cluster_id;\n }\n return expansionZoom;\n }\n\n _appendLeaves(result, clusterId, limit, offset, skipped) {\n const children = this.getChildren(clusterId);\n\n for (const child of children) {\n const props = child.properties;\n\n if (props && props.cluster) {\n if (skipped + props.point_count <= offset) {\n // skip the whole cluster\n skipped += props.point_count;\n } else {\n // enter the cluster\n skipped = this._appendLeaves(result, props.cluster_id, limit, offset, skipped);\n // exit the cluster\n }\n } else if (skipped < offset) {\n // skip a single point\n skipped++;\n } else {\n // add a single point\n result.push(child);\n }\n if (result.length === limit) break;\n }\n\n return skipped;\n }\n\n _createTree(data) {\n const tree = new KDBush(data.length / this.stride | 0, this.options.nodeSize, Float32Array);\n for (let i = 0; i < data.length; i += this.stride) tree.add(data[i], data[i + 1]);\n tree.finish();\n tree.data = data;\n return tree;\n }\n\n _addTileFeatures(ids, data, x, y, z2, tile) {\n for (const i of ids) {\n const k = i * this.stride;\n const isCluster = data[k + OFFSET_NUM] > 1;\n\n let tags, px, py;\n if (isCluster) {\n tags = getClusterProperties(data, k, this.clusterProps);\n px = data[k];\n py = data[k + 1];\n } else {\n const p = this.points[data[k + OFFSET_ID]];\n tags = p.properties;\n const [lng, lat] = p.geometry.coordinates;\n px = lngX(lng);\n py = latY(lat);\n }\n\n const f = {\n type: 1,\n geometry: [[\n Math.round(this.options.extent * (px * z2 - x)),\n Math.round(this.options.extent * (py * z2 - y))\n ]],\n tags\n };\n\n // assign id\n let id;\n if (isCluster || this.options.generateId) {\n // optionally generate id for points\n id = data[k + OFFSET_ID];\n } else {\n // keep id if already assigned\n id = this.points[data[k + OFFSET_ID]].id;\n }\n\n if (id !== undefined) f.id = id;\n\n tile.features.push(f);\n }\n }\n\n _limitZoom(z) {\n return Math.max(this.options.minZoom, Math.min(Math.floor(+z), this.options.maxZoom + 1));\n }\n\n _cluster(tree, zoom) {\n const {radius, extent, reduce, minPoints} = this.options;\n const r = radius / (extent * Math.pow(2, zoom));\n const data = tree.data;\n const nextData = [];\n const stride = this.stride;\n\n // loop through each point\n for (let i = 0; i < data.length; i += stride) {\n // if we've already visited the point at this zoom level, skip it\n if (data[i + OFFSET_ZOOM] <= zoom) continue;\n data[i + OFFSET_ZOOM] = zoom;\n\n // find all nearby points\n const x = data[i];\n const y = data[i + 1];\n const neighborIds = tree.within(data[i], data[i + 1], r);\n\n const numPointsOrigin = data[i + OFFSET_NUM];\n let numPoints = numPointsOrigin;\n\n // count the number of points in a potential cluster\n for (const neighborId of neighborIds) {\n const k = neighborId * stride;\n // filter out neighbors that are already processed\n if (data[k + OFFSET_ZOOM] > zoom) numPoints += data[k + OFFSET_NUM];\n }\n\n // if there were neighbors to merge, and there are enough points to form a cluster\n if (numPoints > numPointsOrigin && numPoints >= minPoints) {\n let wx = x * numPointsOrigin;\n let wy = y * numPointsOrigin;\n\n let clusterProperties;\n let clusterPropIndex = -1;\n\n // encode both zoom and point index on which the cluster originated -- offset by total length of features\n const id = ((i / stride | 0) << 5) + (zoom + 1) + this.points.length;\n\n for (const neighborId of neighborIds) {\n const k = neighborId * stride;\n\n if (data[k + OFFSET_ZOOM] <= zoom) continue;\n data[k + OFFSET_ZOOM] = zoom; // save the zoom (so it doesn't get processed twice)\n\n const numPoints2 = data[k + OFFSET_NUM];\n wx += data[k] * numPoints2; // accumulate coordinates for calculating weighted center\n wy += data[k + 1] * numPoints2;\n\n data[k + OFFSET_PARENT] = id;\n\n if (reduce) {\n if (!clusterProperties) {\n clusterProperties = this._map(data, i, true);\n clusterPropIndex = this.clusterProps.length;\n this.clusterProps.push(clusterProperties);\n }\n reduce(clusterProperties, this._map(data, k));\n }\n }\n\n data[i + OFFSET_PARENT] = id;\n nextData.push(wx / numPoints, wy / numPoints, Infinity, id, -1, numPoints);\n if (reduce) nextData.push(clusterPropIndex);\n\n } else { // left points as unclustered\n for (let j = 0; j < stride; j++) nextData.push(data[i + j]);\n\n if (numPoints > 1) {\n for (const neighborId of neighborIds) {\n const k = neighborId * stride;\n if (data[k + OFFSET_ZOOM] <= zoom) continue;\n data[k + OFFSET_ZOOM] = zoom;\n for (let j = 0; j < stride; j++) nextData.push(data[k + j]);\n }\n }\n }\n }\n\n return nextData;\n }\n\n // get index of the point from which the cluster originated\n _getOriginId(clusterId) {\n return (clusterId - this.points.length) >> 5;\n }\n\n // get zoom of the point from which the cluster originated\n _getOriginZoom(clusterId) {\n return (clusterId - this.points.length) % 32;\n }\n\n _map(data, i, clone) {\n if (data[i + OFFSET_NUM] > 1) {\n const props = this.clusterProps[data[i + OFFSET_PROP]];\n return clone ? Object.assign({}, props) : props;\n }\n const original = this.points[data[i + OFFSET_ID]].properties;\n const result = this.options.map(original);\n return clone && result === original ? Object.assign({}, result) : result;\n }\n}\n\nfunction getClusterJSON(data, i, clusterProps) {\n return {\n type: 'Feature',\n id: data[i + OFFSET_ID],\n properties: getClusterProperties(data, i, clusterProps),\n geometry: {\n type: 'Point',\n coordinates: [xLng(data[i]), yLat(data[i + 1])]\n }\n };\n}\n\nfunction getClusterProperties(data, i, clusterProps) {\n const count = data[i + OFFSET_NUM];\n const abbrev =\n count >= 10000 ? `${Math.round(count / 1000) }k` :\n count >= 1000 ? `${Math.round(count / 100) / 10 }k` : count;\n const propIndex = data[i + OFFSET_PROP];\n const properties = propIndex === -1 ? {} : Object.assign({}, clusterProps[propIndex]);\n return Object.assign(properties, {\n cluster: true,\n cluster_id: data[i + OFFSET_ID],\n point_count: count,\n point_count_abbreviated: abbrev\n });\n}\n\n// longitude/latitude to spherical mercator in [0..1] range\nfunction lngX(lng) {\n return lng / 360 + 0.5;\n}\nfunction latY(lat) {\n const sin = Math.sin(lat * Math.PI / 180);\n const y = (0.5 - 0.25 * Math.log((1 + sin) / (1 - sin)) / Math.PI);\n return y < 0 ? 0 : y > 1 ? 1 : y;\n}\n\n// spherical mercator to longitude/latitude\nfunction xLng(x) {\n return (x - 0.5) * 360;\n}\nfunction yLat(y) {\n const y2 = (180 - y * 360) * Math.PI / 180;\n return 360 * Math.atan(Math.exp(y2)) / Math.PI - 90;\n}\n","/*! *****************************************************************************\r\nCopyright (c) Microsoft Corporation.\r\n\r\nPermission to use, copy, modify, and/or distribute this software for any\r\npurpose with or without fee is hereby granted.\r\n\r\nTHE SOFTWARE IS PROVIDED \"AS IS\" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH\r\nREGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY\r\nAND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,\r\nINDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM\r\nLOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR\r\nOTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR\r\nPERFORMANCE OF THIS SOFTWARE.\r\n***************************************************************************** */\r\n/* global Reflect, Promise */\r\n\r\nvar extendStatics = function(d, b) {\r\n extendStatics = Object.setPrototypeOf ||\r\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\r\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\r\n return extendStatics(d, b);\r\n};\r\n\r\nexport function __extends(d, b) {\r\n extendStatics(d, b);\r\n function __() { this.constructor = d; }\r\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\r\n}\r\n\r\nexport var __assign = function() {\r\n __assign = Object.assign || function __assign(t) {\r\n for (var s, i = 1, n = arguments.length; i < n; i++) {\r\n s = arguments[i];\r\n for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];\r\n }\r\n return t;\r\n }\r\n return __assign.apply(this, arguments);\r\n}\r\n\r\nexport function __rest(s, e) {\r\n var t = {};\r\n for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)\r\n t[p] = s[p];\r\n if (s != null && typeof Object.getOwnPropertySymbols === \"function\")\r\n for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {\r\n if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))\r\n t[p[i]] = s[p[i]];\r\n }\r\n return t;\r\n}\r\n\r\nexport function __decorate(decorators, target, key, desc) {\r\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\r\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\r\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\r\n return c > 3 && r && Object.defineProperty(target, key, r), r;\r\n}\r\n\r\nexport function __param(paramIndex, decorator) {\r\n return function (target, key) { decorator(target, key, paramIndex); }\r\n}\r\n\r\nexport function __metadata(metadataKey, metadataValue) {\r\n if (typeof Reflect === \"object\" && typeof Reflect.metadata === \"function\") return Reflect.metadata(metadataKey, metadataValue);\r\n}\r\n\r\nexport function __awaiter(thisArg, _arguments, P, generator) {\r\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\r\n return new (P || (P = Promise))(function (resolve, reject) {\r\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\r\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\r\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\r\n step((generator = generator.apply(thisArg, _arguments || [])).next());\r\n });\r\n}\r\n\r\nexport function __generator(thisArg, body) {\r\n var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;\r\n return g = { next: verb(0), \"throw\": verb(1), \"return\": verb(2) }, typeof Symbol === \"function\" && (g[Symbol.iterator] = function() { return this; }), g;\r\n function verb(n) { return function (v) { return step([n, v]); }; }\r\n function step(op) {\r\n if (f) throw new TypeError(\"Generator is already executing.\");\r\n while (_) try {\r\n if (f = 1, y && (t = op[0] & 2 ? y[\"return\"] : op[0] ? y[\"throw\"] || ((t = y[\"return\"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;\r\n if (y = 0, t) op = [op[0] & 2, t.value];\r\n switch (op[0]) {\r\n case 0: case 1: t = op; break;\r\n case 4: _.label++; return { value: op[1], done: false };\r\n case 5: _.label++; y = op[1]; op = [0]; continue;\r\n case 7: op = _.ops.pop(); _.trys.pop(); continue;\r\n default:\r\n if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }\r\n if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }\r\n if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }\r\n if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }\r\n if (t[2]) _.ops.pop();\r\n _.trys.pop(); continue;\r\n }\r\n op = body.call(thisArg, _);\r\n } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }\r\n if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };\r\n }\r\n}\r\n\r\nexport function __createBinding(o, m, k, k2) {\r\n if (k2 === undefined) k2 = k;\r\n o[k2] = m[k];\r\n}\r\n\r\nexport function __exportStar(m, exports) {\r\n for (var p in m) if (p !== \"default\" && !exports.hasOwnProperty(p)) exports[p] = m[p];\r\n}\r\n\r\nexport function __values(o) {\r\n var s = typeof Symbol === \"function\" && Symbol.iterator, m = s && o[s], i = 0;\r\n if (m) return m.call(o);\r\n if (o && typeof o.length === \"number\") return {\r\n next: function () {\r\n if (o && i >= o.length) o = void 0;\r\n return { value: o && o[i++], done: !o };\r\n }\r\n };\r\n throw new TypeError(s ? \"Object is not iterable.\" : \"Symbol.iterator is not defined.\");\r\n}\r\n\r\nexport function __read(o, n) {\r\n var m = typeof Symbol === \"function\" && o[Symbol.iterator];\r\n if (!m) return o;\r\n var i = m.call(o), r, ar = [], e;\r\n try {\r\n while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);\r\n }\r\n catch (error) { e = { error: error }; }\r\n finally {\r\n try {\r\n if (r && !r.done && (m = i[\"return\"])) m.call(i);\r\n }\r\n finally { if (e) throw e.error; }\r\n }\r\n return ar;\r\n}\r\n\r\nexport function __spread() {\r\n for (var ar = [], i = 0; i < arguments.length; i++)\r\n ar = ar.concat(__read(arguments[i]));\r\n return ar;\r\n}\r\n\r\nexport function __spreadArrays() {\r\n for (var s = 0, i = 0, il = arguments.length; i < il; i++) s += arguments[i].length;\r\n for (var r = Array(s), k = 0, i = 0; i < il; i++)\r\n for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++)\r\n r[k] = a[j];\r\n return r;\r\n};\r\n\r\nexport function __await(v) {\r\n return this instanceof __await ? (this.v = v, this) : new __await(v);\r\n}\r\n\r\nexport function __asyncGenerator(thisArg, _arguments, generator) {\r\n if (!Symbol.asyncIterator) throw new TypeError(\"Symbol.asyncIterator is not defined.\");\r\n var g = generator.apply(thisArg, _arguments || []), i, q = [];\r\n return i = {}, verb(\"next\"), verb(\"throw\"), verb(\"return\"), i[Symbol.asyncIterator] = function () { return this; }, i;\r\n function verb(n) { if (g[n]) i[n] = function (v) { return new Promise(function (a, b) { q.push([n, v, a, b]) > 1 || resume(n, v); }); }; }\r\n function resume(n, v) { try { step(g[n](v)); } catch (e) { settle(q[0][3], e); } }\r\n function step(r) { r.value instanceof __await ? Promise.resolve(r.value.v).then(fulfill, reject) : settle(q[0][2], r); }\r\n function fulfill(value) { resume(\"next\", value); }\r\n function reject(value) { resume(\"throw\", value); }\r\n function settle(f, v) { if (f(v), q.shift(), q.length) resume(q[0][0], q[0][1]); }\r\n}\r\n\r\nexport function __asyncDelegator(o) {\r\n var i, p;\r\n return i = {}, verb(\"next\"), verb(\"throw\", function (e) { throw e; }), verb(\"return\"), i[Symbol.iterator] = function () { return this; }, i;\r\n function verb(n, f) { i[n] = o[n] ? function (v) { return (p = !p) ? { value: __await(o[n](v)), done: n === \"return\" } : f ? f(v) : v; } : f; }\r\n}\r\n\r\nexport function __asyncValues(o) {\r\n if (!Symbol.asyncIterator) throw new TypeError(\"Symbol.asyncIterator is not defined.\");\r\n var m = o[Symbol.asyncIterator], i;\r\n return m ? m.call(o) : (o = typeof __values === \"function\" ? __values(o) : o[Symbol.iterator](), i = {}, verb(\"next\"), verb(\"throw\"), verb(\"return\"), i[Symbol.asyncIterator] = function () { return this; }, i);\r\n function verb(n) { i[n] = o[n] && function (v) { return new Promise(function (resolve, reject) { v = o[n](v), settle(resolve, reject, v.done, v.value); }); }; }\r\n function settle(resolve, reject, d, v) { Promise.resolve(v).then(function(v) { resolve({ value: v, done: d }); }, reject); }\r\n}\r\n\r\nexport function __makeTemplateObject(cooked, raw) {\r\n if (Object.defineProperty) { Object.defineProperty(cooked, \"raw\", { value: raw }); } else { cooked.raw = raw; }\r\n return cooked;\r\n};\r\n\r\nexport function __importStar(mod) {\r\n if (mod && mod.__esModule) return mod;\r\n var result = {};\r\n if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k];\r\n result.default = mod;\r\n return result;\r\n}\r\n\r\nexport function __importDefault(mod) {\r\n return (mod && mod.__esModule) ? mod : { default: mod };\r\n}\r\n\r\nexport function __classPrivateFieldGet(receiver, privateMap) {\r\n if (!privateMap.has(receiver)) {\r\n throw new TypeError(\"attempted to get private field on non-instance\");\r\n }\r\n return privateMap.get(receiver);\r\n}\r\n\r\nexport function __classPrivateFieldSet(receiver, privateMap, value) {\r\n if (!privateMap.has(receiver)) {\r\n throw new TypeError(\"attempted to set private field on non-instance\");\r\n }\r\n privateMap.set(receiver, value);\r\n return value;\r\n}\r\n","/**\n * Copyright 2023 Google LLC\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n/**\n * Supports markers of either either \"legacy\" or \"advanced\" types.\n */\nexport type Marker =\n | google.maps.Marker\n | google.maps.marker.AdvancedMarkerElement;\n\n/**\n * util class that creates a common set of convenience functions to wrap\n * shared behavior of Advanced Markers and Markers.\n */\nexport class MarkerUtils {\n public static isAdvancedMarkerAvailable(map: google.maps.Map): boolean {\n return (\n google.maps.marker &&\n map.getMapCapabilities().isAdvancedMarkersAvailable === true\n );\n }\n\n public static isAdvancedMarker(\n marker: Marker\n ): marker is google.maps.marker.AdvancedMarkerElement {\n return (\n google.maps.marker &&\n marker instanceof google.maps.marker.AdvancedMarkerElement\n );\n }\n\n public static setMap(marker: Marker, map: google.maps.Map | null) {\n if (this.isAdvancedMarker(marker)) {\n marker.map = map;\n } else {\n marker.setMap(map);\n }\n }\n\n public static getPosition(marker: Marker): google.maps.LatLng {\n // SuperClusterAlgorithm.calculate expects a LatLng instance so we fake it for Adv Markers\n if (this.isAdvancedMarker(marker)) {\n if (marker.position) {\n if (marker.position instanceof google.maps.LatLng) {\n return marker.position;\n }\n // since we can't cast to LatLngLiteral for reasons =(\n if (marker.position.lat && marker.position.lng) {\n return new google.maps.LatLng(\n marker.position.lat,\n marker.position.lng\n );\n }\n }\n return new google.maps.LatLng(null);\n }\n return marker.getPosition();\n }\n\n public static getVisible(marker: Marker) {\n if (this.isAdvancedMarker(marker)) {\n /**\n * Always return true for Advanced Markers because the clusterer\n * uses getVisible as a way to count legacy markers not as an actual\n * indicator of visibility for some reason. Even when markers are hidden\n * Marker.getVisible returns `true` and this is used to set the marker count\n * on the cluster. See the behavior of Cluster.count\n */\n return true;\n }\n return marker.getVisible();\n }\n}\n","/**\n * Copyright 2021 Google LLC\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { MarkerUtils, Marker } from \"./marker-utils\";\n\nexport interface ClusterOptions {\n position?: google.maps.LatLng | google.maps.LatLngLiteral;\n markers?: Marker[];\n}\n\nexport class Cluster {\n public marker?: Marker;\n public readonly markers?: Marker[];\n protected _position: google.maps.LatLng;\n\n constructor({ markers, position }: ClusterOptions) {\n this.markers = markers;\n\n if (position) {\n if (position instanceof google.maps.LatLng) {\n this._position = position;\n } else {\n this._position = new google.maps.LatLng(position);\n }\n }\n }\n\n public get bounds(): google.maps.LatLngBounds | undefined {\n if (this.markers.length === 0 && !this._position) {\n return;\n }\n\n const bounds = new google.maps.LatLngBounds(this._position, this._position);\n for (const marker of this.markers) {\n bounds.extend(MarkerUtils.getPosition(marker));\n }\n return bounds;\n }\n\n public get position(): google.maps.LatLng {\n return this._position || this.bounds.getCenter();\n }\n\n /**\n * Get the count of **visible** markers.\n */\n public get count(): number {\n return this.markers.filter((m: Marker) => MarkerUtils.getVisible(m)).length;\n }\n\n /**\n * Add a marker to the cluster.\n */\n public push(marker: Marker): void {\n this.markers.push(marker);\n }\n\n /**\n * Cleanup references and remove marker from map.\n */\n public delete(): void {\n if (this.marker) {\n MarkerUtils.setMap(this.marker, null);\n this.marker = undefined;\n }\n this.markers.length = 0;\n }\n}\n","/**\n * Copyright 2021 Google LLC\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { Cluster } from \"../cluster\";\nimport { filterMarkersToPaddedViewport } from \"./utils\";\nimport { MarkerUtils, Marker } from \"../marker-utils\";\n\nexport interface AlgorithmInput {\n /**\n * The map containing the markers and clusters.\n */\n map: google.maps.Map;\n /**\n * An array of markers to be clustered.\n *\n * There are some specific edge cases to be aware of including the following:\n * * Markers that are not visible.\n */\n markers: Marker[];\n /**\n * The `mapCanvasProjection` enables easy conversion from lat/lng to pixel.\n *\n * @see [MapCanvasProjection](https://developers.google.com/maps/documentation/javascript/reference/overlay-view#MapCanvasProjection)\n */\n mapCanvasProjection: google.maps.MapCanvasProjection;\n}\n\nexport interface AlgorithmOutput {\n /**\n * The clusters returned based upon the {@link AlgorithmInput}.\n */\n clusters: Cluster[];\n /**\n * A boolean flag indicating that the clusters have not changed.\n */\n changed?: boolean;\n}\n\nexport interface Algorithm {\n /**\n * Calculates an array of {@link Cluster}.\n */\n calculate: ({ markers, map }: AlgorithmInput) => AlgorithmOutput;\n}\n\nexport interface AlgorithmOptions {\n // Markers are not clustered at maxZoom and above.\n maxZoom?: number;\n}\n\n/**\n * @hidden\n */\nexport abstract class AbstractAlgorithm implements Algorithm {\n protected maxZoom: number;\n\n constructor({ maxZoom = 16 }: AlgorithmOptions) {\n this.maxZoom = maxZoom;\n }\n /**\n * Helper function to bypass clustering based upon some map state such as\n * zoom, number of markers, etc.\n *\n * ```typescript\n * cluster({markers, map}: AlgorithmInput): Cluster[] {\n * if (shouldBypassClustering(map)) {\n * return this.noop({markers})\n * }\n * }\n * ```\n */\n protected noop>({\n markers,\n }: T): Cluster[] {\n return noop(markers);\n }\n /**\n * Calculates an array of {@link Cluster}. Calculate is separate from\n * {@link cluster} as it does preprocessing on the markers such as filtering\n * based upon the viewport as in {@link AbstractViewportAlgorithm}. Caching\n * and other optimizations can also be done here.\n */\n public abstract calculate({ markers, map }: AlgorithmInput): AlgorithmOutput;\n\n /**\n * Clusters the markers and called from {@link calculate}.\n */\n protected abstract cluster({ markers, map }: AlgorithmInput): Cluster[];\n}\n\n/**\n * @hidden\n */\nexport interface ViewportAlgorithmOptions extends AlgorithmOptions {\n /**\n * The number of pixels to extend beyond the viewport bounds when filtering\n * markers prior to clustering.\n */\n viewportPadding?: number;\n}\n\n/**\n * Abstract viewport algorithm proves a class to filter markers by a padded\n * viewport. This is a common optimization.\n *\n * @hidden\n */\nexport abstract class AbstractViewportAlgorithm extends AbstractAlgorithm {\n protected viewportPadding = 60;\n\n constructor({ viewportPadding = 60, ...options }: ViewportAlgorithmOptions) {\n super(options);\n this.viewportPadding = viewportPadding;\n }\n public calculate({\n markers,\n map,\n mapCanvasProjection,\n }: AlgorithmInput): AlgorithmOutput {\n if (map.getZoom() >= this.maxZoom) {\n return {\n clusters: this.noop({\n markers,\n }),\n changed: false,\n };\n }\n\n return {\n clusters: this.cluster({\n markers: filterMarkersToPaddedViewport(\n map,\n mapCanvasProjection,\n markers,\n this.viewportPadding\n ),\n map,\n mapCanvasProjection,\n }),\n };\n }\n protected abstract cluster({ markers, map }: AlgorithmInput): Cluster[];\n}\n\n/**\n * @hidden\n */\nexport const noop = (markers: Marker[]): Cluster[] => {\n const clusters = markers.map(\n (marker) =>\n new Cluster({\n position: MarkerUtils.getPosition(marker),\n markers: [marker],\n })\n );\n return clusters;\n};\n","/**\n * Copyright 2021 Google LLC\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { AbstractAlgorithm, AlgorithmInput, AlgorithmOutput } from \"./core\";\nimport SuperCluster, { ClusterFeature } from \"supercluster\";\nimport { MarkerUtils, Marker } from \"../marker-utils\";\nimport { Cluster } from \"../cluster\";\nimport equal from \"fast-deep-equal\";\n\nexport type SuperClusterOptions = SuperCluster.Options<\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n { [name: string]: any },\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n { [name: string]: any }\n>;\n\n/**\n * A very fast JavaScript algorithm for geospatial point clustering using KD trees.\n *\n * @see https://www.npmjs.com/package/supercluster for more information on options.\n */\nexport class SuperClusterAlgorithm extends AbstractAlgorithm {\n protected superCluster: SuperCluster;\n protected markers: Marker[];\n protected clusters: Cluster[];\n protected state = { zoom: -1 };\n\n constructor({ maxZoom, radius = 60, ...options }: SuperClusterOptions) {\n super({ maxZoom });\n\n this.superCluster = new SuperCluster({\n maxZoom: this.maxZoom,\n radius,\n ...options,\n });\n }\n\n public calculate(input: AlgorithmInput): AlgorithmOutput {\n let changed = false;\n const state = { zoom: input.map.getZoom() };\n\n if (!equal(input.markers, this.markers)) {\n changed = true;\n // TODO use proxy to avoid copy?\n this.markers = [...input.markers];\n\n const points = this.markers.map((marker) => {\n const position = MarkerUtils.getPosition(marker);\n const coordinates = [position.lng(), position.lat()];\n return {\n type: \"Feature\" as const,\n geometry: {\n type: \"Point\" as const,\n coordinates,\n },\n properties: { marker },\n };\n });\n this.superCluster.load(points);\n }\n\n if (!changed) {\n if (this.state.zoom <= this.maxZoom || state.zoom <= this.maxZoom) {\n changed = !equal(this.state, state);\n }\n }\n\n this.state = state;\n\n if (changed) {\n this.clusters = this.cluster(input);\n }\n\n return { clusters: this.clusters, changed };\n }\n\n public cluster({ map }: AlgorithmInput): Cluster[] {\n return this.superCluster\n .getClusters([-180, -90, 180, 90], Math.round(map.getZoom()))\n .map((feature: ClusterFeature<{ marker: Marker }>) =>\n this.transformCluster(feature)\n );\n }\n\n protected transformCluster({\n geometry: {\n coordinates: [lng, lat],\n },\n properties,\n }: ClusterFeature<{ marker: Marker }>): Cluster {\n if (properties.cluster) {\n return new Cluster({\n markers: this.superCluster\n .getLeaves(properties.cluster_id, Infinity)\n .map((leaf) => leaf.properties.marker),\n position: { lat, lng },\n });\n }\n\n const marker = properties.marker;\n\n return new Cluster({\n markers: [marker],\n position: MarkerUtils.getPosition(marker),\n });\n }\n}\n","/**\n * Copyright 2021 Google LLC\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { Cluster } from \"./cluster\";\nimport { Marker, MarkerUtils } from \"./marker-utils\";\n\n/**\n * Provides statistics on all clusters in the current render cycle for use in {@link Renderer.render}.\n */\nexport class ClusterStats {\n public readonly markers: { sum: number };\n public readonly clusters: {\n count: number;\n markers: {\n mean: number;\n sum: number;\n min: number;\n max: number;\n };\n };\n\n constructor(markers: Marker[], clusters: Cluster[]) {\n this.markers = { sum: markers.length };\n const clusterMarkerCounts = clusters.map((a) => a.count);\n const clusterMarkerSum = clusterMarkerCounts.reduce((a, b) => a + b, 0);\n\n this.clusters = {\n count: clusters.length,\n markers: {\n mean: clusterMarkerSum / clusters.length,\n sum: clusterMarkerSum,\n min: Math.min(...clusterMarkerCounts),\n max: Math.max(...clusterMarkerCounts),\n },\n };\n }\n}\n\nexport interface Renderer {\n /**\n * Turn a {@link Cluster} into a `Marker`.\n *\n * Below is a simple example to create a marker with the number of markers in the cluster as a label.\n *\n * ```typescript\n * return new google.maps.Marker({\n * position,\n * label: String(markers.length),\n * });\n * ```\n */\n render(cluster: Cluster, stats: ClusterStats, map: google.maps.Map): Marker;\n}\n\nexport class DefaultRenderer implements Renderer {\n /**\n * The default render function for the library used by {@link MarkerClusterer}.\n *\n * Currently set to use the following:\n *\n * ```typescript\n * // change color if this cluster has more markers than the mean cluster\n * const color =\n * count > Math.max(10, stats.clusters.markers.mean)\n * ? \"#ff0000\"\n * : \"#0000ff\";\n *\n * // create svg url with fill color\n * const svg = window.btoa(`\n * `);\n *\n * // create marker using svg icon\n * return new google.maps.Marker({\n * position,\n * icon: {\n * url: `data:image/svg+xml;base64,${svg}`,\n * scaledSize: new google.maps.Size(45, 45),\n * },\n * label: {\n * text: String(count),\n * color: \"rgba(255,255,255,0.9)\",\n * fontSize: \"12px\",\n * },\n * // adjust zIndex to be above other markers\n * zIndex: 1000 + count,\n * });\n * ```\n */\n public render(\n { count, position }: Cluster,\n stats: ClusterStats,\n map: google.maps.Map\n ): Marker {\n // change color if this cluster has more markers than the mean cluster\n const color =\n count > Math.max(10, stats.clusters.markers.mean) ? \"#ff0000\" : \"#0000ff\";\n\n // create svg literal with fill color\n const svg = ``;\n\n const title = `Cluster of ${count} markers`,\n // adjust zIndex to be above other markers\n zIndex: number = Number(google.maps.Marker.MAX_ZINDEX) + count;\n\n if (MarkerUtils.isAdvancedMarkerAvailable(map)) {\n // create cluster SVG element\n const parser = new DOMParser();\n const svgEl = parser.parseFromString(\n svg,\n \"image/svg+xml\"\n ).documentElement;\n svgEl.setAttribute(\"transform\", \"translate(0 25)\");\n\n const clusterOptions: google.maps.marker.AdvancedMarkerElementOptions = {\n map,\n position,\n zIndex,\n title,\n content: svgEl,\n };\n return new google.maps.marker.AdvancedMarkerElement(clusterOptions);\n }\n\n const clusterOptions: google.maps.MarkerOptions = {\n position,\n zIndex,\n title,\n icon: {\n url: `data:image/svg+xml;base64,${btoa(svg)}`,\n anchor: new google.maps.Point(25, 25),\n },\n };\n return new google.maps.Marker(clusterOptions);\n }\n}\n","/**\n * Copyright 2019 Google LLC. All Rights Reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n// eslint-disable-next-line @typescript-eslint/no-empty-interface\nexport interface OverlayViewSafe extends google.maps.OverlayView {}\n\n/**\n * Extends an object's prototype by another's.\n *\n * @param type1 The Type to be extended.\n * @param type2 The Type to extend with.\n * @ignore\n */\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nfunction extend(type1: any, type2: any): void {\n /* istanbul ignore next */\n // eslint-disable-next-line prefer-const\n for (let property in type2.prototype) {\n type1.prototype[property] = type2.prototype[property];\n }\n}\n\n/**\n * @ignore\n */\nexport class OverlayViewSafe {\n constructor() {\n // MarkerClusterer implements google.maps.OverlayView interface. We use the\n // extend function to extend MarkerClusterer with google.maps.OverlayView\n // because it might not always be available when the code is defined so we\n // look for it at the last possible moment. If it doesn't exist now then\n // there is no point going ahead :)\n extend(OverlayViewSafe, google.maps.OverlayView);\n }\n}\n","/**\n * Copyright 2021 Google LLC\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport {\n Algorithm,\n AlgorithmOptions,\n SuperClusterAlgorithm,\n} from \"./algorithms\";\nimport { ClusterStats, DefaultRenderer, Renderer } from \"./renderer\";\nimport { Cluster } from \"./cluster\";\nimport { OverlayViewSafe } from \"./overlay-view-safe\";\nimport { MarkerUtils, Marker } from \"./marker-utils\";\n\nexport type onClusterClickHandler = (\n event: google.maps.MapMouseEvent,\n cluster: Cluster,\n map: google.maps.Map\n) => void;\nexport interface MarkerClustererOptions {\n markers?: Marker[];\n /**\n * An algorithm to cluster markers. Default is {@link SuperClusterAlgorithm}. Must\n * provide a `calculate` method accepting {@link AlgorithmInput} and returning\n * an array of {@link Cluster}.\n */\n algorithm?: Algorithm;\n algorithmOptions?: AlgorithmOptions;\n map?: google.maps.Map | null;\n /**\n * An object that converts a {@link Cluster} into a `google.maps.Marker`.\n * Default is {@link DefaultRenderer}.\n */\n renderer?: Renderer;\n onClusterClick?: onClusterClickHandler;\n}\n\nexport enum MarkerClustererEvents {\n CLUSTERING_BEGIN = \"clusteringbegin\",\n CLUSTERING_END = \"clusteringend\",\n CLUSTER_CLICK = \"click\",\n}\n\nexport const defaultOnClusterClickHandler: onClusterClickHandler = (\n _: google.maps.MapMouseEvent,\n cluster: Cluster,\n map: google.maps.Map\n): void => {\n map.fitBounds(cluster.bounds);\n};\n/**\n * MarkerClusterer creates and manages per-zoom-level clusters for large amounts\n * of markers. See {@link MarkerClustererOptions} for more details.\n *\n */\nexport class MarkerClusterer extends OverlayViewSafe {\n /** @see {@link MarkerClustererOptions.onClusterClick} */\n public onClusterClick: onClusterClickHandler;\n /** @see {@link MarkerClustererOptions.algorithm} */\n protected algorithm: Algorithm;\n protected clusters: Cluster[];\n protected markers: Marker[];\n /** @see {@link MarkerClustererOptions.renderer} */\n protected renderer: Renderer;\n /** @see {@link MarkerClustererOptions.map} */\n protected map: google.maps.Map | null;\n protected idleListener: google.maps.MapsEventListener;\n\n constructor({\n map,\n markers = [],\n algorithmOptions = {},\n algorithm = new SuperClusterAlgorithm(algorithmOptions),\n renderer = new DefaultRenderer(),\n onClusterClick = defaultOnClusterClickHandler,\n }: MarkerClustererOptions) {\n super();\n this.markers = [...markers];\n this.clusters = [];\n\n this.algorithm = algorithm;\n this.renderer = renderer;\n\n this.onClusterClick = onClusterClick;\n\n if (map) {\n this.setMap(map);\n }\n }\n\n public addMarker(marker: Marker, noDraw?: boolean): void {\n if (this.markers.includes(marker)) {\n return;\n }\n\n this.markers.push(marker);\n if (!noDraw) {\n this.render();\n }\n }\n\n public addMarkers(markers: Marker[], noDraw?: boolean): void {\n markers.forEach((marker) => {\n this.addMarker(marker, true);\n });\n\n if (!noDraw) {\n this.render();\n }\n }\n\n public removeMarker(marker: Marker, noDraw?: boolean): boolean {\n const index = this.markers.indexOf(marker);\n\n if (index === -1) {\n // Marker is not in our list of markers, so do nothing:\n return false;\n }\n\n MarkerUtils.setMap(marker, null);\n this.markers.splice(index, 1); // Remove the marker from the list of managed markers\n\n if (!noDraw) {\n this.render();\n }\n\n return true;\n }\n\n public removeMarkers(markers: Marker[], noDraw?: boolean): boolean {\n let removed = false;\n\n markers.forEach((marker) => {\n removed = this.removeMarker(marker, true) || removed;\n });\n\n if (removed && !noDraw) {\n this.render();\n }\n\n return removed;\n }\n\n public clearMarkers(noDraw?: boolean): void {\n this.markers.length = 0;\n\n if (!noDraw) {\n this.render();\n }\n }\n\n /**\n * Recalculates and draws all the marker clusters.\n */\n public render(): void {\n const map = this.getMap();\n if (map instanceof google.maps.Map && map.getProjection()) {\n google.maps.event.trigger(\n this,\n MarkerClustererEvents.CLUSTERING_BEGIN,\n this\n );\n const { clusters, changed } = this.algorithm.calculate({\n markers: this.markers,\n map,\n mapCanvasProjection: this.getProjection(),\n });\n\n // Allow algorithms to return flag on whether the clusters/markers have changed.\n if (changed || changed == undefined) {\n // Accumulate the markers of the clusters composed of a single marker.\n // Those clusters directly use the marker.\n // Clusters with more than one markers use a group marker generated by a renderer.\n const singleMarker = new Set();\n for (const cluster of clusters) {\n if (cluster.markers.length == 1) {\n singleMarker.add(cluster.markers[0]);\n }\n }\n\n const groupMarkers: Marker[] = [];\n // Iterate the clusters that are currently rendered.\n for (const cluster of this.clusters) {\n if (cluster.marker == null) {\n continue;\n }\n if (cluster.markers.length == 1) {\n if (!singleMarker.has(cluster.marker)) {\n // The marker:\n // - was previously rendered because it is from a cluster with 1 marker,\n // - should no more be rendered as it is not in singleMarker.\n MarkerUtils.setMap(cluster.marker, null);\n }\n } else {\n // Delay the removal of old group markers to avoid flickering.\n groupMarkers.push(cluster.marker);\n }\n }\n\n this.clusters = clusters;\n this.renderClusters();\n\n // Delayed removal of the markers of the former groups.\n requestAnimationFrame(() =>\n groupMarkers.forEach((marker) => MarkerUtils.setMap(marker, null))\n );\n }\n google.maps.event.trigger(\n this,\n MarkerClustererEvents.CLUSTERING_END,\n this\n );\n }\n }\n\n public onAdd(): void {\n this.idleListener = this.getMap().addListener(\n \"idle\",\n this.render.bind(this)\n );\n this.render();\n }\n\n public onRemove(): void {\n google.maps.event.removeListener(this.idleListener);\n this.reset();\n }\n\n protected reset(): void {\n this.markers.forEach((marker) => MarkerUtils.setMap(marker, null));\n this.clusters.forEach((cluster) => cluster.delete());\n this.clusters = [];\n }\n\n protected renderClusters(): void {\n // Generate stats to pass to renderers.\n const stats = new ClusterStats(this.markers, this.clusters);\n const map = this.getMap() as google.maps.Map;\n\n this.clusters.forEach((cluster) => {\n if (cluster.markers.length === 1) {\n cluster.marker = cluster.markers[0];\n } else {\n // Generate the marker to represent the group.\n cluster.marker = this.renderer.render(cluster, stats, map);\n // Make sure all individual markers are removed from the map.\n cluster.markers.forEach((marker) => MarkerUtils.setMap(marker, null));\n if (this.onClusterClick) {\n cluster.marker.addListener(\n \"click\",\n /* istanbul ignore next */\n (event: google.maps.MapMouseEvent) => {\n google.maps.event.trigger(\n this,\n MarkerClustererEvents.CLUSTER_CLICK,\n cluster\n );\n this.onClusterClick(event, cluster, map);\n }\n );\n }\n }\n MarkerUtils.setMap(cluster.marker, map);\n });\n }\n}\n","import React, { useEffect, useRef, useState } from \"react\";\nimport { MarkerClusterer } from \"@googlemaps/markerclusterer\";\n\nconst DEFAULT_CENTER = { lat: 0.5816, lng: 32.3152 };\nconst DEFAULT_ZOOM = 5.6;\nconst DEMO_MAP_ID = \"DEMO_MAP_ID\";\n\nexport default function GoogleMapWithMarkers({ className, streetViewLocation, locations, onFilter, status, category }) {\n const mapRef = useRef(null);\n const streetViewRef = useRef(null);\n\n const initMap = async () => {\n const map = new window.google.maps.Map(mapRef.current, {\n center: DEFAULT_CENTER,\n zoom: DEFAULT_ZOOM,\n mapId: DEMO_MAP_ID\n });\n\n const infoWindow = new window.google.maps.InfoWindow({\n content: \"\",\n disableAutoPan: true\n });\n\n const markers = locations?.map((position, i) => {\n const pin = new window.google.maps.Marker({\n position: position,\n label: {\n text: position.category === \"shop\" ? String.fromCharCode(0xea12) : String.fromCharCode(0xe7fd),\n fontFamily: \"Material Icons\",\n color: \"#ffffff\",\n fontSize: \"18px\"\n },\n title: position.label\n });\n\n pin.addListener(\"click\", () => {\n infoWindow.setContent(`${position.lat}, ${position.lng}`);\n infoWindow.open(map, pin);\n });\n\n return pin;\n });\n\n new MarkerClusterer({ markers, map });\n\n if (streetViewLocation) {\n const panorama = new window.google.maps.StreetViewPanorama(streetViewRef.current, {\n position: streetViewLocation,\n pov: { heading: 165, pitch: 0 },\n zoom: 1\n });\n map.setStreetView(panorama);\n }\n\n const centerControlDiv = document.createElement(\"div\");\n const statusControl = createStatusDropDown();\n const categoryControl = createCategoryDropDown();\n\n centerControlDiv.appendChild(statusControl);\n centerControlDiv.appendChild(categoryControl);\n map.controls[window.google.maps.ControlPosition.TOP_LEFT].push(centerControlDiv);\n };\n\n const createFilterButton = () => {\n const controlButton = document.createElement(\"button\");\n\n controlButton.style.backgroundColor = \"#fff\";\n controlButton.style.border = \"2px solid #fff\";\n controlButton.style.borderRadius = \"3px\";\n controlButton.style.boxShadow = \"rgba(0, 0, 0, 0.3) 0px 1px 4px -1px\";\n controlButton.style.color = \"rgb(25,25,25)\";\n controlButton.style.cursor = \"pointer\";\n controlButton.style.fontFamily = \"Roboto,Arial,sans-serif\";\n controlButton.style.fontSize = \"16px\";\n controlButton.style.lineHeight = \"38px\";\n controlButton.style.margin = \"8px 0 22px\";\n controlButton.style.padding = \"0 5px\";\n controlButton.style.textAlign = \"center\";\n controlButton.textContent = \"Filter \";\n controlButton.title = \"Click to filter the map\";\n controlButton.type = \"button\";\n\n controlButton.addEventListener(\"click\", () => {\n onFilter();\n });\n return controlButton;\n };\n\n const createStatusDropDown = () => {\n const mapTypeDropdown = document.createElement(\"select\");\n mapTypeDropdown.innerHTML = `\n \n \n \n \n `;\n mapTypeDropdown.value = status;\n mapTypeDropdown.style.fontFamily = \"Roboto,Arial,sans-serif\";\n mapTypeDropdown.style.boxShadow = \"rgba(0, 0, 0, 0.3) 0px 1px 4px -1px\";\n mapTypeDropdown.style.lineHeight = \"27px\";\n mapTypeDropdown.style.margin = \"10px 0 22px\";\n mapTypeDropdown.style.padding = \"0 10px\";\n mapTypeDropdown.style.height = \"40px\";\n mapTypeDropdown.style.borderRadius = \"2px\";\n mapTypeDropdown.style.cursor = \"pointer\";\n mapTypeDropdown.ariaPlaceholder = \"Filter\";\n mapTypeDropdown.onchange = (e) => {\n onFilter(e.target.value, \"Status\");\n };\n mapTypeDropdown.className = \"bg-white border-none text-xl text-gray-700\";\n\n return mapTypeDropdown;\n };\n\n const createCategoryDropDown = () => {\n const mapTypeDropdown = document.createElement(\"select\");\n mapTypeDropdown.innerHTML = `\n \n \n \n `;\n mapTypeDropdown.value = category;\n mapTypeDropdown.style.fontFamily = \"Roboto,Arial,sans-serif\";\n mapTypeDropdown.style.boxShadow = \"rgba(0, 0, 0, 0.3) 0px 1px 4px -1px\";\n mapTypeDropdown.style.lineHeight = \"38px\";\n mapTypeDropdown.style.margin = \"10px 0 22px\";\n mapTypeDropdown.style.cursor = \"pointer\";\n mapTypeDropdown.style.padding = \"0 10px\";\n mapTypeDropdown.style.height = \"40px\";\n mapTypeDropdown.style.borderRadius = \"2px\";\n mapTypeDropdown.ariaPlaceholder = \"Filter\";\n\n mapTypeDropdown.onchange = (e) => {\n onFilter(e.target.value, \"Category\");\n };\n mapTypeDropdown.className = \"bg-white border-none text-xl text-gray-700 ml-3\";\n\n return mapTypeDropdown;\n };\n\n useEffect(() => {\n if (window.google) {\n initMap();\n }\n }, [locations]);\n\n return (\n \n
\n {streetViewLocation &&
}\n
\n
\n {showStats && (\n <>\n
24 new \n
since last visit\n \n )}\n
\n );\n}\n\nexport default StatusSummary;\n","import React, { useEffect, useRef, useState } from \"react\";\nimport { Chart } from \"primereact/chart\";\nimport { useNavigate } from \"react-router-dom\";\nimport StorageParams from \"../constants/StorageParams\";\nimport { GoogleMapsWrapper, MapComponent } from \"../utils/GoogleMapUtils\";\nimport GoogleMapWithMarkers from \"../utils/ReactMap\";\nimport { BaseApiService } from \"../utils/BaseApiService\";\nimport StatusSummary from \"../components/StatusSummary\";\nimport { formatNumberWithCommas } from \"../utils/Utils\";\n\nlet times24hr = [];\nfor (let hour = 0; hour < 24; hour++) {\n times24hr.push(`${hour.toString().padStart(2, \"0\")}:00`);\n}\n\nconst dailyData = {\n labels: times24hr,\n datasets: [\n {\n label: \"Customers\",\n backgroundColor: \"#000\",\n borderColor: \"#000\",\n data: [6, 5, 8, 8, 5, 5, 4, 2, 6, 2, 1, 4, 7, 2, 5, 4, 11, 8, 5],\n tension: 0.4\n },\n {\n label: \"Items\",\n backgroundColor: \"#f5e102\",\n borderColor: \"#f5e102\",\n data: [65, 59, 80, 81, 56, 55, 40, 20, 60, 29, 19, 40, 73, 20, 50, 47, 18, 8, 84],\n tension: 0.4\n }\n ]\n};\n\nconst weeklyData = {\n labels: [\"Sun\", \"Mon\", \"Tue\", \"Wed\", \"Thur\", \"Fri\", \"Sat\"],\n datasets: [\n {\n label: \"Cash\",\n backgroundColor: \"#f5e102\",\n borderColor: \"#f5e102\",\n data: [65, 59, 80, 81, 56, 55, 50],\n tension: 0.4\n },\n {\n label: \"Debt\",\n backgroundColor: \"#000\",\n borderColor: \"#000\",\n data: [60, 50, 68, 38, 50, 50, 40],\n tension: 0.4\n },\n ]\n};\nconst yearData = {\n labels: [\"January\", \"February\", \"March\", \"April\", \"May\", \"June\", \"July\"],\n datasets: [\n {\n label: \"My First dataset\",\n backgroundColor: \"#000\",\n borderColor: \"#000\",\n data: [65, 59, 80, 81, 56, 55, 40],\n tension: 0.4\n },\n {\n label: \"My Second dataset\",\n backgroundColor: \"#f5e102\",\n borderColor: \"#f5e102\",\n data: [28, 48, 40, 19, 86, 27, 90],\n tension: 0.4\n }\n ]\n};\n\nconst pieChartData = {\n labels: [\"Female\", \"Male\"],\n datasets: [\n {\n label: \"Gender\",\n backgroundColor: [\"#f5e102\", \"#000000\"],\n data: [60, 40]\n }\n ]\n};\n\nconst Dashboard = () => {\n const isLoggedIn = localStorage.getItem(StorageParams.IS_LOGGED_IN);\n const [locations, setLocations] = useState(null);\n const [filteredLocations, setFilteredLocations] = useState(locations);\n const [status, setStatus] = useState(\"All\");\n const [category, setCategory] = useState(\"All\");\n\n useEffect(() => {\n if (!isLoggedIn) {\n localStorage.clear();\n } else {\n loadShopLocations();\n }\n }, [isLoggedIn]);\n\n const loadShopLocations = () => {\n new BaseApiService(\"/locations\")\n .getRequestWithJsonResponse()\n .then((response) => {\n setLocations(\n response?.records.map((shop) => {\n return {\n label: shop.name,\n lat: Number.parseFloat(shop.locationLatitude),\n lng: Number.parseFloat(shop.locationLongitude),\n status: shop.statusName,\n stage: shop.stageName,\n source: shop.source,\n category: shop.category\n };\n })\n );\n setFilteredLocations(\n response?.records.map((shop) => {\n return {\n label: shop.name,\n lat: Number.parseFloat(shop.locationLatitude),\n lng: Number.parseFloat(shop.locationLongitude),\n status: shop.statusName,\n stage: shop.stageName,\n source: shop.source,\n category: shop.category\n };\n })\n );\n })\n .catch((error) => {});\n };\n\n const filterLocations = (filter, filterType) => {\n if (filter === \"All\") {\n setStatus(\"All\");\n setCategory(\"All\");\n setFilteredLocations([...locations]);\n } else if (filterType === \"Status\") {\n setStatus(filter);\n setFilteredLocations(\n locations.filter((location) => {\n return location.status === filter;\n })\n );\n } else if (filterType === \"Category\") {\n setCategory(filter);\n setFilteredLocations(\n locations.filter((location) => {\n return location.category === filter;\n })\n );\n }\n };\n\n return (\n
\n
\n\n
\n
\n
\n
\n
Transactions
\n \n \n
\n\n
\n
\n
\n {locations != null && (\n
\n \n \n )}\n
\n );\n};\n\nexport default Dashboard;\n","import * as React from 'react';\nimport { useMountEffect, useUpdateEffect } from 'primereact/hooks';\nimport { InputText } from 'primereact/inputtext';\nimport { Ripple } from 'primereact/ripple';\nimport { Tooltip } from 'primereact/tooltip';\nimport { ObjectUtils, DomHandler, classNames } from 'primereact/utils';\n\nfunction _extends() {\n _extends = Object.assign ? Object.assign.bind() : function (target) {\n for (var i = 1; i < arguments.length; i++) {\n var source = arguments[i];\n for (var key in source) {\n if (Object.prototype.hasOwnProperty.call(source, key)) {\n target[key] = source[key];\n }\n }\n }\n return target;\n };\n return _extends.apply(this, arguments);\n}\n\nfunction _typeof(obj) {\n \"@babel/helpers - typeof\";\n\n return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (obj) {\n return typeof obj;\n } : function (obj) {\n return obj && \"function\" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj;\n }, _typeof(obj);\n}\n\nfunction _toPrimitive(input, hint) {\n if (_typeof(input) !== \"object\" || input === null) return input;\n var prim = input[Symbol.toPrimitive];\n if (prim !== undefined) {\n var res = prim.call(input, hint || \"default\");\n if (_typeof(res) !== \"object\") return res;\n throw new TypeError(\"@@toPrimitive must return a primitive value.\");\n }\n return (hint === \"string\" ? String : Number)(input);\n}\n\nfunction _toPropertyKey(arg) {\n var key = _toPrimitive(arg, \"string\");\n return _typeof(key) === \"symbol\" ? key : String(key);\n}\n\nfunction _defineProperty(obj, key, value) {\n key = _toPropertyKey(key);\n if (key in obj) {\n Object.defineProperty(obj, key, {\n value: value,\n enumerable: true,\n configurable: true,\n writable: true\n });\n } else {\n obj[key] = value;\n }\n return obj;\n}\n\nfunction _arrayLikeToArray(arr, len) {\n if (len == null || len > arr.length) len = arr.length;\n for (var i = 0, arr2 = new Array(len); i < len; i++) {\n arr2[i] = arr[i];\n }\n return arr2;\n}\n\nfunction _arrayWithoutHoles(arr) {\n if (Array.isArray(arr)) return _arrayLikeToArray(arr);\n}\n\nfunction _iterableToArray(iter) {\n if (typeof Symbol !== \"undefined\" && iter[Symbol.iterator] != null || iter[\"@@iterator\"] != null) return Array.from(iter);\n}\n\nfunction _unsupportedIterableToArray(o, minLen) {\n if (!o) return;\n if (typeof o === \"string\") return _arrayLikeToArray(o, minLen);\n var n = Object.prototype.toString.call(o).slice(8, -1);\n if (n === \"Object\" && o.constructor) n = o.constructor.name;\n if (n === \"Map\" || n === \"Set\") return Array.from(o);\n if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);\n}\n\nfunction _nonIterableSpread() {\n throw new TypeError(\"Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\");\n}\n\nfunction _toConsumableArray(arr) {\n return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread();\n}\n\nfunction _arrayWithHoles(arr) {\n if (Array.isArray(arr)) return arr;\n}\n\nfunction _iterableToArrayLimit(arr, i) {\n var _i = null == arr ? null : \"undefined\" != typeof Symbol && arr[Symbol.iterator] || arr[\"@@iterator\"];\n if (null != _i) {\n var _s,\n _e,\n _x,\n _r,\n _arr = [],\n _n = !0,\n _d = !1;\n try {\n if (_x = (_i = _i.call(arr)).next, 0 === i) {\n if (Object(_i) !== _i) return;\n _n = !1;\n } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0) {\n ;\n }\n } catch (err) {\n _d = !0, _e = err;\n } finally {\n try {\n if (!_n && null != _i[\"return\"] && (_r = _i[\"return\"](), Object(_r) !== _r)) return;\n } finally {\n if (_d) throw _e;\n }\n }\n return _arr;\n }\n}\n\nfunction _nonIterableRest() {\n throw new TypeError(\"Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\");\n}\n\nfunction _slicedToArray(arr, i) {\n return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();\n}\n\nfunction 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; }\nfunction _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; }\nvar InputNumber = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (props, ref) {\n var _React$useState = React.useState(false),\n _React$useState2 = _slicedToArray(_React$useState, 2),\n focusedState = _React$useState2[0],\n setFocusedState = _React$useState2[1];\n var elementRef = React.useRef(null);\n var inputRef = React.useRef(null);\n var timer = React.useRef(null);\n var lastValue = React.useRef(null);\n var numberFormat = React.useRef(null);\n var groupChar = React.useRef(null);\n var prefixChar = React.useRef(null);\n var suffixChar = React.useRef(null);\n var isSpecialChar = React.useRef(null);\n var _numeral = React.useRef(null);\n var _group = React.useRef(null);\n var _minusSign = React.useRef(null);\n var _currency = React.useRef(null);\n var _decimal = React.useRef(null);\n var _suffix = React.useRef(null);\n var _prefix = React.useRef(null);\n var _index = React.useRef(null);\n var stacked = props.showButtons && props.buttonLayout === 'stacked';\n var horizontal = props.showButtons && props.buttonLayout === 'horizontal';\n var vertical = props.showButtons && props.buttonLayout === 'vertical';\n var inputMode = props.inputMode || (props.mode === 'decimal' && !props.minFractionDigits ? 'numeric' : 'decimal');\n var getOptions = function getOptions() {\n return {\n localeMatcher: props.localeMatcher,\n style: props.mode,\n currency: props.currency,\n currencyDisplay: props.currencyDisplay,\n useGrouping: props.useGrouping,\n minimumFractionDigits: props.minFractionDigits,\n maximumFractionDigits: props.maxFractionDigits\n };\n };\n var constructParser = function constructParser() {\n numberFormat.current = new Intl.NumberFormat(props.locale, getOptions());\n var numerals = _toConsumableArray(new Intl.NumberFormat(props.locale, {\n useGrouping: false\n }).format(9876543210)).reverse();\n var index = new Map(numerals.map(function (d, i) {\n return [d, i];\n }));\n _numeral.current = new RegExp(\"[\".concat(numerals.join(''), \"]\"), 'g');\n _group.current = getGroupingExpression();\n _minusSign.current = getMinusSignExpression();\n _currency.current = getCurrencyExpression();\n _decimal.current = getDecimalExpression();\n _suffix.current = getSuffixExpression();\n _prefix.current = getPrefixExpression();\n _index.current = function (d) {\n return index.get(d);\n };\n };\n var escapeRegExp = function escapeRegExp(text) {\n return text.replace(/[-[\\]{}()*+?.,\\\\^$|#\\s]/g, '\\\\$&');\n };\n var getDecimalExpression = function getDecimalExpression() {\n var formatter = new Intl.NumberFormat(props.locale, _objectSpread(_objectSpread({}, getOptions()), {}, {\n useGrouping: false\n }));\n return new RegExp(\"[\".concat(formatter.format(1.1).replace(_currency.current, '').trim().replace(_numeral.current, ''), \"]\"), 'g');\n };\n var getGroupingExpression = function getGroupingExpression() {\n var formatter = new Intl.NumberFormat(props.locale, {\n useGrouping: true\n });\n groupChar.current = formatter.format(1000000).trim().replace(_numeral.current, '').charAt(0);\n return new RegExp(\"[\".concat(groupChar.current, \"]\"), 'g');\n };\n var getMinusSignExpression = function getMinusSignExpression() {\n var formatter = new Intl.NumberFormat(props.locale, {\n useGrouping: false\n });\n return new RegExp(\"[\".concat(formatter.format(-1).trim().replace(_numeral.current, ''), \"]\"), 'g');\n };\n var getCurrencyExpression = function getCurrencyExpression() {\n if (props.currency) {\n var formatter = new Intl.NumberFormat(props.locale, {\n style: 'currency',\n currency: props.currency,\n currencyDisplay: props.currencyDisplay,\n minimumFractionDigits: 0,\n maximumFractionDigits: 0\n });\n return new RegExp(\"[\".concat(formatter.format(1).replace(/\\s/g, '').replace(_numeral.current, '').replace(_group.current, ''), \"]\"), 'g');\n }\n return new RegExp(\"[]\", 'g');\n };\n var getPrefixExpression = function getPrefixExpression() {\n if (props.prefix) {\n prefixChar.current = props.prefix;\n } else {\n var formatter = new Intl.NumberFormat(props.locale, {\n style: props.mode,\n currency: props.currency,\n currencyDisplay: props.currencyDisplay\n });\n prefixChar.current = formatter.format(1).split('1')[0];\n }\n return new RegExp(\"\".concat(escapeRegExp(prefixChar.current || '')), 'g');\n };\n var getSuffixExpression = function getSuffixExpression() {\n if (props.suffix) {\n suffixChar.current = props.suffix;\n } else {\n var formatter = new Intl.NumberFormat(props.locale, {\n style: props.mode,\n currency: props.currency,\n currencyDisplay: props.currencyDisplay,\n minimumFractionDigits: 0,\n maximumFractionDigits: 0\n });\n suffixChar.current = formatter.format(1).split('1')[1];\n }\n return new RegExp(\"\".concat(escapeRegExp(suffixChar.current || '')), 'g');\n };\n var formatValue = function formatValue(value) {\n if (value != null) {\n if (value === '-') {\n // Minus sign\n return value;\n }\n if (props.format) {\n var formatter = new Intl.NumberFormat(props.locale, getOptions());\n var _formattedValue = formatter.format(value);\n if (props.prefix) {\n _formattedValue = props.prefix + _formattedValue;\n }\n if (props.suffix) {\n _formattedValue = _formattedValue + props.suffix;\n }\n return _formattedValue;\n }\n return value.toString();\n }\n return '';\n };\n var parseValue = function parseValue(text) {\n 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);\n if (filteredText) {\n if (filteredText === '-')\n // Minus sign\n return filteredText;\n var parsedValue = +filteredText;\n return isNaN(parsedValue) ? null : parsedValue;\n }\n return null;\n };\n var repeat = function repeat(event, interval, dir) {\n var i = interval || 500;\n clearTimer();\n timer.current = setTimeout(function () {\n repeat(event, 40, dir);\n }, i);\n spin(event, dir);\n };\n var spin = function spin(event, dir) {\n if (inputRef.current) {\n var step = props.step * dir;\n var currentValue = parseValue(inputRef.current.value) || 0;\n var newValue = validateValue(currentValue + step);\n if (props.maxLength && props.maxLength < formatValue(newValue).length) {\n return;\n }\n\n // touch devices trigger the keyboard to display because of setSelectionRange\n !DomHandler.isTouchDevice() && updateInput(newValue, null, 'spin');\n updateModel(event, newValue);\n handleOnChange(event, currentValue, newValue);\n }\n };\n var onUpButtonTouchStart = function onUpButtonTouchStart(event) {\n if (!props.disabled && !props.readOnly) {\n repeat(event, null, 1);\n event.preventDefault();\n }\n };\n var onUpButtonMouseDown = function onUpButtonMouseDown(event) {\n if (!props.disabled && !props.readOnly) {\n props.autoFocus && DomHandler.focus(inputRef.current, props.autoFocus);\n repeat(event, null, 1);\n event.preventDefault();\n }\n };\n var onUpButtonTouchEnd = function onUpButtonTouchEnd() {\n if (!props.disabled && !props.readOnly) {\n clearTimer();\n }\n };\n var onUpButtonMouseUp = function onUpButtonMouseUp() {\n if (!props.disabled && !props.readOnly) {\n clearTimer();\n }\n };\n var onUpButtonMouseLeave = function onUpButtonMouseLeave() {\n if (!props.disabled && !props.readOnly) {\n clearTimer();\n }\n };\n var onUpButtonKeyUp = function onUpButtonKeyUp() {\n if (!props.disabled && !props.readOnly) {\n clearTimer();\n }\n };\n var onUpButtonKeyDown = function onUpButtonKeyDown(event) {\n if (!props.disabled && !props.readOnly && (event.keyCode === 32 || event.keyCode === 13)) {\n repeat(event, null, 1);\n }\n };\n var onDownButtonTouchStart = function onDownButtonTouchStart(event) {\n if (!props.disabled && !props.readOnly) {\n repeat(event, null, -1);\n event.preventDefault();\n }\n };\n var onDownButtonTouchEnd = function onDownButtonTouchEnd() {\n if (!props.disabled && !props.readOnly) {\n clearTimer();\n }\n };\n var onDownButtonMouseDown = function onDownButtonMouseDown(event) {\n if (!props.disabled && !props.readOnly) {\n props.autoFocus && DomHandler.focus(inputRef.current, props.autoFocus);\n repeat(event, null, -1);\n event.preventDefault();\n }\n };\n var onDownButtonMouseUp = function onDownButtonMouseUp() {\n if (!props.disabled && !props.readOnly) {\n clearTimer();\n }\n };\n var onDownButtonMouseLeave = function onDownButtonMouseLeave() {\n if (!props.disabled && !props.readOnly) {\n clearTimer();\n }\n };\n var onDownButtonKeyUp = function onDownButtonKeyUp() {\n if (!props.disabled && !props.readOnly) {\n clearTimer();\n }\n };\n var onDownButtonKeyDown = function onDownButtonKeyDown(event) {\n if (!props.disabled && !props.readOnly && (event.keyCode === 32 || event.keyCode === 13)) {\n repeat(event, null, -1);\n }\n };\n var onInput = function onInput(event) {\n if (props.disabled || props.readOnly) {\n return;\n }\n if (isSpecialChar.current) {\n event.target.value = lastValue.current;\n }\n isSpecialChar.current = false;\n };\n var onInputKeyDown = function onInputKeyDown(event) {\n if (props.disabled || props.readOnly) {\n return;\n }\n lastValue.current = event.target.value;\n if (event.shiftKey || event.altKey) {\n isSpecialChar.current = true;\n return;\n }\n var selectionStart = event.target.selectionStart;\n var selectionEnd = event.target.selectionEnd;\n var inputValue = event.target.value;\n var newValueStr = null;\n if (event.altKey) {\n event.preventDefault();\n }\n switch (event.which) {\n //up\n case 38:\n spin(event, 1);\n event.preventDefault();\n break;\n\n //down\n case 40:\n spin(event, -1);\n event.preventDefault();\n break;\n\n //left\n case 37:\n if (!isNumeralChar(inputValue.charAt(selectionStart - 1))) {\n event.preventDefault();\n }\n break;\n\n //right\n case 39:\n if (!isNumeralChar(inputValue.charAt(selectionStart))) {\n event.preventDefault();\n }\n break;\n\n //enter and tab\n case 13:\n case 9:\n newValueStr = validateValue(parseValue(inputValue));\n inputRef.current.value = formatValue(newValueStr);\n inputRef.current.setAttribute('aria-valuenow', newValueStr);\n updateModel(event, newValueStr);\n break;\n\n //backspace\n case 8:\n event.preventDefault();\n if (selectionStart === selectionEnd) {\n var deleteChar = inputValue.charAt(selectionStart - 1);\n var _getDecimalCharIndexe = getDecimalCharIndexes(inputValue),\n decimalCharIndex = _getDecimalCharIndexe.decimalCharIndex,\n decimalCharIndexWithoutPrefix = _getDecimalCharIndexe.decimalCharIndexWithoutPrefix;\n if (isNumeralChar(deleteChar)) {\n var decimalLength = getDecimalLength(inputValue);\n if (_group.current.test(deleteChar)) {\n _group.current.lastIndex = 0;\n newValueStr = inputValue.slice(0, selectionStart - 2) + inputValue.slice(selectionStart - 1);\n } else if (_decimal.current.test(deleteChar)) {\n _decimal.current.lastIndex = 0;\n if (decimalLength) {\n inputRef.current.setSelectionRange(selectionStart - 1, selectionStart - 1);\n } else {\n newValueStr = inputValue.slice(0, selectionStart - 1) + inputValue.slice(selectionStart);\n }\n } else if (decimalCharIndex > 0 && selectionStart > decimalCharIndex) {\n var insertedText = isDecimalMode() && (props.minFractionDigits || 0) < decimalLength ? '' : '0';\n newValueStr = inputValue.slice(0, selectionStart - 1) + insertedText + inputValue.slice(selectionStart);\n } else if (decimalCharIndexWithoutPrefix === 1) {\n newValueStr = inputValue.slice(0, selectionStart - 1) + '0' + inputValue.slice(selectionStart);\n newValueStr = parseValue(newValueStr) > 0 ? newValueStr : '';\n } else {\n newValueStr = inputValue.slice(0, selectionStart - 1) + inputValue.slice(selectionStart);\n }\n }\n updateValue(event, newValueStr, null, 'delete-single');\n } else {\n newValueStr = deleteRange(inputValue, selectionStart, selectionEnd);\n updateValue(event, newValueStr, null, 'delete-range');\n }\n break;\n\n // del\n case 46:\n event.preventDefault();\n if (selectionStart === selectionEnd) {\n var _deleteChar = inputValue.charAt(selectionStart);\n var _getDecimalCharIndexe2 = getDecimalCharIndexes(inputValue),\n _decimalCharIndex = _getDecimalCharIndexe2.decimalCharIndex,\n _decimalCharIndexWithoutPrefix = _getDecimalCharIndexe2.decimalCharIndexWithoutPrefix;\n if (isNumeralChar(_deleteChar)) {\n var _decimalLength = getDecimalLength(inputValue);\n if (_group.current.test(_deleteChar)) {\n _group.current.lastIndex = 0;\n newValueStr = inputValue.slice(0, selectionStart) + inputValue.slice(selectionStart + 2);\n } else if (_decimal.current.test(_deleteChar)) {\n _decimal.current.lastIndex = 0;\n if (_decimalLength) {\n inputRef.current.setSelectionRange(selectionStart + 1, selectionStart + 1);\n } else {\n newValueStr = inputValue.slice(0, selectionStart) + inputValue.slice(selectionStart + 1);\n }\n } else if (_decimalCharIndex > 0 && selectionStart > _decimalCharIndex) {\n var _insertedText = isDecimalMode() && (props.minFractionDigits || 0) < _decimalLength ? '' : '0';\n newValueStr = inputValue.slice(0, selectionStart) + _insertedText + inputValue.slice(selectionStart + 1);\n } else if (_decimalCharIndexWithoutPrefix === 1) {\n newValueStr = inputValue.slice(0, selectionStart) + '0' + inputValue.slice(selectionStart + 1);\n newValueStr = parseValue(newValueStr) > 0 ? newValueStr : '';\n } else {\n newValueStr = inputValue.slice(0, selectionStart) + inputValue.slice(selectionStart + 1);\n }\n }\n updateValue(event, newValueStr, null, 'delete-back-single');\n } else {\n newValueStr = deleteRange(inputValue, selectionStart, selectionEnd);\n updateValue(event, newValueStr, null, 'delete-range');\n }\n break;\n }\n if (props.onKeyDown) {\n props.onKeyDown(event);\n }\n };\n var onInputKeyPress = function onInputKeyPress(event) {\n if (props.disabled || props.readOnly) {\n return;\n }\n var code = event.which || event.keyCode;\n if (code !== 13) {\n // to submit a form\n event.preventDefault();\n }\n var _char = String.fromCharCode(code);\n var _isDecimalSign = isDecimalSign(_char);\n var _isMinusSign = isMinusSign(_char);\n if (48 <= code && code <= 57 || _isMinusSign || _isDecimalSign) {\n insert(event, _char, {\n isDecimalSign: _isDecimalSign,\n isMinusSign: _isMinusSign\n });\n }\n };\n var onPaste = function onPaste(event) {\n event.preventDefault();\n if (props.disabled || props.readOnly) {\n return;\n }\n var data = (event.clipboardData || window['clipboardData']).getData('Text');\n if (data) {\n var filteredData = parseValue(data);\n if (filteredData != null) {\n insert(event, filteredData.toString());\n }\n }\n };\n var allowMinusSign = function allowMinusSign() {\n return props.min === null || props.min < 0;\n };\n var isMinusSign = function isMinusSign(_char2) {\n if (_minusSign.current.test(_char2) || _char2 === '-') {\n _minusSign.current.lastIndex = 0;\n return true;\n }\n return false;\n };\n var isDecimalSign = function isDecimalSign(_char3) {\n if (_decimal.current.test(_char3)) {\n _decimal.current.lastIndex = 0;\n return true;\n }\n return false;\n };\n var isDecimalMode = function isDecimalMode() {\n return props.mode === 'decimal';\n };\n var getDecimalCharIndexes = function getDecimalCharIndexes(val) {\n var decimalCharIndex = val.search(_decimal.current);\n _decimal.current.lastIndex = 0;\n var filteredVal = val.replace(_prefix.current, '').trim().replace(/\\s/g, '').replace(_currency.current, '');\n var decimalCharIndexWithoutPrefix = filteredVal.search(_decimal.current);\n _decimal.current.lastIndex = 0;\n return {\n decimalCharIndex: decimalCharIndex,\n decimalCharIndexWithoutPrefix: decimalCharIndexWithoutPrefix\n };\n };\n var getCharIndexes = function getCharIndexes(val) {\n var decimalCharIndex = val.search(_decimal.current);\n _decimal.current.lastIndex = 0;\n var minusCharIndex = val.search(_minusSign.current);\n _minusSign.current.lastIndex = 0;\n var suffixCharIndex = val.search(_suffix.current);\n _suffix.current.lastIndex = 0;\n var currencyCharIndex = val.search(_currency.current);\n _currency.current.lastIndex = 0;\n return {\n decimalCharIndex: decimalCharIndex,\n minusCharIndex: minusCharIndex,\n suffixCharIndex: suffixCharIndex,\n currencyCharIndex: currencyCharIndex\n };\n };\n var insert = function insert(event, text) {\n var sign = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {\n isDecimalSign: false,\n isMinusSign: false\n };\n var minusCharIndexOnText = text.search(_minusSign.current);\n _minusSign.current.lastIndex = 0;\n if (!allowMinusSign() && minusCharIndexOnText !== -1) {\n return;\n }\n var selectionStart = inputRef.current.selectionStart;\n var selectionEnd = inputRef.current.selectionEnd;\n var inputValue = inputRef.current.value.trim();\n var _getCharIndexes = getCharIndexes(inputValue),\n decimalCharIndex = _getCharIndexes.decimalCharIndex,\n minusCharIndex = _getCharIndexes.minusCharIndex,\n suffixCharIndex = _getCharIndexes.suffixCharIndex,\n currencyCharIndex = _getCharIndexes.currencyCharIndex;\n var newValueStr;\n if (sign.isMinusSign) {\n if (selectionStart === 0) {\n newValueStr = inputValue;\n if (minusCharIndex === -1 || selectionEnd !== 0) {\n newValueStr = insertText(inputValue, text, 0, selectionEnd);\n }\n updateValue(event, newValueStr, text, 'insert');\n }\n } else if (sign.isDecimalSign) {\n if (decimalCharIndex > 0 && selectionStart === decimalCharIndex) {\n updateValue(event, inputValue, text, 'insert');\n } else if (decimalCharIndex > selectionStart && decimalCharIndex < selectionEnd) {\n newValueStr = insertText(inputValue, text, selectionStart, selectionEnd);\n updateValue(event, newValueStr, text, 'insert');\n } else if (decimalCharIndex === -1 && props.maxFractionDigits) {\n newValueStr = insertText(inputValue, text, selectionStart, selectionEnd);\n updateValue(event, newValueStr, text, 'insert');\n }\n } else {\n var maxFractionDigits = numberFormat.current.resolvedOptions().maximumFractionDigits;\n var operation = selectionStart !== selectionEnd ? 'range-insert' : 'insert';\n if (decimalCharIndex > 0 && selectionStart > decimalCharIndex) {\n if (selectionStart + text.length - (decimalCharIndex + 1) <= maxFractionDigits) {\n var charIndex = currencyCharIndex >= selectionStart ? currencyCharIndex - 1 : suffixCharIndex >= selectionStart ? suffixCharIndex : inputValue.length;\n newValueStr = inputValue.slice(0, selectionStart) + text + inputValue.slice(selectionStart + text.length, charIndex) + inputValue.slice(charIndex);\n updateValue(event, newValueStr, text, operation);\n }\n } else {\n newValueStr = insertText(inputValue, text, selectionStart, selectionEnd);\n updateValue(event, newValueStr, text, operation);\n }\n }\n };\n var insertText = function insertText(value, text, start, end) {\n var textSplit = text === '.' ? text : text.split('.');\n if (textSplit.length === 2) {\n var decimalCharIndex = value.slice(start, end).search(_decimal.current);\n _decimal.current.lastIndex = 0;\n return decimalCharIndex > 0 ? value.slice(0, start) + formatValue(text) + value.slice(end) : value || formatValue(text);\n } else if (end - start === value.length) {\n return formatValue(text);\n } else if (start === 0) {\n var suffix = ObjectUtils.isLetter(value[end]) ? end - 1 : end;\n return text + value.slice(suffix);\n } else if (end === value.length) {\n return value.slice(0, start) + text;\n } else {\n return value.slice(0, start) + text + value.slice(end);\n }\n };\n var deleteRange = function deleteRange(value, start, end) {\n var newValueStr;\n 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);\n return newValueStr;\n };\n var initCursor = function initCursor() {\n var selectionStart = inputRef.current.selectionStart;\n var inputValue = inputRef.current.value;\n var valueLength = inputValue.length;\n var index = null;\n\n // remove prefix\n var prefixLength = (prefixChar.current || '').length;\n inputValue = inputValue.replace(_prefix.current, '');\n selectionStart = selectionStart - prefixLength;\n var _char4 = inputValue.charAt(selectionStart);\n if (isNumeralChar(_char4)) {\n return selectionStart + prefixLength;\n }\n\n //left\n var i = selectionStart - 1;\n while (i >= 0) {\n _char4 = inputValue.charAt(i);\n if (isNumeralChar(_char4)) {\n index = i + prefixLength;\n break;\n } else {\n i--;\n }\n }\n if (index !== null) {\n inputRef.current.setSelectionRange(index + 1, index + 1);\n } else {\n i = selectionStart;\n while (i < valueLength) {\n _char4 = inputValue.charAt(i);\n if (isNumeralChar(_char4)) {\n index = i + prefixLength;\n break;\n } else {\n i++;\n }\n }\n if (index !== null) {\n inputRef.current.setSelectionRange(index, index);\n }\n }\n return index || 0;\n };\n var onInputClick = function onInputClick() {\n initCursor();\n };\n var isNumeralChar = function isNumeralChar(_char5) {\n if (_char5.length === 1 && (_numeral.current.test(_char5) || _decimal.current.test(_char5) || _group.current.test(_char5) || _minusSign.current.test(_char5))) {\n resetRegex();\n return true;\n } else {\n return false;\n }\n };\n var resetRegex = function resetRegex() {\n _numeral.current.lastIndex = 0;\n _decimal.current.lastIndex = 0;\n _group.current.lastIndex = 0;\n _minusSign.current.lastIndex = 0;\n };\n var updateValue = function updateValue(event, valueStr, insertedValueStr, operation) {\n var currentValue = inputRef.current.value;\n var newValue = null;\n if (valueStr != null) {\n newValue = evaluateEmpty(parseValue(valueStr));\n updateInput(newValue, insertedValueStr, operation, valueStr);\n handleOnChange(event, currentValue, newValue);\n }\n };\n var evaluateEmpty = function evaluateEmpty(newValue) {\n return !newValue && !props.allowEmpty ? props.min || 0 : newValue;\n };\n var handleOnChange = function handleOnChange(event, currentValue, newValue) {\n if (props.onChange && isValueChanged(currentValue, newValue)) {\n props.onChange({\n originalEvent: event,\n value: newValue\n });\n }\n };\n var isValueChanged = function isValueChanged(currentValue, newValue) {\n if (newValue === null && currentValue !== null) {\n return true;\n }\n if (newValue != null) {\n var parsedCurrentValue = typeof currentValue === 'string' ? parseValue(currentValue) : currentValue;\n return newValue !== parsedCurrentValue;\n }\n return false;\n };\n var validateValue = function validateValue(value) {\n if (value === '-') {\n return null;\n }\n return validateValueByLimit(value);\n };\n var validateValueByLimit = function validateValueByLimit(value) {\n if (ObjectUtils.isEmpty(value)) {\n return null;\n }\n if (props.min !== null && value < props.min) {\n return props.min;\n }\n if (props.max !== null && value > props.max) {\n return props.max;\n }\n return value;\n };\n var updateInput = function updateInput(value, insertedValueStr, operation, valueStr) {\n insertedValueStr = insertedValueStr || '';\n var inputEl = inputRef.current;\n var inputValue = inputEl.value;\n var newValue = formatValue(value);\n var currentLength = inputValue.length;\n if (newValue !== valueStr) {\n newValue = concatValues(newValue, valueStr);\n }\n if (currentLength === 0) {\n inputEl.value = newValue;\n inputEl.setSelectionRange(0, 0);\n var index = initCursor();\n var selectionEnd = index + insertedValueStr.length;\n inputEl.setSelectionRange(selectionEnd, selectionEnd);\n } else {\n var selectionStart = inputEl.selectionStart;\n var _selectionEnd = inputEl.selectionEnd;\n if (props.maxLength && props.maxLength < newValue.length) {\n return;\n }\n inputEl.value = newValue;\n var newLength = newValue.length;\n if (operation === 'range-insert') {\n var startValue = parseValue((inputValue || '').slice(0, selectionStart));\n var startValueStr = startValue !== null ? startValue.toString() : '';\n var startExpr = startValueStr.split('').join(\"(\".concat(groupChar.current, \")?\"));\n var sRegex = new RegExp(startExpr, 'g');\n sRegex.test(newValue);\n var tExpr = insertedValueStr.split('').join(\"(\".concat(groupChar.current, \")?\"));\n var tRegex = new RegExp(tExpr, 'g');\n tRegex.test(newValue.slice(sRegex.lastIndex));\n _selectionEnd = sRegex.lastIndex + tRegex.lastIndex;\n inputEl.setSelectionRange(_selectionEnd, _selectionEnd);\n } else if (newLength === currentLength) {\n 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);\n } else if (operation === 'delete-back-single') {\n var prevChar = inputValue.charAt(_selectionEnd - 1);\n var nextChar = inputValue.charAt(_selectionEnd);\n var diff = currentLength - newLength;\n var isGroupChar = _group.current.test(nextChar);\n if (isGroupChar && diff === 1) {\n _selectionEnd += 1;\n } else if (!isGroupChar && isNumeralChar(prevChar)) {\n _selectionEnd += -1 * diff + 1;\n }\n _group.current.lastIndex = 0;\n inputEl.setSelectionRange(_selectionEnd, _selectionEnd);\n } else if (inputValue === '-' && operation === 'insert') {\n inputEl.setSelectionRange(0, 0);\n var _index2 = initCursor();\n var _selectionEnd2 = _index2 + insertedValueStr.length + 1;\n inputEl.setSelectionRange(_selectionEnd2, _selectionEnd2);\n } else {\n _selectionEnd = _selectionEnd + (newLength - currentLength);\n inputEl.setSelectionRange(_selectionEnd, _selectionEnd);\n }\n }\n inputEl.setAttribute('aria-valuenow', value);\n };\n var updateInputValue = function updateInputValue(newValue) {\n newValue = evaluateEmpty(newValue);\n var inputEl = inputRef.current;\n var value = inputEl.value;\n var _formattedValue = formattedValue(newValue);\n if (value !== _formattedValue) {\n inputEl.value = _formattedValue;\n inputEl.setAttribute('aria-valuenow', newValue);\n }\n };\n var formattedValue = function formattedValue(val) {\n return formatValue(evaluateEmpty(val));\n };\n var concatValues = function concatValues(val1, val2) {\n if (val1 && val2) {\n var decimalCharIndex = val2.search(_decimal.current);\n _decimal.current.lastIndex = 0;\n return decimalCharIndex !== -1 ? val1.split(_decimal.current)[0] + val2.slice(decimalCharIndex) : val1;\n }\n return val1;\n };\n var getDecimalLength = function getDecimalLength(value) {\n if (value) {\n var valueSplit = value.split(_decimal.current);\n if (valueSplit.length === 2) {\n return valueSplit[1].replace(_suffix.current, '').trim().replace(/\\s/g, '').replace(_currency.current, '').length;\n }\n }\n return 0;\n };\n var updateModel = function updateModel(event, value) {\n if (props.onValueChange) {\n props.onValueChange({\n originalEvent: event,\n value: value,\n stopPropagation: function stopPropagation() {},\n preventDefault: function preventDefault() {},\n target: {\n name: props.name,\n id: props.id,\n value: value\n }\n });\n }\n };\n var onInputFocus = function onInputFocus(event) {\n setFocusedState(true);\n props.onFocus && props.onFocus(event);\n if ((props.suffix || props.currency || props.prefix) && inputRef.current) {\n // GitHub #1866 Cursor must be placed before/after symbol or arrow keys don't work\n var selectionEnd = initCursor();\n inputRef.current.setSelectionRange(selectionEnd, selectionEnd);\n }\n };\n var onInputBlur = function onInputBlur(event) {\n setFocusedState(false);\n if (inputRef.current) {\n var currentValue = inputRef.current.value;\n if (isValueChanged(currentValue, props.value)) {\n var newValue = validateValue(parseValue(currentValue));\n updateInputValue(newValue);\n updateModel(event, newValue);\n }\n }\n props.onBlur && props.onBlur(event);\n };\n var clearTimer = function clearTimer() {\n if (timer.current) {\n clearInterval(timer.current);\n }\n };\n var changeValue = function changeValue() {\n updateInputValue(validateValueByLimit(props.value));\n var newValue = validateValue(props.value);\n if (props.value !== null && props.value !== newValue) {\n updateModel(null, newValue);\n }\n };\n var getFormatter = function getFormatter() {\n return numberFormat.current;\n };\n React.useImperativeHandle(ref, function () {\n return {\n props: props,\n getFormatter: getFormatter,\n getElement: function getElement() {\n return elementRef.current;\n },\n getInput: function getInput() {\n return inputRef.current;\n }\n };\n });\n React.useEffect(function () {\n ObjectUtils.combinedRefs(inputRef, props.inputRef);\n }, [inputRef, props.inputRef]);\n useMountEffect(function () {\n constructParser();\n var newValue = validateValue(props.value);\n if (props.value !== null && props.value !== newValue) {\n updateModel(null, newValue);\n }\n });\n useUpdateEffect(function () {\n constructParser();\n changeValue();\n }, [props.locale, props.localeMatcher, props.mode, props.currency, props.currencyDisplay, props.useGrouping, props.minFractionDigits, props.maxFractionDigits, props.suffix, props.prefix]);\n useUpdateEffect(function () {\n changeValue();\n }, [props.value]);\n var createInputElement = function createInputElement() {\n var className = classNames('p-inputnumber-input', props.inputClassName);\n var valueToRender = formattedValue(props.value);\n return /*#__PURE__*/React.createElement(InputText, _extends({\n ref: inputRef,\n id: props.inputId,\n style: props.inputStyle,\n role: \"spinbutton\",\n className: className,\n defaultValue: valueToRender,\n type: props.type,\n size: props.size,\n tabIndex: props.tabIndex,\n inputMode: inputMode,\n maxLength: props.maxLength,\n disabled: props.disabled,\n required: props.required,\n pattern: props.pattern,\n placeholder: props.placeholder,\n readOnly: props.readOnly,\n name: props.name,\n autoFocus: props.autoFocus,\n onKeyDown: onInputKeyDown,\n onKeyPress: onInputKeyPress,\n onInput: onInput,\n onClick: onInputClick,\n onBlur: onInputBlur,\n onFocus: onInputFocus,\n onPaste: onPaste,\n min: props.min,\n max: props.max,\n \"aria-valuemin\": props.min,\n \"aria-valuemax\": props.max,\n \"aria-valuenow\": props.value\n }, ariaProps, dataProps));\n };\n var createUpButton = function createUpButton() {\n var className = classNames('p-inputnumber-button p-inputnumber-button-up p-button p-button-icon-only p-component', {\n 'p-disabled': props.disabled\n }, props.incrementButtonClassName);\n var icon = classNames('p-button-icon', props.incrementButtonIcon);\n return /*#__PURE__*/React.createElement(\"button\", {\n type: \"button\",\n className: className,\n onMouseLeave: onUpButtonMouseLeave,\n onMouseDown: onUpButtonMouseDown,\n onMouseUp: onUpButtonMouseUp,\n onKeyDown: onUpButtonKeyDown,\n onKeyUp: onUpButtonKeyUp,\n onTouchStart: onUpButtonTouchStart,\n onTouchEnd: onUpButtonTouchEnd,\n disabled: props.disabled,\n tabIndex: -1\n }, /*#__PURE__*/React.createElement(\"span\", {\n className: icon\n }), /*#__PURE__*/React.createElement(Ripple, null));\n };\n var createDownButton = function createDownButton() {\n var className = classNames('p-inputnumber-button p-inputnumber-button-down p-button p-button-icon-only p-component', {\n 'p-disabled': props.disabled\n }, props.decrementButtonClassName);\n var icon = classNames('p-button-icon', props.decrementButtonIcon);\n return /*#__PURE__*/React.createElement(\"button\", {\n type: \"button\",\n className: className,\n onMouseLeave: onDownButtonMouseLeave,\n onMouseDown: onDownButtonMouseDown,\n onMouseUp: onDownButtonMouseUp,\n onKeyDown: onDownButtonKeyDown,\n onKeyUp: onDownButtonKeyUp,\n onTouchStart: onDownButtonTouchStart,\n onTouchEnd: onDownButtonTouchEnd,\n disabled: props.disabled,\n tabIndex: -1\n }, /*#__PURE__*/React.createElement(\"span\", {\n className: icon\n }), /*#__PURE__*/React.createElement(Ripple, null));\n };\n var createButtonGroup = function createButtonGroup() {\n var upButton = props.showButtons && createUpButton();\n var downButton = props.showButtons && createDownButton();\n if (stacked) {\n return /*#__PURE__*/React.createElement(\"span\", {\n className: \"p-inputnumber-button-group\"\n }, upButton, downButton);\n }\n return /*#__PURE__*/React.createElement(React.Fragment, null, upButton, downButton);\n };\n var hasTooltip = ObjectUtils.isNotEmpty(props.tooltip);\n var otherProps = ObjectUtils.findDiffKeys(props, InputNumber.defaultProps);\n var dataProps = ObjectUtils.reduceKeys(otherProps, DomHandler.DATA_PROPS);\n var ariaProps = ObjectUtils.reduceKeys(otherProps, DomHandler.ARIA_PROPS);\n var className = classNames('p-inputnumber p-component p-inputwrapper', {\n 'p-inputwrapper-filled': props.value != null && props.value.toString().length > 0,\n 'p-inputwrapper-focus': focusedState,\n 'p-inputnumber-buttons-stacked': stacked,\n 'p-inputnumber-buttons-horizontal': horizontal,\n 'p-inputnumber-buttons-vertical': vertical\n }, props.className);\n var inputElement = createInputElement();\n var buttonGroup = createButtonGroup();\n return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(\"span\", _extends({\n ref: elementRef,\n id: props.id,\n className: className,\n style: props.style\n }, otherProps), inputElement, buttonGroup), hasTooltip && /*#__PURE__*/React.createElement(Tooltip, _extends({\n target: elementRef,\n content: props.tooltip\n }, props.tooltipOptions)));\n}));\nInputNumber.displayName = 'InputNumber';\nInputNumber.defaultProps = {\n __TYPE: 'InputNumber',\n allowEmpty: true,\n ariaLabelledBy: null,\n autoFocus: false,\n buttonLayout: 'stacked',\n className: null,\n currency: undefined,\n currencyDisplay: undefined,\n decrementButtonClassName: null,\n decrementButtonIcon: 'pi pi-angle-down',\n disabled: false,\n format: true,\n id: null,\n incrementButtonClassName: null,\n incrementButtonIcon: 'pi pi-angle-up',\n inputClassName: null,\n inputId: null,\n inputMode: null,\n inputRef: null,\n inputStyle: null,\n locale: undefined,\n localeMatcher: undefined,\n max: null,\n maxFractionDigits: undefined,\n maxLength: null,\n min: null,\n minFractionDigits: undefined,\n mode: 'decimal',\n name: null,\n onBlur: null,\n onChange: null,\n onFocus: null,\n onKeyDown: null,\n onValueChange: null,\n pattern: null,\n placeholder: null,\n prefix: null,\n readOnly: false,\n required: false,\n showButtons: false,\n size: null,\n step: 1,\n style: null,\n suffix: null,\n tabIndex: null,\n tooltip: null,\n tooltipOptions: null,\n type: 'text',\n useGrouping: true,\n value: null\n};\n\nexport { InputNumber };\n","import * as React from 'react';\nimport { useUpdateEffect } from 'primereact/hooks';\nimport { ObjectUtils, classNames } from 'primereact/utils';\nimport { ariaLabel, localeOption } from 'primereact/api';\nimport { Ripple } from 'primereact/ripple';\nimport { InputNumber } from 'primereact/inputnumber';\nimport { Dropdown } from 'primereact/dropdown';\n\nfunction _extends() {\n _extends = Object.assign ? Object.assign.bind() : function (target) {\n for (var i = 1; i < arguments.length; i++) {\n var source = arguments[i];\n for (var key in source) {\n if (Object.prototype.hasOwnProperty.call(source, key)) {\n target[key] = source[key];\n }\n }\n }\n return target;\n };\n return _extends.apply(this, arguments);\n}\n\nfunction _arrayWithHoles(arr) {\n if (Array.isArray(arr)) return arr;\n}\n\nfunction _iterableToArrayLimit(arr, i) {\n var _i = null == arr ? null : \"undefined\" != typeof Symbol && arr[Symbol.iterator] || arr[\"@@iterator\"];\n if (null != _i) {\n var _s,\n _e,\n _x,\n _r,\n _arr = [],\n _n = !0,\n _d = !1;\n try {\n if (_x = (_i = _i.call(arr)).next, 0 === i) {\n if (Object(_i) !== _i) return;\n _n = !1;\n } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0) {\n ;\n }\n } catch (err) {\n _d = !0, _e = err;\n } finally {\n try {\n if (!_n && null != _i[\"return\"] && (_r = _i[\"return\"](), Object(_r) !== _r)) return;\n } finally {\n if (_d) throw _e;\n }\n }\n return _arr;\n }\n}\n\nfunction _arrayLikeToArray(arr, len) {\n if (len == null || len > arr.length) len = arr.length;\n for (var i = 0, arr2 = new Array(len); i < len; i++) {\n arr2[i] = arr[i];\n }\n return arr2;\n}\n\nfunction _unsupportedIterableToArray(o, minLen) {\n if (!o) return;\n if (typeof o === \"string\") return _arrayLikeToArray(o, minLen);\n var n = Object.prototype.toString.call(o).slice(8, -1);\n if (n === \"Object\" && o.constructor) n = o.constructor.name;\n if (n === \"Map\" || n === \"Set\") return Array.from(o);\n if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);\n}\n\nfunction _nonIterableRest() {\n throw new TypeError(\"Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\");\n}\n\nfunction _slicedToArray(arr, i) {\n return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();\n}\n\nfunction _typeof(obj) {\n \"@babel/helpers - typeof\";\n\n return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (obj) {\n return typeof obj;\n } : function (obj) {\n return obj && \"function\" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj;\n }, _typeof(obj);\n}\n\nfunction _toPrimitive(input, hint) {\n if (_typeof(input) !== \"object\" || input === null) return input;\n var prim = input[Symbol.toPrimitive];\n if (prim !== undefined) {\n var res = prim.call(input, hint || \"default\");\n if (_typeof(res) !== \"object\") return res;\n throw new TypeError(\"@@toPrimitive must return a primitive value.\");\n }\n return (hint === \"string\" ? String : Number)(input);\n}\n\nfunction _toPropertyKey(arg) {\n var key = _toPrimitive(arg, \"string\");\n return _typeof(key) === \"symbol\" ? key : String(key);\n}\n\nfunction _defineProperty(obj, key, value) {\n key = _toPropertyKey(key);\n if (key in obj) {\n Object.defineProperty(obj, key, {\n value: value,\n enumerable: true,\n configurable: true,\n writable: true\n });\n } else {\n obj[key] = value;\n }\n return obj;\n}\n\nfunction 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; }\nfunction _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; }\nvar CurrentPageReport = /*#__PURE__*/React.memo(function (props) {\n var report = {\n currentPage: props.page + 1,\n totalPages: props.pageCount,\n first: Math.min(props.first + 1, props.totalRecords),\n last: Math.min(props.first + props.rows, props.totalRecords),\n rows: props.rows,\n totalRecords: props.totalRecords\n };\n 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);\n var element = /*#__PURE__*/React.createElement(\"span\", {\n className: \"p-paginator-current\"\n }, text);\n if (props.template) {\n var defaultOptions = _objectSpread(_objectSpread({}, report), {\n className: 'p-paginator-current',\n element: element,\n props: props\n });\n return ObjectUtils.getJSXElement(props.template, defaultOptions);\n }\n return element;\n});\nCurrentPageReport.displayName = 'CurrentPageReport';\nCurrentPageReport.defaultProps = {\n __TYPE: 'CurrentPageReport',\n pageCount: null,\n page: null,\n first: null,\n rows: null,\n totalRecords: null,\n reportTemplate: '({currentPage} of {totalPages})',\n template: null\n};\n\nvar FirstPageLink = /*#__PURE__*/React.memo(function (props) {\n var className = classNames('p-paginator-first p-paginator-element p-link', {\n 'p-disabled': props.disabled\n });\n var iconClassName = 'p-paginator-icon pi pi-angle-double-left';\n var element = /*#__PURE__*/React.createElement(\"button\", {\n type: \"button\",\n className: className,\n onClick: props.onClick,\n disabled: props.disabled,\n \"aria-label\": ariaLabel('firstPageLabel')\n }, /*#__PURE__*/React.createElement(\"span\", {\n className: iconClassName\n }), /*#__PURE__*/React.createElement(Ripple, null));\n if (props.template) {\n var defaultOptions = {\n onClick: props.onClick,\n className: className,\n iconClassName: iconClassName,\n disabled: props.disabled,\n element: element,\n props: props\n };\n return ObjectUtils.getJSXElement(props.template, defaultOptions);\n }\n return element;\n});\nFirstPageLink.displayName = 'FirstPageLink';\nFirstPageLink.defaultProps = {\n __TYPE: 'FirstPageLink',\n disabled: false,\n onClick: null,\n template: null\n};\n\nvar JumpToPageInput = /*#__PURE__*/React.memo(function (props) {\n var onChange = function onChange(event) {\n if (props.onChange) {\n props.onChange(props.rows * (event.value - 1), props.rows);\n }\n };\n var value = props.pageCount > 0 ? props.page + 1 : 0;\n var element = /*#__PURE__*/React.createElement(InputNumber, {\n value: value,\n onChange: onChange,\n className: \"p-paginator-page-input\",\n disabled: props.disabled\n });\n if (props.template) {\n var defaultOptions = {\n value: value,\n onChange: onChange,\n disabled: props.disabled,\n className: 'p-paginator-page-input',\n element: element,\n props: props\n };\n return ObjectUtils.getJSXElement(props.template, defaultOptions);\n }\n return element;\n});\nJumpToPageInput.displayName = 'JumpToPageInput';\nJumpToPageInput.defaultProps = {\n __TYPE: 'JumbToPageInput',\n page: null,\n rows: null,\n pageCount: null,\n disabled: false,\n template: null,\n onChange: null\n};\n\nvar LastPageLink = /*#__PURE__*/React.memo(function (props) {\n var className = classNames('p-paginator-last p-paginator-element p-link', {\n 'p-disabled': props.disabled\n });\n var iconClassName = 'p-paginator-icon pi pi-angle-double-right';\n var element = /*#__PURE__*/React.createElement(\"button\", {\n type: \"button\",\n className: className,\n onClick: props.onClick,\n disabled: props.disabled,\n \"aria-label\": ariaLabel('lastPageLabel')\n }, /*#__PURE__*/React.createElement(\"span\", {\n className: iconClassName\n }), /*#__PURE__*/React.createElement(Ripple, null));\n if (props.template) {\n var defaultOptions = {\n onClick: props.onClick,\n className: className,\n iconClassName: iconClassName,\n disabled: props.disabled,\n element: element,\n props: props\n };\n return ObjectUtils.getJSXElement(props.template, defaultOptions);\n }\n return element;\n});\nLastPageLink.displayName = 'LastPageLink';\nLastPageLink.defaultProps = {\n __TYPE: 'LastPageLink',\n disabled: false,\n onClick: null,\n template: null\n};\n\nvar NextPageLink = /*#__PURE__*/React.memo(function (props) {\n var className = classNames('p-paginator-next p-paginator-element p-link', {\n 'p-disabled': props.disabled\n });\n var iconClassName = 'p-paginator-icon pi pi-angle-right';\n var element = /*#__PURE__*/React.createElement(\"button\", {\n type: \"button\",\n className: className,\n onClick: props.onClick,\n disabled: props.disabled,\n \"aria-label\": ariaLabel('nextPageLabel')\n }, /*#__PURE__*/React.createElement(\"span\", {\n className: iconClassName\n }), /*#__PURE__*/React.createElement(Ripple, null));\n if (props.template) {\n var defaultOptions = {\n onClick: props.onClick,\n className: className,\n iconClassName: iconClassName,\n disabled: props.disabled,\n element: element,\n props: props\n };\n return ObjectUtils.getJSXElement(props.template, defaultOptions);\n }\n return element;\n});\nNextPageLink.displayName = 'NextPageLink';\nNextPageLink.defaultProps = {\n __TYPE: 'NextPageLink',\n disabled: false,\n onClick: null,\n template: null\n};\n\nvar PageLinks = /*#__PURE__*/React.memo(function (props) {\n var onPageLinkClick = function onPageLinkClick(event, pageLink) {\n if (props.onClick) {\n props.onClick({\n originalEvent: event,\n value: pageLink\n });\n }\n event.preventDefault();\n };\n var elements;\n if (props.value) {\n var startPageInView = props.value[0];\n var endPageInView = props.value[props.value.length - 1];\n elements = props.value.map(function (pageLink) {\n var className = classNames('p-paginator-page p-paginator-element p-link', {\n 'p-paginator-page-start': pageLink === startPageInView,\n 'p-paginator-page-end': pageLink === endPageInView,\n 'p-highlight': pageLink - 1 === props.page\n });\n var element = /*#__PURE__*/React.createElement(\"button\", {\n type: \"button\",\n className: className,\n onClick: function onClick(e) {\n return onPageLinkClick(e, pageLink);\n },\n \"aria-label\": \"\".concat(ariaLabel('pageLabel'), \" \").concat(pageLink + 1)\n }, pageLink, /*#__PURE__*/React.createElement(Ripple, null));\n if (props.template) {\n var defaultOptions = {\n onClick: function onClick(e) {\n return onPageLinkClick(e, pageLink);\n },\n className: className,\n view: {\n startPage: startPageInView - 1,\n endPage: endPageInView - 1\n },\n page: pageLink - 1,\n currentPage: props.page,\n totalPages: props.pageCount,\n element: element,\n props: props\n };\n element = ObjectUtils.getJSXElement(props.template, defaultOptions);\n }\n return /*#__PURE__*/React.createElement(React.Fragment, {\n key: pageLink\n }, element);\n });\n }\n return /*#__PURE__*/React.createElement(\"span\", {\n className: \"p-paginator-pages\"\n }, elements);\n});\nPageLinks.displayName = 'PageLinks';\nPageLinks.defaultProps = {\n __TYPE: 'PageLinks',\n value: null,\n page: null,\n rows: null,\n pageCount: null,\n links: null,\n template: null\n};\n\nvar PrevPageLink = /*#__PURE__*/React.memo(function (props) {\n var className = classNames('p-paginator-prev p-paginator-element p-link', {\n 'p-disabled': props.disabled\n });\n var iconClassName = 'p-paginator-icon pi pi-angle-left';\n var element = /*#__PURE__*/React.createElement(\"button\", {\n type: \"button\",\n className: className,\n onClick: props.onClick,\n disabled: props.disabled,\n \"aria-label\": ariaLabel('previousPageLabel')\n }, /*#__PURE__*/React.createElement(\"span\", {\n className: iconClassName\n }), /*#__PURE__*/React.createElement(Ripple, null));\n if (props.template) {\n var defaultOptions = {\n onClick: props.onClick,\n className: className,\n iconClassName: iconClassName,\n disabled: props.disabled,\n element: element,\n props: props\n };\n return ObjectUtils.getJSXElement(props.template, defaultOptions);\n }\n return element;\n});\nPrevPageLink.displayName = 'PrevPageLink';\nPrevPageLink.defaultProps = {\n __TYPE: 'PrevPageLink',\n disabled: false,\n onClick: null,\n template: null\n};\n\nvar RowsPerPageDropdown = /*#__PURE__*/React.memo(function (props) {\n var hasOptions = props.options && props.options.length > 0;\n var options = hasOptions ? props.options.map(function (opt) {\n return {\n label: String(opt),\n value: opt\n };\n }) : [];\n var ariaLabel = localeOption('choose');\n var element = hasOptions ? /*#__PURE__*/React.createElement(Dropdown, {\n value: props.value,\n options: options,\n onChange: props.onChange,\n appendTo: props.appendTo,\n disabled: props.disabled,\n placeholder: ariaLabel,\n \"aria-label\": ariaLabel\n }) : null;\n if (props.template) {\n var defaultOptions = {\n value: props.value,\n options: options,\n onChange: props.onChange,\n appendTo: props.appendTo,\n currentPage: props.page,\n totalPages: props.pageCount,\n totalRecords: props.totalRecords,\n disabled: props.disabled,\n element: element,\n props: props\n };\n return ObjectUtils.getJSXElement(props.template, defaultOptions);\n }\n return element;\n});\nRowsPerPageDropdown.displayName = 'RowsPerPageDropdown';\nRowsPerPageDropdown.defaultProps = {\n __TYPE: 'RowsPerPageDropdown',\n options: null,\n value: null,\n page: null,\n pageCount: null,\n totalRecords: 0,\n appendTo: null,\n onChange: null,\n template: null,\n disabled: false\n};\n\nvar Paginator = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (props, ref) {\n var elementRef = React.useRef(null);\n var rppChanged = React.useRef(false);\n var page = Math.floor(props.first / props.rows);\n var pageCount = Math.ceil(props.totalRecords / props.rows);\n var isFirstPage = page === 0;\n var isLastPage = page === pageCount - 1;\n var isEmpty = pageCount === 0;\n var calculatePageLinkBoundaries = function calculatePageLinkBoundaries() {\n var numberOfPages = pageCount;\n var visiblePages = Math.min(props.pageLinkSize, numberOfPages);\n\n //calculate range, keep current in middle if necessary\n var start = Math.max(0, Math.ceil(page - visiblePages / 2));\n var end = Math.min(numberOfPages - 1, start + visiblePages - 1);\n\n //check when approaching to last page\n var delta = props.pageLinkSize - (end - start + 1);\n start = Math.max(0, start - delta);\n return [start, end];\n };\n var updatePageLinks = function updatePageLinks() {\n var pageLinks = [];\n var boundaries = calculatePageLinkBoundaries();\n var start = boundaries[0];\n var end = boundaries[1];\n for (var i = start; i <= end; i++) {\n pageLinks.push(i + 1);\n }\n return pageLinks;\n };\n var changePage = function changePage(first, rows) {\n var pc = pageCount;\n var p = Math.floor(first / rows);\n if (p >= 0 && p < pc) {\n var newPageState = {\n first: first,\n rows: rows,\n page: p,\n pageCount: pc\n };\n if (props.onPageChange) {\n props.onPageChange(newPageState);\n }\n }\n };\n var changePageToFirst = function changePageToFirst(event) {\n changePage(0, props.rows);\n event.preventDefault();\n };\n var changePageToPrev = function changePageToPrev(event) {\n changePage(props.first - props.rows, props.rows);\n event.preventDefault();\n };\n var onPageLinkClick = function onPageLinkClick(event) {\n changePage((event.value - 1) * props.rows, props.rows);\n };\n var changePageToNext = function changePageToNext(event) {\n changePage(props.first + props.rows, props.rows);\n event.preventDefault();\n };\n var changePageToLast = function changePageToLast(event) {\n changePage((pageCount - 1) * props.rows, props.rows);\n event.preventDefault();\n };\n var onRowsChange = function onRowsChange(event) {\n var rows = event.value;\n rppChanged.current = rows !== props.rows;\n changePage(0, rows);\n };\n React.useImperativeHandle(ref, function () {\n return {\n props: props,\n getElement: function getElement() {\n return elementRef.current;\n }\n };\n });\n useUpdateEffect(function () {\n if (!rppChanged.current) {\n changePage(props.first, props.rows);\n }\n rppChanged.current = false;\n }, [props.rows]);\n useUpdateEffect(function () {\n if (page > 0 && props.first >= props.totalRecords) {\n changePage((pageCount - 1) * props.rows, props.rows);\n }\n }, [props.totalRecords]);\n var createElement = function createElement(key, template) {\n var element;\n switch (key) {\n case 'FirstPageLink':\n element = /*#__PURE__*/React.createElement(FirstPageLink, {\n key: key,\n onClick: changePageToFirst,\n disabled: isFirstPage || isEmpty,\n template: template\n });\n break;\n case 'PrevPageLink':\n element = /*#__PURE__*/React.createElement(PrevPageLink, {\n key: key,\n onClick: changePageToPrev,\n disabled: isFirstPage || isEmpty,\n template: template\n });\n break;\n case 'NextPageLink':\n element = /*#__PURE__*/React.createElement(NextPageLink, {\n key: key,\n onClick: changePageToNext,\n disabled: isLastPage || isEmpty,\n template: template\n });\n break;\n case 'LastPageLink':\n element = /*#__PURE__*/React.createElement(LastPageLink, {\n key: key,\n onClick: changePageToLast,\n disabled: isLastPage || isEmpty,\n template: template\n });\n break;\n case 'PageLinks':\n element = /*#__PURE__*/React.createElement(PageLinks, {\n key: key,\n value: updatePageLinks(),\n page: page,\n rows: props.rows,\n pageCount: pageCount,\n onClick: onPageLinkClick,\n template: template\n });\n break;\n case 'RowsPerPageDropdown':\n element = /*#__PURE__*/React.createElement(RowsPerPageDropdown, {\n key: key,\n value: props.rows,\n page: page,\n pageCount: pageCount,\n totalRecords: props.totalRecords,\n options: props.rowsPerPageOptions,\n onChange: onRowsChange,\n appendTo: props.dropdownAppendTo,\n template: template,\n disabled: isEmpty\n });\n break;\n case 'CurrentPageReport':\n element = /*#__PURE__*/React.createElement(CurrentPageReport, {\n reportTemplate: props.currentPageReportTemplate,\n key: key,\n page: page,\n pageCount: pageCount,\n first: props.first,\n rows: props.rows,\n totalRecords: props.totalRecords,\n template: template\n });\n break;\n case 'JumpToPageInput':\n element = /*#__PURE__*/React.createElement(JumpToPageInput, {\n key: key,\n rows: props.rows,\n page: page,\n pageCount: pageCount,\n onChange: changePage,\n disabled: isEmpty,\n template: template\n });\n break;\n default:\n element = null;\n break;\n }\n return element;\n };\n var createElements = function createElements() {\n var template = props.template;\n if (template) {\n if (_typeof(template) === 'object') {\n return template.layout ? template.layout.split(' ').map(function (value) {\n var key = value.trim();\n return createElement(key, template[key]);\n }) : Object.entries(template).map(function (_ref) {\n var _ref2 = _slicedToArray(_ref, 2),\n key = _ref2[0],\n _template = _ref2[1];\n return createElement(key, _template);\n });\n }\n return template.split(' ').map(function (value) {\n return createElement(value.trim());\n });\n }\n return null;\n };\n if (!props.alwaysShow && pageCount === 1) {\n return null;\n } else {\n var otherProps = ObjectUtils.findDiffKeys(props, Paginator.defaultProps);\n var className = classNames('p-paginator p-component', props.className);\n var leftContent = ObjectUtils.getJSXElement(props.leftContent, props);\n var rightContent = ObjectUtils.getJSXElement(props.rightContent, props);\n var elements = createElements();\n var leftElement = leftContent && /*#__PURE__*/React.createElement(\"div\", {\n className: \"p-paginator-left-content\"\n }, leftContent);\n var rightElement = rightContent && /*#__PURE__*/React.createElement(\"div\", {\n className: \"p-paginator-right-content\"\n }, rightContent);\n return /*#__PURE__*/React.createElement(\"div\", _extends({\n ref: elementRef,\n className: className,\n style: props.style\n }, otherProps), leftElement, elements, rightElement);\n }\n}));\nPaginator.displayName = 'Paginator';\nPaginator.defaultProps = {\n __TYPE: 'Paginator',\n totalRecords: 0,\n rows: 0,\n first: 0,\n pageLinkSize: 5,\n rowsPerPageOptions: null,\n alwaysShow: true,\n style: null,\n className: null,\n template: 'FirstPageLink PrevPageLink PageLinks NextPageLink LastPageLink RowsPerPageDropdown',\n onPageChange: null,\n leftContent: null,\n rightContent: null,\n dropdownAppendTo: null,\n currentPageReportTemplate: '({currentPage} of {totalPages})'\n};\n\nexport { Paginator };\n","import * as React from 'react';\nimport PrimeReact, { ariaLabel, localeOption, FilterMatchMode, FilterOperator, FilterService } from 'primereact/api';\nimport { useEventListener, useUpdateEffect, useUnmountEffect, usePrevious, useMountEffect, useOverlayListener } from 'primereact/hooks';\nimport { Paginator } from 'primereact/paginator';\nimport { classNames, DomHandler, ObjectUtils, ZIndexUtils, UniqueComponentId } from 'primereact/utils';\nimport { VirtualScroller } from 'primereact/virtualscroller';\nimport { OverlayService } from 'primereact/overlayservice';\nimport { Ripple } from 'primereact/ripple';\nimport { Button } from 'primereact/button';\nimport { CSSTransition } from 'primereact/csstransition';\nimport { Dropdown } from 'primereact/dropdown';\nimport { InputText } from 'primereact/inputtext';\nimport { Portal } from 'primereact/portal';\nimport { Tooltip } from 'primereact/tooltip';\n\nfunction _extends() {\n _extends = Object.assign ? Object.assign.bind() : function (target) {\n for (var i = 1; i < arguments.length; i++) {\n var source = arguments[i];\n for (var key in source) {\n if (Object.prototype.hasOwnProperty.call(source, key)) {\n target[key] = source[key];\n }\n }\n }\n return target;\n };\n return _extends.apply(this, arguments);\n}\n\nfunction _typeof(obj) {\n \"@babel/helpers - typeof\";\n\n return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (obj) {\n return typeof obj;\n } : function (obj) {\n return obj && \"function\" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj;\n }, _typeof(obj);\n}\n\nfunction _toPrimitive(input, hint) {\n if (_typeof(input) !== \"object\" || input === null) return input;\n var prim = input[Symbol.toPrimitive];\n if (prim !== undefined) {\n var res = prim.call(input, hint || \"default\");\n if (_typeof(res) !== \"object\") return res;\n throw new TypeError(\"@@toPrimitive must return a primitive value.\");\n }\n return (hint === \"string\" ? String : Number)(input);\n}\n\nfunction _toPropertyKey(arg) {\n var key = _toPrimitive(arg, \"string\");\n return _typeof(key) === \"symbol\" ? key : String(key);\n}\n\nfunction _defineProperty(obj, key, value) {\n key = _toPropertyKey(key);\n if (key in obj) {\n Object.defineProperty(obj, key, {\n value: value,\n enumerable: true,\n configurable: true,\n writable: true\n });\n } else {\n obj[key] = value;\n }\n return obj;\n}\n\nfunction _arrayLikeToArray(arr, len) {\n if (len == null || len > arr.length) len = arr.length;\n for (var i = 0, arr2 = new Array(len); i < len; i++) {\n arr2[i] = arr[i];\n }\n return arr2;\n}\n\nfunction _arrayWithoutHoles(arr) {\n if (Array.isArray(arr)) return _arrayLikeToArray(arr);\n}\n\nfunction _iterableToArray(iter) {\n if (typeof Symbol !== \"undefined\" && iter[Symbol.iterator] != null || iter[\"@@iterator\"] != null) return Array.from(iter);\n}\n\nfunction _unsupportedIterableToArray(o, minLen) {\n if (!o) return;\n if (typeof o === \"string\") return _arrayLikeToArray(o, minLen);\n var n = Object.prototype.toString.call(o).slice(8, -1);\n if (n === \"Object\" && o.constructor) n = o.constructor.name;\n if (n === \"Map\" || n === \"Set\") return Array.from(o);\n if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);\n}\n\nfunction _nonIterableSpread() {\n throw new TypeError(\"Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\");\n}\n\nfunction _toConsumableArray(arr) {\n return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread();\n}\n\nfunction _arrayWithHoles(arr) {\n if (Array.isArray(arr)) return arr;\n}\n\nfunction _iterableToArrayLimit(arr, i) {\n var _i = null == arr ? null : \"undefined\" != typeof Symbol && arr[Symbol.iterator] || arr[\"@@iterator\"];\n if (null != _i) {\n var _s,\n _e,\n _x,\n _r,\n _arr = [],\n _n = !0,\n _d = !1;\n try {\n if (_x = (_i = _i.call(arr)).next, 0 === i) {\n if (Object(_i) !== _i) return;\n _n = !1;\n } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0) {\n ;\n }\n } catch (err) {\n _d = !0, _e = err;\n } finally {\n try {\n if (!_n && null != _i[\"return\"] && (_r = _i[\"return\"](), Object(_r) !== _r)) return;\n } finally {\n if (_d) throw _e;\n }\n }\n return _arr;\n }\n}\n\nfunction _nonIterableRest() {\n throw new TypeError(\"Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\");\n}\n\nfunction _slicedToArray(arr, i) {\n return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();\n}\n\nfunction _objectWithoutPropertiesLoose(source, excluded) {\n if (source == null) return {};\n var target = {};\n var sourceKeys = Object.keys(source);\n var key, i;\n for (i = 0; i < sourceKeys.length; i++) {\n key = sourceKeys[i];\n if (excluded.indexOf(key) >= 0) continue;\n target[key] = source[key];\n }\n return target;\n}\n\nfunction _objectWithoutProperties(source, excluded) {\n if (source == null) return {};\n var target = _objectWithoutPropertiesLoose(source, excluded);\n var key, i;\n if (Object.getOwnPropertySymbols) {\n var sourceSymbolKeys = Object.getOwnPropertySymbols(source);\n for (i = 0; i < sourceSymbolKeys.length; i++) {\n key = sourceSymbolKeys[i];\n if (excluded.indexOf(key) >= 0) continue;\n if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;\n target[key] = source[key];\n }\n }\n return target;\n}\n\nvar RowCheckbox = /*#__PURE__*/React.memo(function (props) {\n var _React$useState = React.useState(false),\n _React$useState2 = _slicedToArray(_React$useState, 2),\n focusedState = _React$useState2[0],\n setFocusedState = _React$useState2[1];\n var onFocus = function onFocus() {\n setFocusedState(true);\n };\n var onBlur = function onBlur() {\n setFocusedState(false);\n };\n var onClick = function onClick(event) {\n if (!props.disabled) {\n setFocusedState(true);\n props.onChange(event);\n }\n };\n var onKeyDown = function onKeyDown(event) {\n if (event.code === 'Space') {\n onClick(event);\n event.preventDefault();\n }\n };\n var className = classNames('p-checkbox p-component', {\n 'p-checkbox-focused': focusedState\n });\n var boxClassName = classNames('p-checkbox-box p-component', {\n 'p-highlight': props.checked,\n 'p-disabled': props.disabled,\n 'p-focus': focusedState\n });\n var iconClassName = classNames('p-checkbox-icon', {\n 'pi pi-check': props.checked\n });\n var tabIndex = props.disabled ? null : '0';\n return /*#__PURE__*/React.createElement(\"div\", {\n className: className,\n onClick: onClick\n }, /*#__PURE__*/React.createElement(\"div\", {\n className: boxClassName,\n role: \"checkbox\",\n \"aria-checked\": props.checked,\n tabIndex: tabIndex,\n onKeyDown: onKeyDown,\n onFocus: onFocus,\n onBlur: onBlur,\n \"aria-label\": props.ariaLabel\n }, /*#__PURE__*/React.createElement(\"span\", {\n className: iconClassName\n })));\n});\nRowCheckbox.displayName = 'RowCheckbox';\n\nvar RowRadioButton = /*#__PURE__*/React.memo(function (props) {\n var _React$useState = React.useState(false),\n _React$useState2 = _slicedToArray(_React$useState, 2),\n focusedState = _React$useState2[0],\n setFocusedState = _React$useState2[1];\n var inputRef = React.useRef(null);\n var onFocus = function onFocus() {\n setFocusedState(true);\n };\n var onBlur = function onBlur() {\n setFocusedState(false);\n };\n var onClick = function onClick(event) {\n if (!props.disabled) {\n props.onChange(event);\n DomHandler.focus(inputRef.current);\n }\n };\n var onKeyDown = function onKeyDown(event) {\n if (event.code === 'Space') {\n onClick(event);\n event.preventDefault();\n }\n };\n var onChange = function onChange(event) {\n onClick(event);\n };\n var className = classNames('p-radiobutton p-component', {\n 'p-radiobutton-focused': focusedState\n });\n var boxClassName = classNames('p-radiobutton-box p-component', {\n 'p-highlight': props.checked,\n 'p-focus': focusedState,\n 'p-disabled': props.disabled\n });\n var name = \"\".concat(props.tableSelector, \"_dt_radio\");\n return /*#__PURE__*/React.createElement(\"div\", {\n className: className\n }, /*#__PURE__*/React.createElement(\"div\", {\n className: \"p-hidden-accessible\"\n }, /*#__PURE__*/React.createElement(\"input\", {\n name: name,\n ref: inputRef,\n type: \"radio\",\n checked: props.checked,\n onFocus: onFocus,\n onBlur: onBlur,\n onChange: onChange,\n onKeyDown: onKeyDown,\n \"aria-label\": props.ariaLabel\n })), /*#__PURE__*/React.createElement(\"div\", {\n className: boxClassName,\n onClick: onClick,\n role: \"radio\",\n \"aria-checked\": props.checked\n }, /*#__PURE__*/React.createElement(\"div\", {\n className: \"p-radiobutton-icon\"\n })));\n});\nRowRadioButton.displayName = 'RowRadioButton';\n\nfunction 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; }\nfunction _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; }\nvar BodyCell = /*#__PURE__*/React.memo(function (props) {\n var _React$useState = React.useState(props.editing),\n _React$useState2 = _slicedToArray(_React$useState, 2),\n editingState = _React$useState2[0],\n setEditingState = _React$useState2[1];\n var _React$useState3 = React.useState(props.rowData),\n _React$useState4 = _slicedToArray(_React$useState3, 2),\n editingRowDataState = _React$useState4[0],\n setEditingRowDataState = _React$useState4[1];\n var _React$useState5 = React.useState({}),\n _React$useState6 = _slicedToArray(_React$useState5, 2),\n styleObjectState = _React$useState6[0],\n setStyleObjectState = _React$useState6[1];\n var elementRef = React.useRef(null);\n var keyHelperRef = React.useRef(null);\n var overlayEventListener = React.useRef(null);\n var selfClick = React.useRef(false);\n var tabindexTimeout = React.useRef(null);\n var initFocusTimeout = React.useRef(null);\n var getColumnProp = function getColumnProp(prop) {\n return props.column ? props.column.props[prop] : null;\n };\n var field = getColumnProp('field') || \"field_\".concat(props.index);\n var editingKey = props.dataKey ? props.rowData[props.dataKey] || props.rowIndex : props.rowIndex;\n var _useEventListener = useEventListener({\n type: 'click',\n listener: function listener(e) {\n if (!selfClick.current && isOutsideClicked(e.target)) {\n switchCellToViewMode(e, true);\n }\n selfClick.current = false;\n },\n options: true\n }),\n _useEventListener2 = _slicedToArray(_useEventListener, 2),\n bindDocumentClickListener = _useEventListener2[0],\n unbindDocumentClickListener = _useEventListener2[1];\n if (props.editMode === 'row' && props.editing !== editingState) {\n setEditingState(props.editing);\n }\n var isEditable = function isEditable() {\n return getColumnProp('editor');\n };\n var isSelected = function isSelected() {\n return props.selection ? props.selection instanceof Array ? findIndex(props.selection) > -1 : equals(props.selection) : false;\n };\n var equalsData = function equalsData(data) {\n return props.compareSelectionBy === 'equals' ? data === props.rowData : ObjectUtils.equals(data, props.rowData, props.dataKey);\n };\n var equals = function equals(selectedCell) {\n return (selectedCell.rowIndex === props.rowIndex || equalsData(selectedCell.rowData)) && (selectedCell.field === field || selectedCell.cellIndex === props.index);\n };\n var isOutsideClicked = function isOutsideClicked(target) {\n return elementRef.current && !(elementRef.current.isSameNode(target) || elementRef.current.contains(target));\n };\n var getVirtualScrollerOption = function getVirtualScrollerOption(option) {\n return props.virtualScrollerOptions ? props.virtualScrollerOptions[option] : null;\n };\n var getStyle = function getStyle() {\n var bodyStyle = getColumnProp('bodyStyle');\n var columnStyle = getColumnProp('style');\n return getColumnProp('frozen') ? Object.assign({}, columnStyle, bodyStyle, styleObjectState) : Object.assign({}, columnStyle, bodyStyle);\n };\n var getCellParams = function getCellParams() {\n return {\n value: resolveFieldData(),\n field: field,\n rowData: props.rowData,\n rowIndex: props.rowIndex,\n cellIndex: props.index,\n selected: isSelected(),\n column: props.column,\n props: props\n };\n };\n var getCellCallbackParams = function getCellCallbackParams(event) {\n var params = getCellParams();\n return _objectSpread$7({\n originalEvent: event\n }, params);\n };\n var resolveFieldData = function resolveFieldData(data) {\n return ObjectUtils.resolveFieldData(data || props.rowData, field);\n };\n var getEditingRowData = function getEditingRowData() {\n return props.editingMeta && props.editingMeta[editingKey] ? props.editingMeta[editingKey].data : props.rowData;\n };\n var getTabIndex = function getTabIndex(cellSelected) {\n return props.allowCellSelection ? cellSelected ? 0 : props.rowIndex === 0 && props.index === 0 ? props.tabIndex : -1 : null;\n };\n var findIndex = function findIndex(collection) {\n return (collection || []).findIndex(function (data) {\n return equals(data);\n });\n };\n var closeCell = function closeCell(event) {\n var params = getCellCallbackParams(event);\n var onBeforeCellEditHide = getColumnProp('onBeforeCellEditHide');\n if (onBeforeCellEditHide) {\n onBeforeCellEditHide(params);\n }\n\n /* When using the 'tab' key, the focus event of the next cell is not called in IE. */\n setTimeout(function () {\n setEditingState(false);\n unbindDocumentClickListener();\n OverlayService.off('overlay-click', overlayEventListener.current);\n overlayEventListener.current = null;\n selfClick.current = false;\n }, 1);\n };\n var switchCellToViewMode = function switchCellToViewMode(event, submit) {\n var callbackParams = getCellCallbackParams(event);\n var newRowData = editingRowDataState;\n var newValue = resolveFieldData(newRowData);\n var params = _objectSpread$7(_objectSpread$7({}, callbackParams), {}, {\n newRowData: newRowData,\n newValue: newValue\n });\n var onCellEditCancel = getColumnProp('onCellEditCancel');\n var cellEditValidator = getColumnProp('cellEditValidator');\n var onCellEditComplete = getColumnProp('onCellEditComplete');\n if (!submit && onCellEditCancel) {\n onCellEditCancel(params);\n }\n var valid = true;\n if (cellEditValidator) {\n valid = cellEditValidator(params);\n }\n if (valid) {\n if (submit && onCellEditComplete) {\n onCellEditComplete(params);\n }\n closeCell(event);\n } else {\n event.preventDefault();\n }\n };\n var findNextSelectableCell = function findNextSelectableCell(cell) {\n var nextCell = cell.nextElementSibling;\n return nextCell ? DomHandler.hasClass(nextCell, 'p-selectable-cell') ? nextCell : findNextSelectableCell(nextCell) : null;\n };\n var findPrevSelectableCell = function findPrevSelectableCell(cell) {\n var prevCell = cell.previousElementSibling;\n return prevCell ? DomHandler.hasClass(prevCell, 'p-selectable-cell') ? prevCell : findPrevSelectableCell(prevCell) : null;\n };\n var findDownSelectableCell = function findDownSelectableCell(cell) {\n var downRow = cell.parentElement.nextElementSibling;\n var downCell = downRow ? downRow.children[props.index] : null;\n return downRow && downCell ? DomHandler.hasClass(downRow, 'p-selectable-row') && DomHandler.hasClass(downCell, 'p-selectable-cell') ? downCell : findDownSelectableCell(downCell) : null;\n };\n var findUpSelectableCell = function findUpSelectableCell(cell) {\n var upRow = cell.parentElement.previousElementSibling;\n var upCell = upRow ? upRow.children[props.index] : null;\n return upRow && upCell ? DomHandler.hasClass(upRow, 'p-selectable-row') && DomHandler.hasClass(upCell, 'p-selectable-cell') ? upCell : findUpSelectableCell(upCell) : null;\n };\n var changeTabIndex = function changeTabIndex(currentCell, nextCell) {\n if (currentCell && nextCell) {\n currentCell.tabIndex = -1;\n nextCell.tabIndex = props.tabIndex;\n }\n };\n var focusOnElement = function focusOnElement() {\n clearTimeout(tabindexTimeout.current);\n tabindexTimeout.current = setTimeout(function () {\n if (editingState) {\n var focusableEl = props.editMode === 'cell' ? DomHandler.getFirstFocusableElement(elementRef.current, ':not(.p-cell-editor-key-helper)') : DomHandler.findSingle(elementRef.current, '.p-row-editor-save');\n focusableEl && focusableEl.focus();\n }\n keyHelperRef.current && (keyHelperRef.current.tabIndex = editingState ? -1 : 0);\n }, 1);\n };\n var focusOnInit = function focusOnInit() {\n clearTimeout(initFocusTimeout.current);\n initFocusTimeout.current = setTimeout(function () {\n var focusableEl = props.editMode === 'row' ? DomHandler.findSingle(elementRef.current, '.p-row-editor-init') : null;\n focusableEl && focusableEl.focus();\n }, 1);\n };\n var updateStickyPosition = function updateStickyPosition() {\n if (getColumnProp('frozen')) {\n var styleObject = _objectSpread$7({}, styleObjectState);\n var align = getColumnProp('alignFrozen');\n if (align === 'right') {\n var right = 0;\n var next = elementRef.current.nextElementSibling;\n if (next) {\n right = DomHandler.getOuterWidth(next) + parseFloat(next.style.right || 0);\n }\n styleObject['right'] = right + 'px';\n } else {\n var left = 0;\n var prev = elementRef.current.previousElementSibling;\n if (prev) {\n left = DomHandler.getOuterWidth(prev) + parseFloat(prev.style.left || 0);\n }\n styleObject['left'] = left + 'px';\n }\n var isSameStyle = styleObjectState['left'] === styleObject['left'] && styleObjectState['right'] === styleObject['right'];\n !isSameStyle && setStyleObjectState(styleObject);\n }\n };\n var editorCallback = function editorCallback(val) {\n var editingRowData = _objectSpread$7({}, editingRowDataState);\n editingRowData[field] = val;\n setEditingRowDataState(editingRowData);\n\n // update editing meta for complete methods on row mode\n props.editingMeta[editingKey].data[field] = val;\n };\n var onClick = function onClick(event) {\n var params = getCellCallbackParams(event);\n if (props.editMode !== 'row' && isEditable() && !editingState && (props.selectOnEdit || !props.selectOnEdit && props.selected)) {\n selfClick.current = true;\n var onBeforeCellEditShow = getColumnProp('onBeforeCellEditShow');\n var onCellEditInit = getColumnProp('onCellEditInit');\n var cellEditValidatorEvent = getColumnProp('cellEditValidatorEvent');\n if (onBeforeCellEditShow) {\n onBeforeCellEditShow(params);\n }\n\n // 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.\n setTimeout(function () {\n setEditingState(true);\n if (onCellEditInit) {\n onCellEditInit(params);\n }\n if (cellEditValidatorEvent === 'click') {\n bindDocumentClickListener();\n overlayEventListener.current = function (e) {\n if (!isOutsideClicked(e.target)) {\n selfClick.current = true;\n }\n };\n OverlayService.on('overlay-click', overlayEventListener.current);\n }\n }, 1);\n }\n if (props.allowCellSelection && props.onClick) {\n props.onClick(params);\n }\n };\n var onMouseDown = function onMouseDown(event) {\n var params = getCellCallbackParams(event);\n props.onMouseDown && props.onMouseDown(params);\n };\n var onMouseUp = function onMouseUp(event) {\n var params = getCellCallbackParams(event);\n props.onMouseUp && props.onMouseUp(params);\n };\n var onKeyDown = function onKeyDown(event) {\n if (props.editMode !== 'row') {\n if (event.which === 13 || event.which === 9) {\n // tab || enter\n switchCellToViewMode(event, true);\n }\n if (event.which === 27) {\n // escape\n switchCellToViewMode(event, false);\n }\n }\n if (props.allowCellSelection) {\n var target = event.target,\n cell = event.currentTarget;\n switch (event.which) {\n //left arrow\n case 37:\n var prevCell = findPrevSelectableCell(cell);\n if (prevCell) {\n changeTabIndex(cell, prevCell);\n prevCell.focus();\n }\n event.preventDefault();\n break;\n\n //right arrow\n case 39:\n var nextCell = findNextSelectableCell(cell);\n if (nextCell) {\n changeTabIndex(cell, nextCell);\n nextCell.focus();\n }\n event.preventDefault();\n break;\n\n //up arrow\n case 38:\n var upCell = findUpSelectableCell(cell);\n if (upCell) {\n changeTabIndex(cell, upCell);\n upCell.focus();\n }\n event.preventDefault();\n break;\n\n //down arrow\n case 40:\n var downCell = findDownSelectableCell(cell);\n if (downCell) {\n changeTabIndex(cell, downCell);\n downCell.focus();\n }\n event.preventDefault();\n break;\n\n //enter\n case 13:\n // @deprecated\n if (!DomHandler.isClickable(target)) {\n onClick(event);\n event.preventDefault();\n }\n break;\n\n //space\n case 32:\n if (!DomHandler.isClickable(target) && !target.readOnly) {\n onClick(event);\n event.preventDefault();\n }\n break;\n }\n }\n };\n var onBlur = function onBlur(event) {\n selfClick.current = false;\n if (props.editMode !== 'row' && editingState && getColumnProp('cellEditValidatorEvent') === 'blur') {\n switchCellToViewMode(event, true);\n }\n };\n var onEditorFocus = function onEditorFocus(event) {\n onClick(event);\n };\n var onRadioChange = function onRadioChange(event) {\n props.onRadioChange({\n originalEvent: event,\n data: props.rowData,\n index: props.rowIndex\n });\n };\n var onCheckboxChange = function onCheckboxChange(event) {\n props.onCheckboxChange({\n originalEvent: event,\n data: props.rowData,\n index: props.rowIndex\n });\n };\n var onRowToggle = function onRowToggle(event) {\n props.onRowToggle({\n originalEvent: event,\n data: props.rowData\n });\n event.preventDefault();\n };\n var onRowEditInit = function onRowEditInit(event) {\n props.onRowEditInit({\n originalEvent: event,\n data: props.rowData,\n newData: getEditingRowData(),\n field: field,\n index: props.rowIndex\n });\n };\n var onRowEditSave = function onRowEditSave(event) {\n props.onRowEditSave({\n originalEvent: event,\n data: props.rowData,\n newData: getEditingRowData(),\n field: field,\n index: props.rowIndex\n });\n focusOnInit();\n };\n var onRowEditCancel = function onRowEditCancel(event) {\n props.onRowEditCancel({\n originalEvent: event,\n data: props.rowData,\n newData: getEditingRowData(),\n field: field,\n index: props.rowIndex\n });\n focusOnInit();\n };\n React.useEffect(function () {\n if (getColumnProp('frozen')) {\n updateStickyPosition();\n }\n if (props.editMode === 'cell' || props.editMode === 'row') {\n focusOnElement();\n }\n });\n useUpdateEffect(function () {\n if (props.editMode === 'cell' || props.editMode === 'row') {\n setEditingRowDataState(getEditingRowData());\n }\n }, [props.editingMeta]);\n React.useEffect(function () {\n if (props.editMode === 'cell' || props.editMode === 'row') {\n var callbackParams = getCellCallbackParams();\n var params = _objectSpread$7(_objectSpread$7({}, callbackParams), {}, {\n editing: editingState,\n editingKey: editingKey\n });\n props.onEditingMetaChange(params);\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [editingState]);\n useUnmountEffect(function () {\n if (overlayEventListener.current) {\n OverlayService.off('overlay-click', overlayEventListener.current);\n overlayEventListener.current = null;\n }\n });\n var createLoading = function createLoading() {\n var options = getVirtualScrollerOption('getLoaderOptions')(props.rowIndex, {\n cellIndex: props.index,\n cellFirst: props.index === 0,\n cellLast: props.index === getVirtualScrollerOption('columns').length - 1,\n cellEven: props.index % 2 === 0,\n cellOdd: props.index % 2 !== 0,\n column: props.column,\n field: field\n });\n var content = ObjectUtils.getJSXElement(getVirtualScrollerOption('loadingTemplate'), options);\n return /*#__PURE__*/React.createElement(\"td\", null, content);\n };\n var createElement = function createElement() {\n var content, editorKeyHelper;\n var cellSelected = props.allowCellSelection && isSelected();\n var isRowEditor = props.editMode === 'row';\n var tabIndex = getTabIndex(cellSelected);\n var selectionMode = getColumnProp('selectionMode');\n var rowReorder = getColumnProp('rowReorder');\n var rowEditor = getColumnProp('rowEditor');\n var header = getColumnProp('header');\n var body = getColumnProp('body');\n var editor = getColumnProp('editor');\n var frozen = getColumnProp('frozen');\n var align = getColumnProp('align');\n var value = resolveFieldData();\n var columnBodyOptions = {\n column: props.column,\n field: field,\n rowIndex: props.rowIndex,\n frozenRow: props.frozenRow,\n props: props.tableProps\n };\n var expander = ObjectUtils.getPropValue(getColumnProp('expander'), props.rowData, columnBodyOptions);\n var cellClassName = ObjectUtils.getPropValue(props.cellClassName, value, columnBodyOptions);\n var bodyClassName = ObjectUtils.getPropValue(getColumnProp('bodyClassName'), props.rowData, columnBodyOptions);\n var className = classNames(bodyClassName, getColumnProp('className'), cellClassName, _defineProperty({\n 'p-selection-column': selectionMode !== null,\n 'p-editable-column': editor,\n 'p-cell-editing': editor && editingState,\n 'p-frozen-column': frozen,\n 'p-selectable-cell': props.allowCellSelection && props.isSelectable({\n data: getCellParams(),\n index: props.rowIndex\n }),\n 'p-highlight': cellSelected\n }, \"p-align-\".concat(align), !!align));\n var style = getStyle();\n var title = props.responsiveLayout === 'stack' && /*#__PURE__*/React.createElement(\"span\", {\n className: \"p-column-title\"\n }, ObjectUtils.getJSXElement(header, {\n props: props.tableProps\n }));\n if (selectionMode) {\n var showSelection = props.showSelectionElement ? props.showSelectionElement(props.rowData, {\n rowIndex: props.rowIndex,\n props: props.tableProps\n }) : true;\n var label;\n if (showSelection) {\n var ariaLabelField = props.selectionAriaLabel || props.tableProps.dataKey;\n var ariaLabelText = ObjectUtils.resolveFieldData(props.rowData, ariaLabelField);\n label = \"\".concat(props.selected ? ariaLabel('unselectLabel') : ariaLabel('selectLabel'), \" \").concat(ariaLabelText);\n }\n content = showSelection && /*#__PURE__*/React.createElement(React.Fragment, null, selectionMode === 'single' && /*#__PURE__*/React.createElement(RowRadioButton, {\n checked: props.selected,\n onChange: onRadioChange,\n tabIndex: props.tabIndex,\n tableSelector: props.tableSelector,\n ariaLabel: label\n }), selectionMode === 'multiple' && /*#__PURE__*/React.createElement(RowCheckbox, {\n checked: props.selected,\n onChange: onCheckboxChange,\n tabIndex: props.tabIndex,\n ariaLabel: label\n }));\n } else if (rowReorder) {\n var showReorder = props.showRowReorderElement ? props.showRowReorderElement(props.rowData, {\n rowIndex: props.rowIndex,\n props: props.tableProps\n }) : true;\n content = showReorder && /*#__PURE__*/React.createElement(\"i\", {\n className: classNames('p-datatable-reorderablerow-handle', getColumnProp('rowReorderIcon'))\n });\n } else if (expander) {\n var iconClassName = classNames('p-row-toggler-icon', props.expanded ? props.expandedRowIcon : props.collapsedRowIcon);\n var ariaControls = \"\".concat(props.tableSelector, \"_content_\").concat(props.rowIndex, \"_expanded\");\n var _ariaLabelField = props.selectionAriaLabel || props.tableProps.dataKey;\n var _ariaLabelText = ObjectUtils.resolveFieldData(props.rowData, _ariaLabelField);\n var _label = \"\".concat(props.expanded ? ariaLabel('collapseLabel') : ariaLabel('expandLabel'), \" \").concat(_ariaLabelText);\n var expanderProps = {\n onClick: onRowToggle,\n className: 'p-row-toggler p-link',\n iconClassName: iconClassName\n };\n content = /*#__PURE__*/React.createElement(\"button\", {\n className: expanderProps.className,\n onClick: expanderProps.onClick,\n type: \"button\",\n \"aria-expanded\": props.expanded,\n \"aria-controls\": ariaControls,\n tabIndex: props.tabIndex,\n \"aria-label\": _label\n }, /*#__PURE__*/React.createElement(\"span\", {\n className: expanderProps.iconClassName,\n \"aria-hidden\": \"true\"\n }), /*#__PURE__*/React.createElement(Ripple, null));\n if (body) {\n expanderProps['element'] = content;\n content = ObjectUtils.getJSXElement(body, props.rowData, {\n column: props.column,\n field: field,\n rowIndex: props.rowIndex,\n frozenRow: props.frozenRow,\n props: props.tableProps,\n expander: expanderProps\n });\n }\n } else if (isRowEditor && rowEditor) {\n var rowEditorProps = {};\n if (editingState) {\n rowEditorProps = {\n editing: true,\n onSaveClick: onRowEditSave,\n saveClassName: 'p-row-editor-save p-link',\n saveIconClassName: 'p-row-editor-save-icon pi pi-fw pi-check',\n onCancelClick: onRowEditCancel,\n cancelClassName: 'p-row-editor-cancel p-link',\n cancelIconClassName: 'p-row-editor-cancel-icon pi pi-fw pi-times'\n };\n content = /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(\"button\", {\n type: \"button\",\n name: \"row-save\",\n onClick: rowEditorProps.onSaveClick,\n className: rowEditorProps.saveClassName,\n tabIndex: props.tabIndex\n }, /*#__PURE__*/React.createElement(\"span\", {\n className: rowEditorProps.saveIconClassName\n }), /*#__PURE__*/React.createElement(Ripple, null)), /*#__PURE__*/React.createElement(\"button\", {\n type: \"button\",\n name: \"row-cancel\",\n onClick: rowEditorProps.onCancelClick,\n className: rowEditorProps.cancelClassName,\n tabIndex: props.tabIndex\n }, /*#__PURE__*/React.createElement(\"span\", {\n className: rowEditorProps.cancelIconClassName\n }), /*#__PURE__*/React.createElement(Ripple, null)));\n } else {\n rowEditorProps = {\n editing: false,\n onInitClick: onRowEditInit,\n initClassName: 'p-row-editor-init p-link',\n initIconClassName: 'p-row-editor-init-icon pi pi-fw pi-pencil'\n };\n content = /*#__PURE__*/React.createElement(\"button\", {\n type: \"button\",\n name: \"row-edit\",\n onClick: rowEditorProps.onInitClick,\n className: rowEditorProps.initClassName,\n tabIndex: props.tabIndex\n }, /*#__PURE__*/React.createElement(\"span\", {\n className: rowEditorProps.initIconClassName\n }), /*#__PURE__*/React.createElement(Ripple, null));\n }\n if (body) {\n rowEditorProps['element'] = content;\n content = ObjectUtils.getJSXElement(body, props.rowData, {\n column: props.column,\n field: field,\n rowIndex: props.rowIndex,\n frozenRow: props.frozenRow,\n props: props.tableProps,\n rowEditor: rowEditorProps\n });\n }\n } else if (body && (!editingState || !editor)) {\n content = body ? ObjectUtils.getJSXElement(body, props.rowData, {\n column: props.column,\n field: field,\n rowIndex: props.rowIndex,\n frozenRow: props.frozenRow,\n props: props.tableProps\n }) : value;\n } else if (editor && editingState) {\n content = ObjectUtils.getJSXElement(editor, {\n rowData: editingRowDataState,\n value: resolveFieldData(editingRowDataState),\n column: props.column,\n field: field,\n rowIndex: props.rowIndex,\n frozenRow: props.frozenRow,\n props: props.tableProps,\n editorCallback: editorCallback\n });\n } else {\n content = value;\n }\n content = typeof content == 'boolean' ? content.toString() : content;\n if (!isRowEditor && editor) {\n /* eslint-disable */\n editorKeyHelper = /*#__PURE__*/React.createElement(\"a\", {\n tabIndex: \"0\",\n ref: keyHelperRef,\n className: \"p-cell-editor-key-helper p-hidden-accessible\",\n onFocus: onEditorFocus\n }, /*#__PURE__*/React.createElement(\"span\", null));\n /* eslint-enable */\n }\n\n return /*#__PURE__*/React.createElement(\"td\", {\n ref: elementRef,\n style: style,\n className: className,\n rowSpan: props.rowSpan,\n tabIndex: tabIndex,\n role: \"cell\",\n onClick: onClick,\n onKeyDown: onKeyDown,\n onBlur: onBlur,\n onMouseDown: onMouseDown,\n onMouseUp: onMouseUp\n }, editorKeyHelper, title, content);\n };\n return getVirtualScrollerOption('loading') ? createLoading() : createElement();\n});\nBodyCell.displayName = 'BodyCell';\n\nfunction 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; }\nfunction _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; }\nvar BodyRow = /*#__PURE__*/React.memo(function (props) {\n var _React$useState = React.useState(false),\n _React$useState2 = _slicedToArray(_React$useState, 2),\n editingState = _React$useState2[0],\n setEditingState = _React$useState2[1];\n var editing = props.onRowEditChange ? props.editing : editingState;\n var isFocusable = function isFocusable() {\n return props.selectionMode && props.selectionModeInColumn !== 'single' && props.selectionModeInColumn !== 'multiple';\n };\n var isGrouped = function isGrouped(column) {\n if (props.groupRowsBy && getColumnProp(column, 'field')) {\n return Array.isArray(props.groupRowsBy) ? props.groupRowsBy.indexOf(column.props.field) > -1 : props.groupRowsBy === column.props.field;\n }\n return false;\n };\n var equals = function equals(data1, data2) {\n return props.compareSelectionBy === 'equals' ? data1 === data2 : ObjectUtils.equals(data1, data2, props.dataKey);\n };\n var getColumnProp = function getColumnProp(col, prop) {\n return col ? col.props[prop] : null;\n };\n var getTabIndex = function getTabIndex() {\n return isFocusable() && !props.allowCellSelection ? props.index === 0 ? props.tabIndex : -1 : null;\n };\n var findIndex = function findIndex(collection, rowData) {\n return (collection || []).findIndex(function (data) {\n return equals(rowData, data);\n });\n };\n var changeTabIndex = function changeTabIndex(currentRow, nextRow) {\n if (currentRow && nextRow) {\n currentRow.tabIndex = -1;\n nextRow.tabIndex = props.tabIndex;\n }\n };\n var findNextSelectableRow = function findNextSelectableRow(row) {\n var nextRow = row.nextElementSibling;\n return nextRow ? DomHandler.hasClass(nextRow, 'p-selectable-row') ? nextRow : findNextSelectableRow(nextRow) : null;\n };\n var findPrevSelectableRow = function findPrevSelectableRow(row) {\n var prevRow = row.previousElementSibling;\n return prevRow ? DomHandler.hasClass(prevRow, 'p-selectable-row') ? prevRow : findPrevSelectableRow(prevRow) : null;\n };\n var shouldRenderBodyCell = function shouldRenderBodyCell(value, column, i) {\n if (getColumnProp(column, 'hidden')) {\n return false;\n } else if (props.rowGroupMode && props.rowGroupMode === 'rowspan' && isGrouped(column)) {\n var prevRowData = value[i - 1];\n if (prevRowData) {\n var currentRowFieldData = ObjectUtils.resolveFieldData(value[i], getColumnProp(column, 'field'));\n var previousRowFieldData = ObjectUtils.resolveFieldData(prevRowData, getColumnProp(column, 'field'));\n return currentRowFieldData !== previousRowFieldData;\n }\n }\n return true;\n };\n var calculateRowGroupSize = function calculateRowGroupSize(value, column, index) {\n if (isGrouped(column)) {\n var currentRowFieldData = ObjectUtils.resolveFieldData(value[index], getColumnProp(column, 'field'));\n var nextRowFieldData = currentRowFieldData;\n var groupRowSpan = 0;\n while (currentRowFieldData === nextRowFieldData) {\n groupRowSpan++;\n var nextRowData = value[++index];\n if (nextRowData) {\n nextRowFieldData = ObjectUtils.resolveFieldData(nextRowData, getColumnProp(column, 'field'));\n } else {\n break;\n }\n }\n return groupRowSpan === 1 ? null : groupRowSpan;\n } else {\n return null;\n }\n };\n var onClick = function onClick(event) {\n props.onRowClick({\n originalEvent: event,\n data: props.rowData,\n index: props.index\n });\n };\n var onDoubleClick = function onDoubleClick(event) {\n props.onRowDoubleClick({\n originalEvent: event,\n data: props.rowData,\n index: props.index\n });\n };\n var onRightClick = function onRightClick(event) {\n props.onRowRightClick({\n originalEvent: event,\n data: props.rowData,\n index: props.index\n });\n };\n var onMouseEnter = function onMouseEnter(event) {\n props.onRowMouseEnter({\n originalEvent: event,\n data: props.rowData,\n index: props.index\n });\n };\n var onMouseLeave = function onMouseLeave(event) {\n props.onRowMouseLeave({\n originalEvent: event,\n data: props.rowData,\n index: props.index\n });\n };\n var onTouchEnd = function onTouchEnd(event) {\n props.onRowTouchEnd(event);\n };\n var onKeyDown = function onKeyDown(event) {\n if (isFocusable() && !props.allowCellSelection) {\n var target = event.target,\n row = event.currentTarget;\n switch (event.which) {\n //down arrow\n case 40:\n var nextRow = findNextSelectableRow(row);\n if (nextRow) {\n changeTabIndex(row, nextRow);\n nextRow.focus();\n }\n event.preventDefault();\n break;\n\n //up arrow\n case 38:\n var prevRow = findPrevSelectableRow(row);\n if (prevRow) {\n changeTabIndex(row, prevRow);\n prevRow.focus();\n }\n event.preventDefault();\n break;\n\n //enter\n case 13:\n // @deprecated\n if (!DomHandler.isClickable(target)) {\n onClick(event);\n event.preventDefault();\n }\n break;\n\n //space\n case 32:\n if (!DomHandler.isClickable(target) && !target.readOnly) {\n onClick(event);\n event.preventDefault();\n }\n break;\n }\n }\n };\n var onMouseDown = function onMouseDown(event) {\n props.onRowMouseDown({\n originalEvent: event,\n data: props.rowData,\n index: props.index\n });\n };\n var onMouseUp = function onMouseUp(event) {\n props.onRowMouseUp({\n originalEvent: event,\n data: props.rowData,\n index: props.index\n });\n };\n var onDragStart = function onDragStart(event) {\n props.onRowDragStart({\n originalEvent: event,\n data: props.rowData,\n index: props.index\n });\n };\n var onDragOver = function onDragOver(event) {\n props.onRowDragOver({\n originalEvent: event,\n data: props.rowData,\n index: props.index\n });\n };\n var onDragLeave = function onDragLeave(event) {\n props.onRowDragLeave({\n originalEvent: event,\n data: props.rowData,\n index: props.index\n });\n };\n var onDragEnd = function onDragEnd(event) {\n props.onRowDragEnd({\n originalEvent: event,\n data: props.rowData,\n index: props.index\n });\n };\n var onDrop = function onDrop(event) {\n props.onRowDrop({\n originalEvent: event,\n data: props.rowData,\n index: props.index\n });\n };\n var onEditChange = function onEditChange(e, isEditing) {\n if (props.onRowEditChange) {\n var editingRows;\n var dataKey = props.dataKey;\n var originalEvent = e.originalEvent,\n data = e.data,\n index = e.index,\n newData = e.newData;\n if (dataKey) {\n var dataKeyValue = String(ObjectUtils.resolveFieldData(data, dataKey));\n editingRows = props.editingRows ? _objectSpread$6({}, props.editingRows) : {};\n if (!isEditing) {\n delete editingRows[dataKeyValue];\n // if the key value was changed, stop editing for the new key value too\n var newDataKeyValue = String(ObjectUtils.resolveFieldData(newData, dataKey));\n delete editingRows[newDataKeyValue];\n } else {\n editingRows[dataKeyValue] = true;\n }\n } else {\n var editingRowIndex = findIndex(props.editingRows, data);\n editingRows = props.editingRows ? _toConsumableArray(props.editingRows) : [];\n if (editingRowIndex !== -1) editingRows = editingRows.filter(function (val, i) {\n return i !== editingRowIndex;\n });else editingRows.push(data);\n }\n props.onRowEditChange({\n originalEvent: originalEvent,\n data: editingRows,\n index: index\n });\n } else {\n setEditingState(isEditing);\n }\n };\n var onEditInit = function onEditInit(e) {\n var event = e.originalEvent;\n if (props.onRowEditInit) {\n props.onRowEditInit({\n originalEvent: event,\n data: props.rowData,\n index: props.index\n });\n }\n onEditChange(e, true);\n event.preventDefault();\n };\n var onEditSave = function onEditSave(e) {\n var event = e.originalEvent,\n newData = e.newData;\n var valid = props.rowEditValidator ? props.rowEditValidator(newData, {\n props: props.tableProps\n }) : true;\n if (props.onRowEditSave) {\n props.onRowEditSave({\n originalEvent: event,\n data: props.rowData,\n index: props.index,\n valid: valid\n });\n }\n if (valid) {\n if (props.onRowEditComplete) {\n props.onRowEditComplete(e);\n }\n onEditChange(e, false);\n }\n event.preventDefault();\n };\n var onEditCancel = function onEditCancel(e) {\n var event = e.originalEvent;\n if (props.onRowEditCancel) {\n props.onRowEditCancel({\n originalEvent: event,\n data: props.rowData,\n index: props.index\n });\n }\n onEditChange(e, false);\n event.preventDefault();\n };\n var createContent = function createContent() {\n return props.columns.map(function (col, i) {\n if (shouldRenderBodyCell(props.value, col, props.index)) {\n var key = \"\".concat(getColumnProp(col, 'columnKey') || getColumnProp(col, 'field'), \"_\").concat(i);\n var rowSpan = props.rowGroupMode === 'rowspan' ? calculateRowGroupSize(props.value, col, props.index) : null;\n return /*#__PURE__*/React.createElement(BodyCell, {\n key: key,\n value: props.value,\n tableProps: props.tableProps,\n tableSelector: props.tableSelector,\n column: col,\n rowData: props.rowData,\n rowIndex: props.index,\n index: i,\n rowSpan: rowSpan,\n dataKey: props.dataKey,\n editing: editing,\n editingMeta: props.editingMeta,\n editMode: props.editMode,\n onRowEditInit: onEditInit,\n onRowEditSave: onEditSave,\n onRowEditCancel: onEditCancel,\n onEditingMetaChange: props.onEditingMetaChange,\n onRowToggle: props.onRowToggle,\n selection: props.selection,\n selectionAriaLabel: props.tableProps.selectionAriaLabel,\n allowCellSelection: props.allowCellSelection,\n compareSelectionBy: props.compareSelectionBy,\n selectOnEdit: props.selectOnEdit,\n selected: props.selected,\n onClick: props.onCellClick,\n onMouseDown: props.onCellMouseDown,\n onMouseUp: props.onCellMouseUp,\n tabIndex: props.tabIndex,\n cellClassName: props.cellClassName,\n responsiveLayout: props.responsiveLayout,\n frozenRow: props.frozenRow,\n isSelectable: props.isSelectable,\n showSelectionElement: props.showSelectionElement,\n showRowReorderElement: props.showRowReorderElement,\n onRadioChange: props.onRadioChange,\n onCheckboxChange: props.onCheckboxChange,\n expanded: props.expanded,\n expandedRowIcon: props.expandedRowIcon,\n collapsedRowIcon: props.collapsedRowIcon,\n virtualScrollerOptions: props.virtualScrollerOptions\n });\n }\n return null;\n });\n };\n var rowClassName = ObjectUtils.getPropValue(props.rowClassName, props.rowData, {\n props: props.tableProps\n });\n var className = classNames(rowClassName, {\n 'p-highlight': !props.allowCellSelection && props.selected || props.contextMenuSelected,\n 'p-highlight-contextmenu': props.contextMenuSelected,\n 'p-selectable-row': props.allowRowSelection && props.isSelectable({\n data: props.rowData,\n index: props.index\n }),\n 'p-row-odd': props.index % 2 !== 0\n });\n var style = {\n height: props.virtualScrollerOptions ? props.virtualScrollerOptions.itemSize : undefined\n };\n var content = createContent();\n var tabIndex = getTabIndex();\n return /*#__PURE__*/React.createElement(\"tr\", {\n role: \"row\",\n tabIndex: tabIndex,\n className: className,\n style: style,\n onMouseDown: onMouseDown,\n onMouseUp: onMouseUp,\n onMouseEnter: onMouseEnter,\n onMouseLeave: onMouseLeave,\n onClick: onClick,\n onDoubleClick: onDoubleClick,\n onContextMenu: onRightClick,\n onTouchEnd: onTouchEnd,\n onKeyDown: onKeyDown,\n onDragStart: onDragStart,\n onDragOver: onDragOver,\n onDragLeave: onDragLeave,\n onDragEnd: onDragEnd,\n onDrop: onDrop\n }, content);\n});\nBodyRow.displayName = 'BodyRow';\n\nvar RowTogglerButton = /*#__PURE__*/React.memo(function (props) {\n var onClick = function onClick(event) {\n props.onClick({\n originalEvent: event,\n data: props.rowData\n });\n };\n var iconClassName = classNames('p-row-toggler-icon', props.expanded ? props.expandedRowIcon : props.collapsedRowIcon);\n var label = props.expanded ? ariaLabel('collapseLabel') : ariaLabel('expandLabel');\n return /*#__PURE__*/React.createElement(\"button\", {\n type: \"button\",\n onClick: onClick,\n className: \"p-row-toggler p-link\",\n tabIndex: props.tabIndex,\n \"aria-label\": label\n }, /*#__PURE__*/React.createElement(\"span\", {\n className: iconClassName,\n \"aria-hidden\": \"true\"\n }), /*#__PURE__*/React.createElement(Ripple, null));\n});\nRowTogglerButton.displayName = 'RowTogglerButton';\n\nvar _excluded = [\"originalEvent\"];\nfunction 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; }\nfunction _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; }\nvar TableBody = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (props, ref) {\n var _React$useState = React.useState({}),\n _React$useState2 = _slicedToArray(_React$useState, 2),\n rowGroupHeaderStyleObjectState = _React$useState2[0],\n setRowGroupHeaderStyleObjectState = _React$useState2[1];\n var elementRef = React.useRef(null);\n var refCallback = React.useCallback(function (el) {\n elementRef.current = el;\n props.virtualScrollerContentRef && props.virtualScrollerContentRef(el);\n }, [props]);\n var dragSelectionHelper = React.useRef(null);\n var initialDragPosition = React.useRef(null);\n var anchorRowIndex = React.useRef(null);\n var anchorCellIndex = React.useRef(null);\n var rangeRowIndex = React.useRef(null);\n var anchorRowFirst = React.useRef(null);\n var rowTouched = React.useRef(false);\n var rowDragging = React.useRef(false);\n var draggedRowIndex = React.useRef(null);\n var droppedRowIndex = React.useRef(null);\n var prevVirtualScrollerOptions = usePrevious(props.virtualScrollerOptions);\n var isSubheaderGrouping = props.rowGroupMode && props.rowGroupMode === 'subheader';\n var isRadioSelectionMode = props.selectionMode === 'radiobutton';\n var isCheckboxSelectionMode = props.selectionMode === 'checkbox';\n var isRadioSelectionModeInColumn = props.selectionModeInColumn === 'single';\n var isCheckboxSelectionModeInColumn = props.selectionModeInColumn === 'multiple';\n var equals = function equals(data1, data2) {\n 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);\n };\n var isSelectionEnabled = function isSelectionEnabled() {\n return props.selectionMode || props.selectionModeInColumn !== null || props.columns && props.columns.some(function (col) {\n return col && !!col.props.selectionMode;\n });\n };\n var isSingleSelection = function isSingleSelection() {\n return props.selectionMode === 'single' && !isCheckboxSelectionModeInColumn || !isRadioSelectionMode && isRadioSelectionModeInColumn;\n };\n var isMultipleSelection = function isMultipleSelection() {\n return props.selectionMode === 'multiple' && !isRadioSelectionModeInColumn || isCheckboxSelectionModeInColumn;\n };\n var isRadioOnlySelection = function isRadioOnlySelection() {\n return isRadioSelectionMode && isRadioSelectionModeInColumn;\n };\n var isCheckboxOnlySelection = function isCheckboxOnlySelection() {\n return isCheckboxSelectionMode && isCheckboxSelectionModeInColumn;\n };\n var isSelected = function isSelected(rowData) {\n if (rowData && props.selection) {\n return props.selection instanceof Array ? findIndex(props.selection, rowData) > -1 : equals(rowData, props.selection);\n }\n return false;\n };\n var isContextMenuSelected = function isContextMenuSelected(rowData) {\n if (rowData && props.contextMenuSelection) {\n return equals(rowData, props.contextMenuSelection);\n }\n return false;\n };\n var isSelectable = function isSelectable(options) {\n return props.isDataSelectable ? props.isDataSelectable(options) : true;\n };\n var isRowExpanded = function isRowExpanded(rowData) {\n if (rowData && props.expandedRows) {\n if (isSubheaderGrouping && props.expandableRowGroups) {\n return isRowGroupExpanded(rowData);\n } else {\n if (props.dataKey) return props.expandedRows ? props.expandedRows[ObjectUtils.resolveFieldData(rowData, props.dataKey)] !== undefined : false;else return findIndex(props.expandedRows, rowData) !== -1;\n }\n }\n return false;\n };\n var isRowGroupExpanded = function isRowGroupExpanded(rowData) {\n if (props.dataKey === props.groupRowsBy) return Object.keys(props.expandedRows).some(function (data) {\n return ObjectUtils.equals(data, ObjectUtils.resolveFieldData(rowData, props.dataKey));\n });else return props.expandedRows.some(function (data) {\n return ObjectUtils.equals(data, rowData, props.groupRowsBy);\n });\n };\n var isRowEditing = function isRowEditing(rowData) {\n if (props.editMode === 'row' && rowData && props.editingRows) {\n if (props.dataKey) return props.editingRows ? props.editingRows[ObjectUtils.resolveFieldData(rowData, props.dataKey)] !== undefined : false;else return findIndex(props.editingRows, rowData) !== -1;\n }\n return false;\n };\n var allowDrag = function allowDrag(event) {\n return props.dragSelection && isMultipleSelection() && !event.originalEvent.shiftKey;\n };\n var allowRowDrag = function allowRowDrag(event) {\n return !allowCellSelection() && allowDrag(event) || props.reorderableRows;\n };\n var allowCellDrag = function allowCellDrag(event) {\n return allowCellSelection() && allowDrag(event);\n };\n var allowSelection = function allowSelection(event) {\n return !DomHandler.isClickable(event.originalEvent.target);\n };\n var allowMetaKeySelection = function allowMetaKeySelection(event) {\n return !rowTouched.current && (!props.metaKeySelection || props.metaKeySelection && (event.originalEvent.metaKey || event.originalEvent.ctrlKey));\n };\n var allowRangeSelection = function allowRangeSelection(event) {\n return isMultipleSelection() && event.originalEvent.shiftKey && anchorRowIndex.current !== null;\n };\n var allowRowSelection = function allowRowSelection() {\n return (props.selectionMode || props.selectionModeInColumn) && !isRadioOnlySelection() && !isCheckboxOnlySelection();\n };\n var allowCellSelection = function allowCellSelection() {\n return props.cellSelection && !isRadioSelectionModeInColumn && !isCheckboxSelectionModeInColumn;\n };\n var getColumnsLength = function getColumnsLength() {\n return props.columns ? props.columns.length : 0;\n };\n var getVirtualScrollerOption = function getVirtualScrollerOption(option, options) {\n options = options || props.virtualScrollerOptions;\n return options ? options[option] : null;\n };\n var findIndex = function findIndex(collection, rowData) {\n return (collection || []).findIndex(function (data) {\n return equals(rowData, data);\n });\n };\n var rowGroupHeaderStyle = function rowGroupHeaderStyle() {\n if (props.scrollable) {\n return {\n top: rowGroupHeaderStyleObjectState['top']\n };\n }\n return null;\n };\n var getRowKey = function getRowKey(rowData, index) {\n return props.dataKey ? ObjectUtils.resolveFieldData(rowData, props.dataKey) + '_' + index : index;\n };\n var shouldRenderRowGroupHeader = function shouldRenderRowGroupHeader(value, rowData, i) {\n var currentRowFieldData = ObjectUtils.resolveFieldData(rowData, props.groupRowsBy);\n var prevRowData = value[i - 1];\n if (prevRowData) {\n var previousRowFieldData = ObjectUtils.resolveFieldData(prevRowData, props.groupRowsBy);\n return currentRowFieldData !== previousRowFieldData;\n } else {\n return true;\n }\n };\n var shouldRenderRowGroupFooter = function shouldRenderRowGroupFooter(value, rowData, i, expanded) {\n if (props.expandableRowGroups && !expanded) {\n return false;\n } else {\n var currentRowFieldData = ObjectUtils.resolveFieldData(rowData, props.groupRowsBy);\n var nextRowData = value[i + 1];\n if (nextRowData) {\n var nextRowFieldData = ObjectUtils.resolveFieldData(nextRowData, props.groupRowsBy);\n return currentRowFieldData !== nextRowFieldData;\n } else {\n return true;\n }\n }\n };\n var updateFrozenRowStickyPosition = function updateFrozenRowStickyPosition() {\n elementRef.current.style.top = DomHandler.getOuterHeight(elementRef.current.previousElementSibling) + 'px';\n };\n var updateFrozenRowGroupHeaderStickyPosition = function updateFrozenRowGroupHeaderStickyPosition() {\n var tableHeaderHeight = DomHandler.getOuterHeight(elementRef.current.previousElementSibling);\n var top = tableHeaderHeight + 'px';\n if (rowGroupHeaderStyleObjectState.top !== top) {\n setRowGroupHeaderStyleObjectState({\n top: top\n });\n }\n };\n var updateVirtualScrollerPosition = function updateVirtualScrollerPosition() {\n var tableHeaderHeight = DomHandler.getOuterHeight(elementRef.current.previousElementSibling);\n elementRef.current.style.top = (elementRef.current.style.top || 0) + tableHeaderHeight + 'px';\n };\n var onSingleSelection = function onSingleSelection(_ref) {\n var originalEvent = _ref.originalEvent,\n data = _ref.data,\n index = _ref.index,\n toggleable = _ref.toggleable,\n type = _ref.type;\n if (!isSelectable({\n data: data,\n index: index\n })) {\n return;\n }\n var selected = isSelected(data);\n var selection = props.selection;\n if (selected) {\n if (toggleable) {\n selection = null;\n onUnselect({\n originalEvent: originalEvent,\n data: data,\n type: type\n });\n }\n } else {\n selection = data;\n onSelect({\n originalEvent: originalEvent,\n data: data,\n type: type\n });\n }\n focusOnElement(originalEvent, true);\n if (props.onSelectionChange && selection !== props.selection) {\n props.onSelectionChange({\n originalEvent: originalEvent,\n value: selection,\n type: type\n });\n }\n };\n var onMultipleSelection = function onMultipleSelection(_ref2) {\n var originalEvent = _ref2.originalEvent,\n data = _ref2.data,\n index = _ref2.index,\n toggleable = _ref2.toggleable,\n type = _ref2.type;\n if (!isSelectable({\n data: data,\n index: index\n })) {\n return;\n }\n var selected = isSelected(data);\n var selection = props.selection || [];\n if (selected) {\n if (toggleable) {\n var selectionIndex = findIndex(selection, data);\n selection = props.selection.filter(function (val, i) {\n return i !== selectionIndex;\n });\n onUnselect({\n originalEvent: originalEvent,\n data: data,\n type: type\n });\n } else if (selection.length) {\n props.selection.forEach(function (d) {\n return onUnselect({\n originalEvent: originalEvent,\n data: d,\n type: type\n });\n });\n selection = [data];\n onSelect({\n originalEvent: originalEvent,\n data: data,\n type: type\n });\n }\n } else {\n selection = toggleable && isMultipleSelection() ? [].concat(_toConsumableArray(selection), [data]) : [data];\n onSelect({\n originalEvent: originalEvent,\n data: data,\n type: type\n });\n }\n focusOnElement(originalEvent, true);\n if (props.onSelectionChange && selection !== props.selection) {\n props.onSelectionChange({\n originalEvent: originalEvent,\n value: selection,\n type: type\n });\n }\n };\n var onRangeSelection = function onRangeSelection(event, type) {\n DomHandler.clearSelection();\n rangeRowIndex.current = allowCellSelection() ? event.rowIndex : event.index;\n var selection = selectRange(event);\n if (props.onSelectionChange && selection !== props.selection) {\n props.onSelectionChange({\n originalEvent: event.originalEvent,\n value: selection,\n type: type\n });\n }\n anchorRowIndex.current = rangeRowIndex.current;\n anchorCellIndex.current = event.cellIndex;\n focusOnElement(event.originalEvent, false);\n };\n var selectRange = function selectRange(event) {\n var rangeStart, rangeEnd;\n if (rangeRowIndex.current > anchorRowIndex.current) {\n rangeStart = anchorRowIndex.current;\n rangeEnd = rangeRowIndex.current;\n } else if (rangeRowIndex.current < anchorRowIndex.current) {\n rangeStart = rangeRowIndex.current;\n rangeEnd = anchorRowIndex.current;\n } else {\n rangeStart = rangeEnd = rangeRowIndex.current;\n }\n if (props.paginator) {\n rangeStart = Math.max(rangeStart - props.first, 0);\n rangeEnd -= props.first;\n }\n return allowCellSelection() ? selectRangeOnCell(event, rangeStart, rangeEnd) : selectRangeOnRow(event, rangeStart, rangeEnd);\n };\n var selectRangeOnRow = function selectRangeOnRow(event, rowRangeStart, rowRangeEnd) {\n var value = props.value;\n var selection = [];\n for (var i = rowRangeStart; i <= rowRangeEnd; i++) {\n var rangeRowData = value[i];\n if (!isSelectable({\n data: rangeRowData,\n index: i\n })) {\n continue;\n }\n selection.push(rangeRowData);\n onSelect({\n originalEvent: event.originalEvent,\n data: rangeRowData,\n type: 'row'\n });\n }\n return selection;\n };\n var selectRangeOnCell = function selectRangeOnCell(event, rowRangeStart, rowRangeEnd) {\n var cellRangeStart,\n cellRangeEnd,\n cellIndex = event.cellIndex;\n if (cellIndex > anchorCellIndex.current) {\n cellRangeStart = anchorCellIndex.current;\n cellRangeEnd = cellIndex;\n } else if (cellIndex < anchorCellIndex.current) {\n cellRangeStart = cellIndex;\n cellRangeEnd = anchorCellIndex.current;\n } else {\n cellRangeStart = cellRangeEnd = cellIndex;\n }\n var value = props.value;\n var selection = [];\n for (var i = rowRangeStart; i <= rowRangeEnd; i++) {\n var rowData = value[i];\n var columns = props.columns;\n var rowIndex = props.paginator ? i + props.first : i;\n for (var j = cellRangeStart; j <= cellRangeEnd; j++) {\n var field = columns[j].props.field;\n var _value = ObjectUtils.resolveFieldData(rowData, field);\n var rangeRowData = {\n value: _value,\n field: field,\n rowData: rowData,\n rowIndex: rowIndex,\n cellIndex: j,\n selected: true\n };\n if (!isSelectable({\n data: rangeRowData,\n index: i\n })) {\n continue;\n }\n selection.push(rangeRowData);\n onSelect({\n originalEvent: event.originalEvent,\n data: rangeRowData,\n type: 'cell'\n });\n }\n }\n return selection;\n };\n var onSelect = function onSelect(event) {\n if (allowCellSelection()) props.onCellSelect && props.onCellSelect(_objectSpread$5(_objectSpread$5({\n originalEvent: event.originalEvent\n }, event.data), {}, {\n type: event.type\n }));else props.onRowSelect && props.onRowSelect(event);\n };\n var onUnselect = function onUnselect(event) {\n if (allowCellSelection()) props.onCellUnselect && props.onCellUnselect(_objectSpread$5(_objectSpread$5({\n originalEvent: event.originalEvent\n }, event.data), {}, {\n type: event.type\n }));else props.onRowUnselect && props.onRowUnselect(event);\n };\n var enableDragSelection = function enableDragSelection(event) {\n if (props.dragSelection && !dragSelectionHelper.current) {\n dragSelectionHelper.current = document.createElement('div');\n DomHandler.addClass(dragSelectionHelper.current, 'p-datatable-drag-selection-helper');\n initialDragPosition.current = {\n x: event.clientX,\n y: event.clientY\n };\n dragSelectionHelper.current.style.top = \"\".concat(event.pageY, \"px\");\n dragSelectionHelper.current.style.left = \"\".concat(event.pageX, \"px\");\n bindDragSelectionEvents();\n }\n };\n var focusOnElement = function focusOnElement(event, isFocused) {\n var target = event.currentTarget;\n if (!allowCellSelection() && props.selectionAutoFocus) {\n if (isCheckboxSelectionModeInColumn) {\n var checkbox = DomHandler.findSingle(target, 'td.p-selection-column .p-checkbox-box');\n checkbox && checkbox.focus();\n } else if (isRadioSelectionModeInColumn) {\n var radio = DomHandler.findSingle(target, 'td.p-selection-column input[type=\"radio\"]');\n radio && radio.focus();\n }\n }\n !isFocused && target && target.focus();\n };\n var changeTabIndex = function changeTabIndex(event, type) {\n var target = event.currentTarget;\n var isSelectable = DomHandler.hasClass(target, type === 'cell' ? 'p-selectable-cell' : 'p-selectable-row');\n if (isSelectable) {\n var selector = type === 'cell' ? 'tr > td' : 'tr';\n var tabbableEl = DomHandler.findSingle(elementRef.current, \"\".concat(selector, \"[tabindex=\\\"\").concat(props.tabIndex, \"\\\"]\"));\n if (tabbableEl && target) {\n tabbableEl.tabIndex = -1;\n target.tabIndex = props.tabIndex;\n }\n }\n };\n var onRowClick = function onRowClick(event) {\n if (allowCellSelection() || !allowSelection(event)) {\n return;\n }\n props.onRowClick && props.onRowClick(event);\n if (allowRowSelection()) {\n if (allowRangeSelection(event)) {\n onRangeSelection(event, 'row');\n } else {\n var toggleable = isRadioSelectionModeInColumn || isCheckboxSelectionModeInColumn || allowMetaKeySelection(event);\n anchorRowIndex.current = event.index;\n rangeRowIndex.current = event.index;\n anchorRowFirst.current = props.first;\n if (isSingleSelection()) {\n onSingleSelection(_objectSpread$5(_objectSpread$5({}, event), {}, {\n toggleable: toggleable,\n type: 'row'\n }));\n } else {\n onMultipleSelection(_objectSpread$5(_objectSpread$5({}, event), {}, {\n toggleable: toggleable,\n type: 'row'\n }));\n }\n }\n changeTabIndex(event.originalEvent, 'row');\n } else {\n focusOnElement(event.originalEvent);\n }\n rowTouched.current = false;\n };\n var onRowDoubleClick = function onRowDoubleClick(e) {\n var event = e.originalEvent;\n if (DomHandler.isClickable(event.target)) {\n return;\n }\n if (props.onRowDoubleClick) {\n props.onRowDoubleClick(e);\n }\n };\n var onRowRightClick = function onRowRightClick(event) {\n if (props.onContextMenu || props.onContextMenuSelectionChange) {\n DomHandler.clearSelection();\n if (props.onContextMenuSelectionChange) {\n props.onContextMenuSelectionChange({\n originalEvent: event.originalEvent,\n value: event.data\n });\n }\n if (props.onContextMenu) {\n props.onContextMenu({\n originalEvent: event.originalEvent,\n data: event.data\n });\n }\n event.originalEvent.preventDefault();\n }\n };\n var onRowMouseEnter = function onRowMouseEnter(event) {\n props.onRowMouseEnter && props.onRowMouseEnter(event);\n };\n var onRowMouseLeave = function onRowMouseLeave(event) {\n props.onRowMouseLeave && props.onRowMouseLeave(event);\n };\n var onRowTouchEnd = function onRowTouchEnd() {\n rowTouched.current = true;\n };\n var onRowMouseDown = function onRowMouseDown(e) {\n var event = e.originalEvent;\n if (DomHandler.hasClass(event.target, 'p-datatable-reorderablerow-handle')) event.currentTarget.draggable = true;else event.currentTarget.draggable = false;\n if (allowRowDrag(e)) {\n enableDragSelection(event);\n anchorRowIndex.current = e.index;\n rangeRowIndex.current = e.index;\n anchorRowFirst.current = props.first;\n }\n };\n var onRowMouseUp = function onRowMouseUp(event) {\n var isSameRow = event.index === anchorRowIndex.current;\n if (allowRowDrag(event) && !isSameRow) {\n onRangeSelection(event, 'row');\n }\n };\n var onRowToggle = function onRowToggle(event) {\n var expandedRows;\n var dataKey = props.dataKey;\n var hasDataKey = props.groupRowsBy ? dataKey === props.groupRowsBy : !!dataKey;\n if (hasDataKey) {\n var dataKeyValue = String(ObjectUtils.resolveFieldData(event.data, dataKey));\n expandedRows = props.expandedRows ? _objectSpread$5({}, props.expandedRows) : {};\n if (expandedRows[dataKeyValue] != null) {\n delete expandedRows[dataKeyValue];\n if (props.onRowCollapse) {\n props.onRowCollapse({\n originalEvent: event,\n data: event.data\n });\n }\n } else {\n expandedRows[dataKeyValue] = true;\n if (props.onRowExpand) {\n props.onRowExpand({\n originalEvent: event,\n data: event.data\n });\n }\n }\n } else {\n var expandedRowIndex = findIndex(props.expandedRows, event.data);\n expandedRows = props.expandedRows ? _toConsumableArray(props.expandedRows) : [];\n if (expandedRowIndex !== -1) {\n expandedRows = expandedRows.filter(function (_, i) {\n return i !== expandedRowIndex;\n });\n if (props.onRowCollapse) {\n props.onRowCollapse({\n originalEvent: event,\n data: event.data\n });\n }\n } else {\n expandedRows.push(event.data);\n if (props.onRowExpand) {\n props.onRowExpand({\n originalEvent: event,\n data: event.data\n });\n }\n }\n }\n if (props.onRowToggle) {\n props.onRowToggle({\n data: expandedRows\n });\n }\n };\n var onRowDragStart = function onRowDragStart(e) {\n var event = e.originalEvent,\n index = e.index;\n if (allowRowDrag(event)) {\n rowDragging.current = true;\n draggedRowIndex.current = index;\n event.dataTransfer.setData('text', 'b'); // For firefox\n }\n };\n\n var onRowDragOver = function onRowDragOver(e) {\n var event = e.originalEvent,\n index = e.index;\n if (rowDragging.current && draggedRowIndex.current !== index) {\n var rowElement = event.currentTarget;\n var rowY = DomHandler.getOffset(rowElement).top + DomHandler.getWindowScrollTop();\n var pageY = event.pageY + window.scrollY;\n var rowMidY = rowY + DomHandler.getOuterHeight(rowElement) / 2;\n var prevRowElement = rowElement.previousElementSibling;\n if (pageY < rowMidY) {\n DomHandler.removeClass(rowElement, 'p-datatable-dragpoint-bottom');\n droppedRowIndex.current = index;\n if (prevRowElement) DomHandler.addClass(prevRowElement, 'p-datatable-dragpoint-bottom');else DomHandler.addClass(rowElement, 'p-datatable-dragpoint-top');\n } else {\n if (prevRowElement) DomHandler.removeClass(prevRowElement, 'p-datatable-dragpoint-bottom');else DomHandler.addClass(rowElement, 'p-datatable-dragpoint-top');\n droppedRowIndex.current = index + 1;\n DomHandler.addClass(rowElement, 'p-datatable-dragpoint-bottom');\n }\n }\n event.preventDefault();\n };\n var onRowDragLeave = function onRowDragLeave(e) {\n var event = e.originalEvent;\n var rowElement = event.currentTarget;\n var prevRowElement = rowElement.previousElementSibling;\n if (prevRowElement) {\n DomHandler.removeClass(prevRowElement, 'p-datatable-dragpoint-bottom');\n }\n DomHandler.removeClass(rowElement, 'p-datatable-dragpoint-bottom');\n DomHandler.removeClass(rowElement, 'p-datatable-dragpoint-top');\n };\n var onRowDragEnd = function onRowDragEnd(e) {\n var event = e.originalEvent;\n rowDragging.current = false;\n draggedRowIndex.current = null;\n droppedRowIndex.current = null;\n event.currentTarget.draggable = false;\n };\n var onRowDrop = function onRowDrop(e) {\n var event = e.originalEvent;\n if (droppedRowIndex.current != null) {\n var dropIndex = draggedRowIndex.current > droppedRowIndex.current ? droppedRowIndex.current : droppedRowIndex.current === 0 ? 0 : droppedRowIndex.current - 1;\n var val = _toConsumableArray(props.value);\n ObjectUtils.reorderArray(val, draggedRowIndex.current, dropIndex);\n if (props.onRowReorder) {\n props.onRowReorder({\n originalEvent: event,\n value: val,\n dragIndex: draggedRowIndex.current,\n dropIndex: droppedRowIndex.current\n });\n }\n }\n\n //cleanup\n onRowDragLeave(e);\n onRowDragEnd(e);\n event.preventDefault();\n };\n var onRadioChange = function onRadioChange(event) {\n onSingleSelection(_objectSpread$5(_objectSpread$5({}, event), {}, {\n toggleable: true,\n type: 'radio'\n }));\n };\n var onCheckboxChange = function onCheckboxChange(event) {\n onMultipleSelection(_objectSpread$5(_objectSpread$5({}, event), {}, {\n toggleable: true,\n type: 'checkbox'\n }));\n };\n var onDragSelectionMouseMove = function onDragSelectionMouseMove(event) {\n var _initialDragPosition$ = initialDragPosition.current,\n x = _initialDragPosition$.x,\n y = _initialDragPosition$.y;\n var dx = event.clientX - x;\n var dy = event.clientY - y;\n if (dy < 0) dragSelectionHelper.current.style.top = \"\".concat(event.pageY + 5, \"px\");\n if (dx < 0) dragSelectionHelper.current.style.left = \"\".concat(event.pageX + 5, \"px\");\n dragSelectionHelper.current.style.height = \"\".concat(Math.abs(dy), \"px\");\n dragSelectionHelper.current.style.width = \"\".concat(Math.abs(dx), \"px\");\n event.preventDefault();\n };\n var onDragSelectionMouseUp = function onDragSelectionMouseUp() {\n if (dragSelectionHelper.current) {\n dragSelectionHelper.current.remove();\n dragSelectionHelper.current = null;\n }\n document.removeEventListener('mousemove', onDragSelectionMouseMove);\n document.removeEventListener('mouseup', onDragSelectionMouseUp);\n };\n var onCellClick = function onCellClick(event) {\n if (!allowSelection(event)) {\n return;\n }\n props.onCellClick && props.onCellClick(event);\n if (allowCellSelection()) {\n if (allowRangeSelection(event)) {\n onRangeSelection(event, 'cell');\n } else {\n var toggleable = allowMetaKeySelection(event);\n var originalEvent = event.originalEvent,\n data = _objectWithoutProperties(event, _excluded);\n anchorRowIndex.current = event.rowIndex;\n rangeRowIndex.current = event.rowIndex;\n anchorRowFirst.current = props.first;\n anchorCellIndex.current = event.cellIndex;\n if (isSingleSelection()) {\n onSingleSelection({\n originalEvent: originalEvent,\n data: data,\n index: event.rowIndex,\n toggleable: toggleable,\n type: 'cell'\n });\n } else {\n onMultipleSelection({\n originalEvent: originalEvent,\n data: data,\n index: event.rowIndex,\n toggleable: toggleable,\n type: 'cell'\n });\n }\n }\n changeTabIndex(event.originalEvent, 'cell');\n }\n rowTouched.current = false;\n };\n var onCellMouseDown = function onCellMouseDown(event) {\n if (allowCellDrag(event)) {\n enableDragSelection(event.originalEvent);\n anchorRowIndex.current = event.rowIndex;\n rangeRowIndex.current = event.rowIndex;\n anchorRowFirst.current = props.first;\n anchorCellIndex.current = event.cellIndex;\n }\n };\n var onCellMouseUp = function onCellMouseUp(event) {\n var isSameCell = event.rowIndex === anchorRowIndex.current && event.cellIndex === anchorCellIndex.current;\n if (allowCellDrag(event) && !isSameCell) {\n onRangeSelection(event, 'cell');\n }\n };\n var bindDragSelectionEvents = function bindDragSelectionEvents() {\n document.addEventListener('mousemove', onDragSelectionMouseMove);\n document.addEventListener('mouseup', onDragSelectionMouseUp);\n document.body.appendChild(dragSelectionHelper.current);\n };\n var unbindDragSelectionEvents = function unbindDragSelectionEvents() {\n onDragSelectionMouseUp();\n };\n React.useEffect(function () {\n if (props.frozenRow) {\n updateFrozenRowStickyPosition();\n }\n if (props.scrollable && props.rowGroupMode === 'subheader') {\n updateFrozenRowGroupHeaderStickyPosition();\n }\n });\n useMountEffect(function () {\n if (!props.isVirtualScrollerDisabled && getVirtualScrollerOption('vertical')) {\n updateVirtualScrollerPosition();\n }\n });\n useUpdateEffect(function () {\n if (!props.isVirtualScrollerDisabled && getVirtualScrollerOption('vertical') && getVirtualScrollerOption('itemSize', prevVirtualScrollerOptions) !== getVirtualScrollerOption('itemSize')) {\n updateVirtualScrollerPosition();\n }\n }, [props.virtualScrollerOptions]);\n useUpdateEffect(function () {\n if (props.paginator && isMultipleSelection()) {\n anchorRowIndex.current = null;\n }\n }, [props.first]);\n useUnmountEffect(function () {\n if (props.dragSelection) {\n unbindDragSelectionEvents();\n }\n });\n var createEmptyContent = function createEmptyContent() {\n if (!props.loading) {\n var colSpan = getColumnsLength();\n var _content = ObjectUtils.getJSXElement(props.emptyMessage, {\n props: props.tableProps,\n frozen: props.frozenRow\n }) || localeOption('emptyMessage');\n return /*#__PURE__*/React.createElement(\"tr\", {\n className: \"p-datatable-emptymessage\",\n role: \"row\"\n }, /*#__PURE__*/React.createElement(\"td\", {\n colSpan: colSpan,\n role: \"cell\"\n }, _content));\n }\n return null;\n };\n var createGroupHeader = function createGroupHeader(rowData, index, expanded, colSpan) {\n if (isSubheaderGrouping && shouldRenderRowGroupHeader(props.value, rowData, index - props.first)) {\n var _options;\n var style = rowGroupHeaderStyle();\n var toggler = props.expandableRowGroups && /*#__PURE__*/React.createElement(RowTogglerButton, {\n onClick: onRowToggle,\n rowData: rowData,\n expanded: expanded,\n expandedRowIcon: props.expandedRowIcon,\n collapsedRowIcon: props.collapsedRowIcon\n });\n var options = (_options = {\n index: index\n }, _defineProperty(_options, \"index\", index), _defineProperty(_options, \"props\", props.tableProps), _defineProperty(_options, \"customRendering\", false), _options);\n var _content2 = ObjectUtils.getJSXElement(props.rowGroupHeaderTemplate, rowData, options);\n\n // check if the user wants complete control of the rendering\n if (!options.customRendering) {\n _content2 = /*#__PURE__*/React.createElement(\"td\", {\n colSpan: colSpan\n }, toggler, /*#__PURE__*/React.createElement(\"span\", {\n className: \"p-rowgroup-header-name\"\n }, _content2));\n }\n return /*#__PURE__*/React.createElement(\"tr\", {\n className: \"p-rowgroup-header\",\n style: style,\n role: \"row\"\n }, _content2);\n }\n return null;\n };\n var createRow = function createRow(rowData, index, expanded) {\n if (!props.expandableRowGroups || expanded) {\n var selected = isSelectionEnabled() ? isSelected(rowData) : false;\n var contextMenuSelected = isContextMenuSelected(rowData);\n var _allowRowSelection = allowRowSelection();\n var _allowCellSelection = allowCellSelection();\n var editing = isRowEditing(rowData);\n return /*#__PURE__*/React.createElement(BodyRow, {\n tableProps: props.tableProps,\n tableSelector: props.tableSelector,\n value: props.value,\n columns: props.columns,\n rowData: rowData,\n index: index,\n selected: selected,\n contextMenuSelected: contextMenuSelected,\n onRowClick: onRowClick,\n onRowDoubleClick: onRowDoubleClick,\n onRowRightClick: onRowRightClick,\n onRowMouseEnter: onRowMouseEnter,\n onRowMouseLeave: onRowMouseLeave,\n tabIndex: props.tabIndex,\n isSelectable: isSelectable,\n onRowTouchEnd: onRowTouchEnd,\n onRowMouseDown: onRowMouseDown,\n onRowMouseUp: onRowMouseUp,\n onRowToggle: onRowToggle,\n onRowDragStart: onRowDragStart,\n onRowDragOver: onRowDragOver,\n onRowDragLeave: onRowDragLeave,\n onRowDragEnd: onRowDragEnd,\n onRowDrop: onRowDrop,\n onRadioChange: onRadioChange,\n onCheckboxChange: onCheckboxChange,\n onCellClick: onCellClick,\n onCellMouseDown: onCellMouseDown,\n onCellMouseUp: onCellMouseUp,\n editing: editing,\n editingRows: props.editingRows,\n editingMeta: props.editingMeta,\n editMode: props.editMode,\n onRowEditChange: props.onRowEditChange,\n onEditingMetaChange: props.onEditingMetaChange,\n groupRowsBy: props.groupRowsBy,\n compareSelectionBy: props.compareSelectionBy,\n dataKey: props.dataKey,\n rowGroupMode: props.rowGroupMode,\n onRowEditInit: props.onRowEditInit,\n rowEditValidator: props.rowEditValidator,\n onRowEditSave: props.onRowEditSave,\n onRowEditComplete: props.onRowEditComplete,\n onRowEditCancel: props.onRowEditCancel,\n selection: props.selection,\n allowRowSelection: _allowRowSelection,\n allowCellSelection: _allowCellSelection,\n selectOnEdit: props.selectOnEdit,\n selectionMode: props.selectionMode,\n selectionModeInColumn: props.selectionModeInColumn,\n cellClassName: props.cellClassName,\n responsiveLayout: props.responsiveLayout,\n frozenRow: props.frozenRow,\n showSelectionElement: props.showSelectionElement,\n showRowReorderElement: props.showRowReorderElement,\n expanded: expanded,\n expandedRowIcon: props.expandedRowIcon,\n collapsedRowIcon: props.collapsedRowIcon,\n rowClassName: props.rowClassName,\n virtualScrollerOptions: props.virtualScrollerOptions\n });\n }\n };\n var createExpansion = function createExpansion(rowData, index, expanded, colSpan) {\n if (expanded && !(isSubheaderGrouping && props.expandableRowGroups)) {\n var id = \"\".concat(props.tableSelector, \"_content_\").concat(index, \"_expanded\");\n var options = {\n index: index,\n customRendering: false\n };\n var _content3 = ObjectUtils.getJSXElement(props.rowExpansionTemplate, rowData, options);\n\n // check if the user wants complete control of the rendering\n if (!options.customRendering) {\n _content3 = /*#__PURE__*/React.createElement(\"td\", {\n role: \"cell\",\n colSpan: colSpan\n }, _content3);\n }\n return /*#__PURE__*/React.createElement(\"tr\", {\n id: id,\n className: \"p-datatable-row-expansion\",\n role: \"row\"\n }, _content3);\n }\n return null;\n };\n var createGroupFooter = function createGroupFooter(rowData, index, expanded, colSpan) {\n if (isSubheaderGrouping && shouldRenderRowGroupFooter(props.value, rowData, index - props.first, expanded)) {\n var _content4 = ObjectUtils.getJSXElement(props.rowGroupFooterTemplate, rowData, {\n index: index,\n colSpan: colSpan,\n props: props.tableProps\n });\n return /*#__PURE__*/React.createElement(\"tr\", {\n className: \"p-rowgroup-footer\",\n role: \"row\"\n }, _content4);\n }\n return null;\n };\n var createContent = function createContent() {\n return props.value.map(function (rowData, i) {\n var index = getVirtualScrollerOption('getItemOptions') ? getVirtualScrollerOption('getItemOptions')(i).index : props.first + i;\n var key = getRowKey(rowData, index);\n var expanded = isRowExpanded(rowData);\n var colSpan = getColumnsLength();\n var groupHeader = createGroupHeader(rowData, index, expanded, colSpan);\n var row = createRow(rowData, index, expanded);\n var expansion = createExpansion(rowData, index, expanded, colSpan);\n var groupFooter = createGroupFooter(rowData, index, expanded, colSpan);\n return /*#__PURE__*/React.createElement(React.Fragment, {\n key: key\n }, groupHeader, row, expansion, groupFooter);\n });\n };\n var className = classNames('p-datatable-tbody', props.className);\n var content = props.empty ? createEmptyContent() : createContent();\n return /*#__PURE__*/React.createElement(\"tbody\", {\n ref: refCallback,\n className: className\n }, content);\n}));\nTableBody.displayName = 'TableBody';\n\nfunction 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; }\nfunction _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; }\nvar FooterCell = /*#__PURE__*/React.memo(function (props) {\n var _React$useState = React.useState({}),\n _React$useState2 = _slicedToArray(_React$useState, 2),\n styleObjectState = _React$useState2[0],\n setStyleObjectState = _React$useState2[1];\n var elementRef = React.useRef(null);\n var getColumnProp = function getColumnProp(prop) {\n return props.column.props[prop];\n };\n var getStyle = function getStyle() {\n var footerStyle = getColumnProp('footerStyle');\n var columnStyle = getColumnProp('style');\n return getColumnProp('frozen') ? Object.assign({}, columnStyle, footerStyle, styleObjectState) : Object.assign({}, columnStyle, footerStyle);\n };\n var updateStickyPosition = function updateStickyPosition() {\n if (getColumnProp('frozen')) {\n var styleObject = _objectSpread$4({}, styleObjectState);\n var _align = getColumnProp('alignFrozen');\n if (_align === 'right') {\n var right = 0;\n var next = elementRef.current.nextElementSibling;\n if (next) {\n right = DomHandler.getOuterWidth(next) + parseFloat(next.style.right || 0);\n }\n styleObject['right'] = right + 'px';\n } else {\n var left = 0;\n var prev = elementRef.current.previousElementSibling;\n if (prev) {\n left = DomHandler.getOuterWidth(prev) + parseFloat(prev.style.left || 0);\n }\n styleObject['left'] = left + 'px';\n }\n var isSameStyle = styleObjectState['left'] === styleObject['left'] && styleObjectState['right'] === styleObject['right'];\n !isSameStyle && setStyleObjectState(styleObject);\n }\n };\n React.useEffect(function () {\n if (getColumnProp('frozen')) {\n updateStickyPosition();\n }\n });\n var style = getStyle();\n var align = getColumnProp('align');\n var colSpan = getColumnProp('colSpan');\n var rowSpan = getColumnProp('rowSpan');\n var className = classNames(getColumnProp('footerClassName'), getColumnProp('className'), _defineProperty({\n 'p-frozen-column': getColumnProp('frozen')\n }, \"p-align-\".concat(align), !!align));\n var content = ObjectUtils.getJSXElement(getColumnProp('footer'), {\n props: props.tableProps\n });\n return /*#__PURE__*/React.createElement(\"td\", {\n ref: elementRef,\n style: style,\n className: className,\n role: \"cell\",\n colSpan: colSpan,\n rowSpan: rowSpan\n }, content);\n});\nFooterCell.displayName = 'FooterCell';\n\nvar TableFooter = /*#__PURE__*/React.memo(function (props) {\n var hasFooter = function hasFooter() {\n return props.footerColumnGroup ? true : props.columns ? props.columns.some(function (col) {\n return col && col.props.footer;\n }) : false;\n };\n var createGroupFooterCells = function createGroupFooterCells(row) {\n var columns = React.Children.toArray(row.props.children);\n return createFooterCells(columns);\n };\n var createFooterCells = function createFooterCells(columns) {\n return React.Children.map(columns, function (col, i) {\n var isVisible = col ? !col.props.hidden : true;\n var key = col ? col.props.columnKey || col.props.field || i : i;\n return isVisible && /*#__PURE__*/React.createElement(FooterCell, {\n key: key,\n tableProps: props.tableProps,\n column: col\n });\n });\n };\n var createContent = function createContent() {\n if (props.footerColumnGroup) {\n var rows = React.Children.toArray(props.footerColumnGroup.props.children);\n return rows.map(function (row, i) {\n return /*#__PURE__*/React.createElement(\"tr\", {\n key: i,\n role: \"row\"\n }, createGroupFooterCells(row));\n });\n }\n return /*#__PURE__*/React.createElement(\"tr\", {\n role: \"row\"\n }, createFooterCells(props.columns));\n };\n if (hasFooter()) {\n var content = createContent();\n return /*#__PURE__*/React.createElement(\"tfoot\", {\n className: \"p-datatable-tfoot\"\n }, content);\n }\n return null;\n});\nTableFooter.displayName = 'TableFooter';\n\nfunction 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; }\nfunction _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; }\nvar ColumnFilter = /*#__PURE__*/React.memo(function (props) {\n var _React$useState = React.useState(false),\n _React$useState2 = _slicedToArray(_React$useState, 2),\n overlayVisibleState = _React$useState2[0],\n setOverlayVisibleState = _React$useState2[1];\n var overlayRef = React.useRef(null);\n var iconRef = React.useRef(null);\n var selfClick = React.useRef(false);\n var overlayEventListener = React.useRef(null);\n var getColumnProp = function getColumnProp(prop) {\n return props.column.props[prop];\n };\n var field = getColumnProp('filterField') || getColumnProp('field');\n var filterModel = props.filters[field];\n var filterStoreModel = props.filtersStore && props.filtersStore[field];\n var _useOverlayListener = useOverlayListener({\n target: iconRef,\n overlay: overlayRef,\n listener: function listener(event, _ref) {\n var type = _ref.type,\n valid = _ref.valid;\n if (valid) {\n type === 'outside' ? !selfClick.current && !isTargetClicked(event.target) && hide() : hide();\n }\n selfClick.current = false;\n },\n when: overlayVisibleState\n }),\n _useOverlayListener2 = _slicedToArray(_useOverlayListener, 2),\n bindOverlayListener = _useOverlayListener2[0],\n unbindOverlayListener = _useOverlayListener2[1];\n var hasFilter = function hasFilter() {\n if (!filterStoreModel || !filterModel) return false;\n return filterStoreModel.operator ? !isFilterBlank(filterModel.constraints[0].value) : !isFilterBlank(filterModel.value);\n };\n var hasRowFilter = function hasRowFilter() {\n return filterModel && !isFilterBlank(filterModel.value);\n };\n var isFilterBlank = function isFilterBlank(filter) {\n return ObjectUtils.isEmpty(filter);\n };\n var isRowMatchModeSelected = function isRowMatchModeSelected(matchMode) {\n return filterModel && filterModel.matchMode === matchMode;\n };\n var showMenuButton = function showMenuButton() {\n return getColumnProp('showFilterMenu') && (props.display === 'row' ? getColumnProp('dataType') !== 'boolean' : true);\n };\n var matchModes = function matchModes() {\n return getColumnProp('filterMatchModeOptions') || PrimeReact.filterMatchModeOptions[findDataType()].map(function (key) {\n return {\n label: localeOption(key),\n value: key\n };\n });\n };\n var isShowMatchModes = function isShowMatchModes() {\n return getColumnProp('dataType') !== 'boolean' && getColumnProp('showFilterMatchModes') && matchModes() && getColumnProp('showFilterMenuOptions');\n };\n var isShowOperator = function isShowOperator() {\n return getColumnProp('showFilterOperator') && filterModel && filterModel.operator && getColumnProp('showFilterMenuOptions');\n };\n var showRemoveIcon = function showRemoveIcon() {\n return fieldConstraints().length > 1;\n };\n var isShowAddConstraint = function isShowAddConstraint() {\n return getColumnProp('showAddButton') && filterModel && filterModel.operator && fieldConstraints() && fieldConstraints().length < getColumnProp('maxConstraints') && getColumnProp('showFilterMenuOptions');\n };\n var isOutsideClicked = function isOutsideClicked(target) {\n return !isTargetClicked(target) && overlayRef.current && !(overlayRef.current.isSameNode(target) || overlayRef.current.contains(target));\n };\n var isTargetClicked = function isTargetClicked(target) {\n return iconRef.current && (iconRef.current.isSameNode(target) || iconRef.current.contains(target));\n };\n var getDefaultConstraint = function getDefaultConstraint() {\n if (filterStoreModel) {\n if (filterStoreModel.operator) {\n return {\n matchMode: filterStoreModel.constraints[0].matchMode,\n operator: filterStoreModel.operator\n };\n } else {\n return {\n matchMode: filterStoreModel.matchMode\n };\n }\n }\n };\n var findDataType = function findDataType() {\n var dataType = getColumnProp('dataType');\n var matchMode = getColumnProp('filterMatchMode');\n var hasMatchMode = function hasMatchMode(key) {\n return PrimeReact.filterMatchModeOptions[key].some(function (mode) {\n return mode === matchMode;\n });\n };\n if (matchMode === 'custom' && !hasMatchMode(dataType)) {\n PrimeReact.filterMatchModeOptions[dataType].push(FilterMatchMode.CUSTOM);\n return dataType;\n } else if (matchMode) {\n return Object.keys(PrimeReact.filterMatchModeOptions).find(function (key) {\n return hasMatchMode(key);\n }) || dataType;\n }\n return dataType;\n };\n var clearFilter = function clearFilter() {\n var filterClearCallback = getColumnProp('onFilterClear');\n var defaultConstraint = getDefaultConstraint();\n var filters = _objectSpread$3({}, props.filters);\n if (filters[field].operator) {\n filters[field].constraints.splice(1);\n filters[field].operator = defaultConstraint.operator;\n filters[field].constraints[0] = {\n value: null,\n matchMode: defaultConstraint.matchMode\n };\n } else {\n filters[field].value = null;\n filters[field].matchMode = defaultConstraint.matchMode;\n }\n filterClearCallback && filterClearCallback();\n props.onFilterChange(filters);\n props.onFilterApply();\n hide();\n };\n var applyFilter = function applyFilter() {\n var filterApplyClickCallback = getColumnProp('onFilterApplyClick');\n filterApplyClickCallback && filterApplyClickCallback({\n field: field,\n constraints: filterModel\n });\n props.onFilterApply();\n hide();\n };\n var toggleMenu = function toggleMenu() {\n setOverlayVisibleState(function (prevVisible) {\n return !prevVisible;\n });\n };\n var onToggleButtonKeyDown = function onToggleButtonKeyDown(event) {\n switch (event.key) {\n case 'Escape':\n case 'Tab':\n hide();\n break;\n case 'ArrowDown':\n if (overlayVisibleState) {\n var focusable = DomHandler.getFirstFocusableElement(overlayRef.current);\n focusable && focusable.focus();\n event.preventDefault();\n } else if (event.altKey) {\n setOverlayVisibleState(true);\n event.preventDefault();\n }\n break;\n }\n };\n var onContentKeyDown = function onContentKeyDown(event) {\n if (event.key === 'Escape') {\n hide();\n iconRef.current && iconRef.current.focus();\n }\n };\n var onInputChange = function onInputChange(event, index) {\n var filters = _objectSpread$3({}, props.filters);\n var value = event.target.value;\n if (props.display === 'menu') {\n filters[field].constraints[index].value = value;\n } else {\n filters[field].value = value;\n }\n props.onFilterChange(filters);\n if (!getColumnProp('showApplyButton') || props.display === 'row') {\n props.onFilterApply();\n }\n };\n var onInputKeydown = function onInputKeydown(event, _index) {\n if (event.key === 'Enter') {\n if (!getColumnProp('showApplyButton') || props.display === 'menu') {\n applyFilter();\n }\n }\n };\n var onRowMatchModeChange = function onRowMatchModeChange(matchMode) {\n var filterMatchModeChangeCallback = getColumnProp('onFilterMatchModeChange');\n var filters = _objectSpread$3({}, props.filters);\n filters[field].matchMode = matchMode;\n filterMatchModeChangeCallback && filterMatchModeChangeCallback({\n field: field,\n matchMode: matchMode\n });\n props.onFilterChange(filters);\n props.onFilterApply();\n hide();\n };\n var onRowMatchModeKeyDown = function onRowMatchModeKeyDown(event, matchMode, clear) {\n var item = event.target;\n switch (event.key) {\n case 'ArrowDown':\n var nextItem = findNextItem(item);\n if (nextItem) {\n item.removeAttribute('tabindex');\n nextItem.tabIndex = 0;\n nextItem.focus();\n }\n event.preventDefault();\n break;\n case 'ArrowUp':\n var prevItem = findPrevItem(item);\n if (prevItem) {\n item.removeAttribute('tabindex');\n prevItem.tabIndex = 0;\n prevItem.focus();\n }\n event.preventDefault();\n break;\n case 'Enter':\n clear ? clearFilter() : onRowMatchModeChange(matchMode.value);\n event.preventDefault();\n break;\n }\n };\n var onOperatorChange = function onOperatorChange(e) {\n var filterOperationChangeCallback = getColumnProp('onFilterOperatorChange');\n var value = e.value;\n var filters = _objectSpread$3({}, props.filters);\n filters[field].operator = value;\n props.onFilterChange(filters);\n filterOperationChangeCallback && filterOperationChangeCallback({\n field: field,\n operator: value\n });\n if (!getColumnProp('showApplyButton')) {\n props.onFilterApply();\n }\n };\n var onMenuMatchModeChange = function onMenuMatchModeChange(value, index) {\n var filterMatchModeChangeCallback = getColumnProp('onFilterMatchModeChange');\n var filters = _objectSpread$3({}, props.filters);\n filters[field].constraints[index].matchMode = value;\n props.onFilterChange(filters);\n filterMatchModeChangeCallback && filterMatchModeChangeCallback({\n field: field,\n matchMode: value,\n index: index\n });\n if (!getColumnProp('showApplyButton')) {\n props.onFilterApply();\n }\n };\n var addConstraint = function addConstraint() {\n var filterConstraintAddCallback = getColumnProp('onFilterConstraintAdd');\n var defaultConstraint = getDefaultConstraint();\n var filters = _objectSpread$3({}, props.filters);\n var newConstraint = {\n value: null,\n matchMode: defaultConstraint.matchMode\n };\n filters[field].constraints.push(newConstraint);\n filterConstraintAddCallback && filterConstraintAddCallback({\n field: field,\n constraint: newConstraint\n });\n props.onFilterChange(filters);\n if (!getColumnProp('showApplyButton')) {\n props.onFilterApply();\n }\n };\n var removeConstraint = function removeConstraint(index) {\n var filterConstraintRemoveCallback = getColumnProp('onFilterConstraintRemove');\n var filters = _objectSpread$3({}, props.filters);\n var removedConstraint = filters[field].constraints.splice(index, 1);\n filterConstraintRemoveCallback && filterConstraintRemoveCallback({\n field: field,\n constraint: removedConstraint\n });\n props.onFilterChange(filters);\n if (!getColumnProp('showApplyButton')) {\n props.onFilterApply();\n }\n };\n var findNextItem = function findNextItem(item) {\n var nextItem = item.nextElementSibling;\n return nextItem ? DomHandler.hasClass(nextItem, 'p-column-filter-separator') ? findNextItem(nextItem) : nextItem : item.parentElement.firstElementChild;\n };\n var findPrevItem = function findPrevItem(item) {\n var prevItem = item.previousElementSibling;\n return prevItem ? DomHandler.hasClass(prevItem, 'p-column-filter-separator') ? findPrevItem(prevItem) : prevItem : item.parentElement.lastElementChild;\n };\n var hide = function hide() {\n setOverlayVisibleState(false);\n };\n var onContentClick = function onContentClick(event) {\n selfClick.current = true;\n OverlayService.emit('overlay-click', {\n originalEvent: event,\n target: overlayRef.current\n });\n };\n var onContentMouseDown = function onContentMouseDown() {\n selfClick.current = true;\n };\n var onOverlayEnter = function onOverlayEnter() {\n ZIndexUtils.set('overlay', overlayRef.current, PrimeReact.autoZIndex, PrimeReact.zIndex['overlay']);\n DomHandler.alignOverlay(overlayRef.current, iconRef.current, PrimeReact.appendTo, false);\n overlayEventListener.current = function (e) {\n if (!isOutsideClicked(e.target)) {\n selfClick.current = true;\n }\n };\n OverlayService.on('overlay-click', overlayEventListener.current);\n };\n var onOverlayEntered = function onOverlayEntered() {\n bindOverlayListener();\n };\n var onOverlayExit = function onOverlayExit() {\n onOverlayHide();\n };\n var onOverlayExited = function onOverlayExited() {\n ZIndexUtils.clear(overlayRef.current);\n };\n var onOverlayHide = function onOverlayHide() {\n unbindOverlayListener();\n OverlayService.off('overlay-click', overlayEventListener.current);\n overlayEventListener.current = null;\n selfClick.current = false;\n };\n var fieldConstraints = function fieldConstraints() {\n return filterModel ? filterModel.constraints || [filterModel] : [];\n };\n var operator = function operator() {\n return filterModel.operator;\n };\n var operatorOptions = function operatorOptions() {\n return [{\n label: localeOption('matchAll'),\n value: FilterOperator.AND\n }, {\n label: localeOption('matchAny'),\n value: FilterOperator.OR\n }];\n };\n var filterLabel = function filterLabel() {\n return localeOption('filter');\n };\n var noFilterLabel = function noFilterLabel() {\n return localeOption('noFilter');\n };\n var removeRuleButtonLabel = function removeRuleButtonLabel() {\n return localeOption('removeRule');\n };\n var addRuleButtonLabel = function addRuleButtonLabel() {\n return localeOption('addRule');\n };\n var clearButtonLabel = function clearButtonLabel() {\n return localeOption('clear');\n };\n var applyButtonLabel = function applyButtonLabel() {\n return localeOption('apply');\n };\n var filterCallback = function filterCallback(value) {\n var index = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;\n var filters = _objectSpread$3({}, props.filters);\n var meta = filters[field];\n props.display === 'menu' && meta && meta.operator ? filters[field].constraints[index].value = value : filters[field].value = value;\n props.onFilterChange(filters);\n };\n var filterApplyCallback = function filterApplyCallback() {\n for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {\n args[_key] = arguments[_key];\n }\n args && filterCallback(args[0], args[1]);\n props.onFilterApply();\n };\n useUpdateEffect(function () {\n if (props.display === 'menu' && overlayVisibleState) {\n DomHandler.alignOverlay(overlayRef.current, iconRef.current, PrimeReact.appendTo, false);\n }\n });\n useUnmountEffect(function () {\n if (overlayEventListener.current) {\n OverlayService.off('overlay-click', overlayEventListener.current);\n overlayEventListener.current = null;\n }\n if (overlayRef.current) {\n ZIndexUtils.clear(overlayRef.current);\n onOverlayHide();\n }\n });\n var createFilterElement = function createFilterElement(model, index) {\n var value = model ? model.value : null;\n return getColumnProp('filterElement') ? ObjectUtils.getJSXElement(getColumnProp('filterElement'), {\n field: field,\n index: index,\n filterModel: model,\n value: value,\n filterApplyCallback: filterApplyCallback,\n filterCallback: filterCallback\n }) : /*#__PURE__*/React.createElement(InputText, {\n type: getColumnProp('filterType'),\n value: value || '',\n onChange: function onChange(e) {\n return onInputChange(e, index);\n },\n onKeyDown: function onKeyDown(e) {\n return onInputKeydown(e);\n },\n className: \"p-column-filter\",\n placeholder: getColumnProp('filterPlaceholder'),\n maxLength: getColumnProp('filterMaxLength')\n });\n };\n var createRowFilterElement = function createRowFilterElement() {\n if (props.display === 'row') {\n var content = createFilterElement(filterModel, 0);\n return /*#__PURE__*/React.createElement(\"div\", {\n className: \"p-fluid p-column-filter-element\"\n }, content);\n }\n return null;\n };\n var createMenuFilterElement = function createMenuFilterElement(fieldConstraint, index) {\n return props.display === 'menu' ? createFilterElement(fieldConstraint, index) : null;\n };\n var createMenuButton = function createMenuButton() {\n if (showMenuButton()) {\n var _className = classNames('p-column-filter-menu-button p-link', {\n 'p-column-filter-menu-button-open': overlayVisibleState,\n 'p-column-filter-menu-button-active': hasFilter()\n });\n var label = filterLabel();\n return /*#__PURE__*/React.createElement(\"button\", {\n ref: iconRef,\n type: \"button\",\n className: _className,\n \"aria-haspopup\": true,\n \"aria-expanded\": overlayVisibleState,\n onClick: toggleMenu,\n onKeyDown: onToggleButtonKeyDown,\n \"aria-label\": label\n }, /*#__PURE__*/React.createElement(\"span\", {\n className: \"pi pi-filter-icon pi-filter\",\n \"aria-hidden\": \"true\"\n }), /*#__PURE__*/React.createElement(Ripple, null));\n }\n return null;\n };\n var createClearButton = function createClearButton() {\n if (getColumnProp('showClearButton') && props.display === 'row') {\n var _className2 = classNames('p-column-filter-clear-button p-link', {\n 'p-hidden-space': !hasRowFilter()\n });\n var clearLabel = clearButtonLabel();\n return /*#__PURE__*/React.createElement(\"button\", {\n className: _className2,\n type: \"button\",\n onClick: clearFilter,\n \"aria-label\": clearLabel\n }, /*#__PURE__*/React.createElement(\"span\", {\n className: \"pi pi-filter-slash\",\n \"aria-hidden\": \"true\"\n }), /*#__PURE__*/React.createElement(Ripple, null));\n }\n return null;\n };\n var createRowItems = function createRowItems() {\n if (isShowMatchModes()) {\n var _matchModes = matchModes();\n var _noFilterLabel = noFilterLabel();\n return /*#__PURE__*/React.createElement(\"ul\", {\n className: \"p-column-filter-row-items\"\n }, _matchModes.map(function (matchMode, i) {\n var value = matchMode.value,\n label = matchMode.label;\n var className = classNames('p-column-filter-row-item', {\n 'p-highlight': isRowMatchModeSelected(value)\n });\n var tabIndex = i === 0 ? 0 : null;\n return /*#__PURE__*/React.createElement(\"li\", {\n className: className,\n key: label,\n onClick: function onClick() {\n return onRowMatchModeChange(value);\n },\n onKeyDown: function onKeyDown(e) {\n return onRowMatchModeKeyDown(e, matchMode);\n },\n tabIndex: tabIndex\n }, label);\n }), /*#__PURE__*/React.createElement(\"li\", {\n className: \"p-column-filter-separator\"\n }), /*#__PURE__*/React.createElement(\"li\", {\n className: \"p-column-filter-row-item\",\n onClick: clearFilter,\n onKeyDown: function onKeyDown(e) {\n return onRowMatchModeKeyDown(e, null, true);\n }\n }, _noFilterLabel));\n }\n return null;\n };\n var createOperator = function createOperator() {\n if (isShowOperator()) {\n var options = operatorOptions();\n var value = operator();\n return /*#__PURE__*/React.createElement(\"div\", {\n className: \"p-column-filter-operator\"\n }, /*#__PURE__*/React.createElement(Dropdown, {\n options: options,\n value: value,\n onChange: onOperatorChange,\n className: \"p-column-filter-operator-dropdown\"\n }));\n }\n return null;\n };\n var createMatchModeDropdown = function createMatchModeDropdown(constraint, index) {\n if (isShowMatchModes()) {\n var options = matchModes();\n return /*#__PURE__*/React.createElement(Dropdown, {\n options: options,\n value: constraint.matchMode,\n onChange: function onChange(e) {\n return onMenuMatchModeChange(e.value, index);\n },\n className: \"p-column-filter-matchmode-dropdown\"\n });\n }\n return null;\n };\n var createRemoveButton = function createRemoveButton(index) {\n if (showRemoveIcon()) {\n var removeRuleLabel = removeRuleButtonLabel();\n return /*#__PURE__*/React.createElement(Button, {\n type: \"button\",\n icon: \"pi pi-trash\",\n className: \"p-column-filter-remove-button p-button-text p-button-danger p-button-sm\",\n onClick: function onClick() {\n return removeConstraint(index);\n },\n label: removeRuleLabel\n });\n }\n return null;\n };\n var createConstraints = function createConstraints() {\n var _fieldConstraints = fieldConstraints();\n return /*#__PURE__*/React.createElement(\"div\", {\n className: \"p-column-filter-constraints\"\n }, _fieldConstraints.map(function (fieldConstraint, i) {\n var matchModeDropdown = createMatchModeDropdown(fieldConstraint, i);\n var menuFilterElement = createMenuFilterElement(fieldConstraint, i);\n var removeButton = createRemoveButton(i);\n return /*#__PURE__*/React.createElement(\"div\", {\n key: i,\n className: \"p-column-filter-constraint\"\n }, matchModeDropdown, menuFilterElement, /*#__PURE__*/React.createElement(\"div\", null, removeButton));\n }));\n };\n var createAddRule = function createAddRule() {\n if (isShowAddConstraint()) {\n var addRuleLabel = addRuleButtonLabel();\n return /*#__PURE__*/React.createElement(\"div\", {\n className: \"p-column-filter-add-rule\"\n }, /*#__PURE__*/React.createElement(Button, {\n type: \"button\",\n label: addRuleLabel,\n icon: \"pi pi-plus\",\n className: \"p-column-filter-add-button p-button-text p-button-sm\",\n onClick: addConstraint\n }));\n }\n return null;\n };\n var createFilterClearButton = function createFilterClearButton() {\n if (getColumnProp('showClearButton')) {\n if (!getColumnProp('filterClear')) {\n var clearLabel = clearButtonLabel();\n return /*#__PURE__*/React.createElement(Button, {\n type: \"button\",\n className: \"p-button-outlined p-button-sm\",\n onClick: clearFilter,\n label: clearLabel\n });\n }\n return ObjectUtils.getJSXElement(getColumnProp('filterClear'), {\n field: field,\n filterModel: filterModel,\n filterClearCallback: clearFilter\n });\n }\n return null;\n };\n var createFilterApplyButton = function createFilterApplyButton() {\n if (getColumnProp('showApplyButton')) {\n if (!getColumnProp('filterApply')) {\n var applyLabel = applyButtonLabel();\n return /*#__PURE__*/React.createElement(Button, {\n type: \"button\",\n className: \"p-button-sm\",\n onClick: applyFilter,\n label: applyLabel\n });\n }\n return ObjectUtils.getJSXElement(getColumnProp('filterApply'), {\n field: field,\n filterModel: filterModel,\n filterApplyCallback: applyFilter\n });\n }\n return null;\n };\n var createButtonBar = function createButtonBar() {\n var clearButton = createFilterClearButton();\n var applyButton = createFilterApplyButton();\n return /*#__PURE__*/React.createElement(\"div\", {\n className: \"p-column-filter-buttonbar\"\n }, clearButton, applyButton);\n };\n var createItems = function createItems() {\n var operator = createOperator();\n var constraints = createConstraints();\n var addRule = createAddRule();\n var buttonBar = createButtonBar();\n return /*#__PURE__*/React.createElement(React.Fragment, null, operator, constraints, addRule, buttonBar);\n };\n var createOverlay = function createOverlay() {\n var style = getColumnProp('filterMenuStyle');\n var className = classNames('p-column-filter-overlay p-component p-fluid', getColumnProp('filterMenuClassName'), {\n 'p-column-filter-overlay-menu': props.display === 'menu',\n 'p-input-filled': PrimeReact.inputStyle === 'filled',\n 'p-ripple-disabled': PrimeReact.ripple === false\n });\n var filterHeader = ObjectUtils.getJSXElement(getColumnProp('filterHeader'), {\n field: field,\n filterModel: filterModel,\n filterApplyCallback: filterApplyCallback\n });\n var filterFooter = ObjectUtils.getJSXElement(getColumnProp('filterFooter'), {\n field: field,\n filterModel: filterModel,\n filterApplyCallback: filterApplyCallback\n });\n var items = props.display === 'row' ? createRowItems() : createItems();\n return /*#__PURE__*/React.createElement(Portal, null, /*#__PURE__*/React.createElement(CSSTransition, {\n nodeRef: overlayRef,\n classNames: \"p-connected-overlay\",\n \"in\": overlayVisibleState,\n timeout: {\n enter: 120,\n exit: 100\n },\n unmountOnExit: true,\n onEnter: onOverlayEnter,\n onEntered: onOverlayEntered,\n onExit: onOverlayExit,\n onExited: onOverlayExited\n }, /*#__PURE__*/React.createElement(\"div\", {\n ref: overlayRef,\n style: style,\n className: className,\n onKeyDown: onContentKeyDown,\n onClick: onContentClick,\n onMouseDown: onContentMouseDown\n }, filterHeader, items, filterFooter)));\n };\n var className = classNames('p-column-filter p-fluid', {\n 'p-column-filter-row': props.display === 'row',\n 'p-column-filter-menu': props.display === 'menu'\n });\n var rowFilterElement = createRowFilterElement();\n var menuButton = createMenuButton();\n var clearButton = createClearButton();\n var overlay = createOverlay();\n return /*#__PURE__*/React.createElement(\"div\", {\n className: className\n }, rowFilterElement, menuButton, clearButton, overlay);\n});\nColumnFilter.displayName = 'ColumnFilter';\n\nvar HeaderCheckbox = /*#__PURE__*/React.memo(function (props) {\n var _React$useState = React.useState(false),\n _React$useState2 = _slicedToArray(_React$useState, 2),\n focusedState = _React$useState2[0],\n setFocusedState = _React$useState2[1];\n var onFocus = function onFocus() {\n setFocusedState(true);\n };\n var onBlur = function onBlur() {\n setFocusedState(false);\n };\n var onClick = function onClick(event) {\n if (!props.disabled) {\n setFocusedState(true);\n props.onChange({\n originalEvent: event,\n checked: !props.checked\n });\n }\n };\n var onKeyDown = function onKeyDown(event) {\n if (event.code === 'Space') {\n onClick(event);\n event.preventDefault();\n }\n };\n var boxClassName = classNames('p-checkbox-box p-component', {\n 'p-highlight': props.checked,\n 'p-disabled': props.disabled,\n 'p-focus': focusedState\n });\n var iconClassName = classNames('p-checkbox-icon', {\n 'pi pi-check': props.checked\n });\n var tabIndex = props.disabled ? null : 0;\n return /*#__PURE__*/React.createElement(\"div\", {\n className: \"p-checkbox p-component\",\n onClick: onClick\n }, /*#__PURE__*/React.createElement(\"div\", {\n className: boxClassName,\n role: \"checkbox\",\n \"aria-checked\": props.checked,\n tabIndex: tabIndex,\n onFocus: onFocus,\n onBlur: onBlur,\n onKeyDown: onKeyDown\n }, /*#__PURE__*/React.createElement(\"span\", {\n className: iconClassName\n })));\n});\nHeaderCheckbox.displayName = 'HeaderCheckbox';\n\nfunction 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; }\nfunction _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; }\nvar HeaderCell = /*#__PURE__*/React.memo(function (props) {\n var _React$useState = React.useState({}),\n _React$useState2 = _slicedToArray(_React$useState, 2),\n styleObjectState = _React$useState2[0],\n setStyleObjectState = _React$useState2[1];\n var elementRef = React.useRef(null);\n var prevColumn = usePrevious(props.column);\n var isBadgeVisible = function isBadgeVisible() {\n return props.multiSortMeta && props.multiSortMeta.length > 1;\n };\n var isSortableDisabled = function isSortableDisabled() {\n return !getColumnProp('sortable') || getColumnProp('sortable') && (props.allSortableDisabled || getColumnProp('sortableDisabled'));\n };\n var getColumnProp = function getColumnProp() {\n for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {\n args[_key] = arguments[_key];\n }\n return props.column ? typeof args[0] === 'string' ? props.column.props[args[0]] : (args[0] || props.column).props[args[1]] : null;\n };\n var getStyle = function getStyle() {\n var headerStyle = getColumnProp('headerStyle');\n var columnStyle = getColumnProp('style');\n return getColumnProp('frozen') ? Object.assign({}, columnStyle, headerStyle, styleObjectState) : Object.assign({}, columnStyle, headerStyle);\n };\n var getMultiSortMetaIndex = function getMultiSortMetaIndex() {\n return props.multiSortMeta.findIndex(function (meta) {\n return meta.field === getColumnProp('field') || meta.field === getColumnProp('sortField');\n });\n };\n var getSortMeta = function getSortMeta() {\n var sorted = false;\n var sortOrder = 0;\n var metaIndex = -1;\n if (props.sortMode === 'single') {\n sorted = props.sortField && (props.sortField === getColumnProp('field') || props.sortField === getColumnProp('sortField'));\n sortOrder = sorted ? props.sortOrder : 0;\n } else if (props.sortMode === 'multiple') {\n metaIndex = getMultiSortMetaIndex();\n if (metaIndex > -1) {\n sorted = true;\n sortOrder = props.multiSortMeta[metaIndex].order;\n }\n }\n return {\n sorted: sorted,\n sortOrder: sortOrder,\n metaIndex: metaIndex\n };\n };\n var getAriaSort = function getAriaSort(_ref) {\n var sorted = _ref.sorted,\n sortOrder = _ref.sortOrder;\n if (getColumnProp('sortable')) {\n var sortIcon = sorted ? sortOrder < 0 ? 'pi-sort-amount-down' : 'pi-sort-amount-up-alt' : 'pi-sort-alt';\n if (sortIcon === 'pi-sort-amount-down') return 'descending';else if (sortIcon === 'pi-sort-amount-up-alt') return 'ascending';else return 'none';\n }\n return null;\n };\n var updateStickyPosition = function updateStickyPosition() {\n if (getColumnProp('frozen')) {\n var styleObject = _objectSpread$2({}, styleObjectState);\n var align = getColumnProp('alignFrozen');\n if (align === 'right') {\n var right = 0;\n var next = elementRef.current.nextElementSibling;\n if (next) {\n right = DomHandler.getOuterWidth(next) + parseFloat(next.style.right || 0);\n }\n styleObject['right'] = right + 'px';\n } else {\n var left = 0;\n var prev = elementRef.current.previousElementSibling;\n if (prev) {\n left = DomHandler.getOuterWidth(prev) + parseFloat(prev.style.left || 0);\n }\n styleObject['left'] = left + 'px';\n }\n var filterRow = elementRef.current.parentElement.nextElementSibling;\n if (filterRow) {\n var index = DomHandler.index(elementRef.current);\n filterRow.children[index].style.left = styleObject['left'];\n filterRow.children[index].style.right = styleObject['right'];\n }\n var isSameStyle = styleObjectState['left'] === styleObject['left'] && styleObjectState['right'] === styleObject['right'];\n !isSameStyle && setStyleObjectState(styleObject);\n }\n };\n var updateSortableDisabled = function updateSortableDisabled(prevColumn) {\n if (getColumnProp(prevColumn, 'sortableDisabled') !== getColumnProp('sortableDisabled') || getColumnProp(prevColumn, 'sortable') !== getColumnProp('sortable')) {\n props.onSortableChange();\n }\n };\n var onClick = function onClick(event) {\n if (!isSortableDisabled()) {\n var targetNode = event.target;\n 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')) {\n DomHandler.clearSelection();\n props.onSortChange({\n originalEvent: event,\n column: props.column,\n sortableDisabledFields: props.sortableDisabledFields\n });\n }\n }\n };\n var onMouseDown = function onMouseDown(event) {\n props.onColumnMouseDown({\n originalEvent: event,\n column: props.column\n });\n };\n var onKeyDown = function onKeyDown(event) {\n if (event.key === 'Enter' && event.currentTarget === elementRef.current && DomHandler.hasClass(event.currentTarget, 'p-sortable-column')) {\n onClick(event);\n event.preventDefault();\n }\n };\n var onDragStart = function onDragStart(event) {\n props.onColumnDragStart({\n originalEvent: event,\n column: props.column\n });\n };\n var onDragOver = function onDragOver(event) {\n props.onColumnDragOver({\n originalEvent: event,\n column: props.column\n });\n };\n var onDragLeave = function onDragLeave(event) {\n props.onColumnDragLeave({\n originalEvent: event,\n column: props.column\n });\n };\n var onDrop = function onDrop(event) {\n props.onColumnDrop({\n originalEvent: event,\n column: props.column\n });\n };\n var onResizerMouseDown = function onResizerMouseDown(event) {\n props.onColumnResizeStart({\n originalEvent: event,\n column: props.column\n });\n };\n var onResizerClick = function onResizerClick(event) {\n if (props.onColumnResizerClick) {\n props.onColumnResizerClick({\n originalEvent: event,\n element: event.currentTarget.parentElement,\n column: props.column\n });\n event.preventDefault();\n }\n };\n var onResizerDoubleClick = function onResizerDoubleClick(event) {\n if (props.onColumnResizerDoubleClick) {\n props.onColumnResizerDoubleClick({\n originalEvent: event,\n element: event.currentTarget.parentElement,\n column: props.column\n });\n event.preventDefault();\n }\n };\n React.useEffect(function () {\n if (getColumnProp('frozen')) {\n updateStickyPosition();\n }\n updateSortableDisabled(prevColumn);\n });\n var createResizer = function createResizer() {\n if (props.resizableColumns && !getColumnProp('frozen')) {\n return /*#__PURE__*/React.createElement(\"span\", {\n className: \"p-column-resizer\",\n onMouseDown: onResizerMouseDown,\n onClick: onResizerClick,\n onDoubleClick: onResizerDoubleClick\n });\n }\n return null;\n };\n var createTitle = function createTitle() {\n var title = ObjectUtils.getJSXElement(getColumnProp('header'), {\n props: props.tableProps\n });\n return /*#__PURE__*/React.createElement(\"span\", {\n className: \"p-column-title\"\n }, title);\n };\n var createSortIcon = function createSortIcon(_ref2) {\n var sorted = _ref2.sorted,\n sortOrder = _ref2.sortOrder;\n if (getColumnProp('sortable')) {\n var sortIcon = sorted ? sortOrder < 0 ? 'pi-sort-amount-down' : 'pi-sort-amount-up-alt' : 'pi-sort-alt';\n var className = classNames('p-sortable-column-icon pi pi-fw', sortIcon);\n return /*#__PURE__*/React.createElement(\"span\", {\n className: className\n });\n }\n return null;\n };\n var createBadge = function createBadge(_ref3) {\n var metaIndex = _ref3.metaIndex;\n if (metaIndex !== -1 && isBadgeVisible()) {\n var value = props.groupRowsBy && props.groupRowsBy === props.groupRowSortField ? metaIndex : metaIndex + 1;\n return /*#__PURE__*/React.createElement(\"span\", {\n className: \"p-sortable-column-badge\"\n }, value);\n }\n return null;\n };\n var createCheckbox = function createCheckbox() {\n if (props.showSelectAll && getColumnProp('selectionMode') === 'multiple' && props.filterDisplay !== 'row') {\n var allRowsSelected = props.allRowsSelected(props.value);\n return /*#__PURE__*/React.createElement(HeaderCheckbox, {\n checked: allRowsSelected,\n onChange: props.onColumnCheckboxChange,\n disabled: props.empty\n });\n }\n return null;\n };\n var createFilter = function createFilter() {\n if (props.filterDisplay === 'menu' && getColumnProp('filter')) {\n return /*#__PURE__*/React.createElement(ColumnFilter, {\n display: \"menu\",\n column: props.column,\n filters: props.filters,\n onFilterChange: props.onFilterChange,\n onFilterApply: props.onFilterApply,\n filtersStore: props.filtersStore\n });\n }\n return null;\n };\n var createHeader = function createHeader(sortMeta) {\n var title = createTitle();\n var sortIcon = createSortIcon(sortMeta);\n var badge = createBadge(sortMeta);\n var checkbox = createCheckbox();\n var filter = createFilter();\n return /*#__PURE__*/React.createElement(\"div\", {\n className: \"p-column-header-content\"\n }, title, sortIcon, badge, checkbox, filter);\n };\n var createElement = function createElement() {\n var _isSortableDisabled = isSortableDisabled();\n var sortMeta = getSortMeta();\n var style = getStyle();\n var align = getColumnProp('alignHeader') || getColumnProp('align');\n var frozen = getColumnProp('frozen');\n var className = classNames(getColumnProp('headerClassName'), getColumnProp('className'), _defineProperty({\n 'p-sortable-column': getColumnProp('sortable'),\n 'p-resizable-column': props.resizableColumns && getColumnProp('resizeable'),\n 'p-highlight': sortMeta.sorted,\n 'p-frozen-column': frozen,\n 'p-selection-column': getColumnProp('selectionMode'),\n 'p-sortable-disabled': getColumnProp('sortable') && _isSortableDisabled,\n 'p-reorderable-column': props.reorderableColumns && getColumnProp('reorderable') && !frozen\n }, \"p-align-\".concat(align), !!align));\n var tabIndex = getColumnProp('sortable') && !_isSortableDisabled ? props.tabIndex : null;\n var colSpan = getColumnProp('colSpan');\n var rowSpan = getColumnProp('rowSpan');\n var ariaSort = getAriaSort(sortMeta);\n var headerTooltip = getColumnProp('headerTooltip');\n var hasTooltip = ObjectUtils.isNotEmpty(headerTooltip);\n var headerTooltipOptions = getColumnProp('headerTooltipOptions');\n var resizer = createResizer();\n var header = createHeader(sortMeta);\n return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(\"th\", {\n ref: elementRef,\n style: style,\n className: className,\n tabIndex: tabIndex,\n role: \"columnheader\",\n onClick: onClick,\n onKeyDown: onKeyDown,\n onMouseDown: onMouseDown,\n onDragStart: onDragStart,\n onDragOver: onDragOver,\n onDragLeave: onDragLeave,\n onDrop: onDrop,\n colSpan: colSpan,\n rowSpan: rowSpan,\n \"aria-sort\": ariaSort\n }, resizer, header), hasTooltip && /*#__PURE__*/React.createElement(Tooltip, _extends({\n target: elementRef,\n content: headerTooltip\n }, headerTooltipOptions)));\n };\n var element = createElement();\n return element;\n});\nHeaderCell.displayName = 'HeaderCell';\n\nfunction 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; }\nfunction _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; }\nvar TableHeader = /*#__PURE__*/React.memo(function (props) {\n var _React$useState = React.useState([]),\n _React$useState2 = _slicedToArray(_React$useState, 2),\n sortableDisabledFieldsState = _React$useState2[0],\n setSortableDisabledFieldsState = _React$useState2[1];\n var _React$useState3 = React.useState(false),\n _React$useState4 = _slicedToArray(_React$useState3, 2),\n allSortableDisabledState = _React$useState4[0],\n setAllSortableDisabledState = _React$useState4[1];\n var isSingleSort = props.sortMode === 'single';\n var isMultipleSort = props.sortMode === 'multiple';\n var isAllSortableDisabled = isSingleSort && allSortableDisabledState;\n var isColumnSorted = function isColumnSorted(column) {\n return props.sortField !== null ? column.props.field === props.sortField || column.props.sortField === props.sortField : false;\n };\n var updateSortableDisabled = function updateSortableDisabled() {\n if (isSingleSort || isMultipleSort && props.onSortChange) {\n var sortableDisabledFields = [];\n var allSortableDisabled = false;\n props.columns.forEach(function (column) {\n if (column.props.sortableDisabled) {\n sortableDisabledFields.push(column.props.sortField || column.props.field);\n if (!allSortableDisabled && isColumnSorted(column)) {\n allSortableDisabled = true;\n }\n }\n });\n setSortableDisabledFieldsState(sortableDisabledFields);\n setAllSortableDisabledState(allSortableDisabled);\n }\n };\n var onSortableChange = function onSortableChange() {\n updateSortableDisabled();\n };\n var onCheckboxChange = function onCheckboxChange(e) {\n props.onColumnCheckboxChange(e, props.value);\n };\n useMountEffect(function () {\n updateSortableDisabled();\n });\n var createGroupHeaderCells = function createGroupHeaderCells(row) {\n var columns = React.Children.toArray(row.props.children);\n return createHeaderCells(columns);\n };\n var createHeaderCells = function createHeaderCells(columns) {\n return React.Children.map(columns, function (col, i) {\n var isVisible = col ? !col.props.hidden : true;\n var key = col ? col.props.columnKey || col.props.field || i : i;\n return isVisible && /*#__PURE__*/React.createElement(HeaderCell, {\n key: key,\n value: props.value,\n tableProps: props.tableProps,\n column: col,\n tabIndex: props.tabIndex,\n empty: props.empty,\n resizableColumns: props.resizableColumns,\n groupRowsBy: props.groupRowsBy,\n groupRowSortField: props.groupRowSortField,\n sortMode: props.sortMode,\n sortField: props.sortField,\n sortOrder: props.sortOrder,\n multiSortMeta: props.multiSortMeta,\n allSortableDisabled: isAllSortableDisabled,\n onSortableChange: onSortableChange,\n sortableDisabledFields: sortableDisabledFieldsState,\n filterDisplay: props.filterDisplay,\n filters: props.filters,\n filtersStore: props.filtersStore,\n onFilterChange: props.onFilterChange,\n onFilterApply: props.onFilterApply,\n onColumnMouseDown: props.onColumnMouseDown,\n onColumnDragStart: props.onColumnDragStart,\n onColumnDragOver: props.onColumnDragOver,\n onColumnDragLeave: props.onColumnDragLeave,\n onColumnDrop: props.onColumnDrop,\n onColumnResizeStart: props.onColumnResizeStart,\n onColumnResizerClick: props.onColumnResizerClick,\n onColumnResizerDoubleClick: props.onColumnResizerDoubleClick,\n showSelectAll: props.showSelectAll,\n allRowsSelected: props.allRowsSelected,\n onColumnCheckboxChange: onCheckboxChange,\n reorderableColumns: props.reorderableColumns,\n onSortChange: props.onSortChange\n });\n });\n };\n var createCheckbox = function createCheckbox(selectionMode) {\n if (props.showSelectAll && selectionMode === 'multiple') {\n var allRowsSelected = props.allRowsSelected(props.value);\n return /*#__PURE__*/React.createElement(HeaderCheckbox, {\n checked: allRowsSelected,\n onChange: onCheckboxChange,\n disabled: props.empty\n });\n }\n return null;\n };\n var createFilter = function createFilter(column, filter) {\n if (filter) {\n return /*#__PURE__*/React.createElement(ColumnFilter, {\n display: \"row\",\n column: column,\n filters: props.filters,\n filtersStore: props.filtersStore,\n onFilterChange: props.onFilterChange,\n onFilterApply: props.onFilterApply\n });\n }\n return null;\n };\n var createFilterCells = function createFilterCells() {\n return React.Children.map(props.columns, function (col, i) {\n var isVisible = !col.props.hidden;\n if (isVisible) {\n var _col$props = col.props,\n filterHeaderStyle = _col$props.filterHeaderStyle,\n style = _col$props.style,\n filterHeaderClassName = _col$props.filterHeaderClassName,\n className = _col$props.className,\n frozen = _col$props.frozen,\n columnKey = _col$props.columnKey,\n field = _col$props.field,\n selectionMode = _col$props.selectionMode,\n filter = _col$props.filter;\n var colStyle = _objectSpread$1(_objectSpread$1({}, filterHeaderStyle || {}), style || {});\n var colClassName = classNames('p-filter-column', filterHeaderClassName, className, {\n 'p-frozen-column': frozen\n });\n var colKey = columnKey || field || i;\n var checkbox = createCheckbox(selectionMode);\n var filterRow = createFilter(col, filter);\n return /*#__PURE__*/React.createElement(\"th\", {\n key: colKey,\n style: colStyle,\n className: colClassName\n }, checkbox, filterRow);\n }\n return null;\n });\n };\n var createContent = function createContent() {\n if (props.headerColumnGroup) {\n var rows = React.Children.toArray(props.headerColumnGroup.props.children);\n return rows.map(function (row, i) {\n return /*#__PURE__*/React.createElement(\"tr\", {\n key: i,\n role: \"row\"\n }, createGroupHeaderCells(row));\n });\n } else {\n var headerRow = /*#__PURE__*/React.createElement(\"tr\", {\n role: \"row\"\n }, createHeaderCells(props.columns));\n var filterRow = props.filterDisplay === 'row' && /*#__PURE__*/React.createElement(\"tr\", {\n role: \"row\"\n }, createFilterCells());\n return /*#__PURE__*/React.createElement(React.Fragment, null, headerRow, filterRow);\n }\n };\n var content = createContent();\n return /*#__PURE__*/React.createElement(\"thead\", {\n className: \"p-datatable-thead\"\n }, content);\n});\nTableHeader.displayName = 'TableHeader';\n\nfunction 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; }\nfunction _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; }\nvar DataTable = /*#__PURE__*/React.forwardRef(function (props, ref) {\n var _React$useState = React.useState(props.first),\n _React$useState2 = _slicedToArray(_React$useState, 2),\n firstState = _React$useState2[0],\n setFirstState = _React$useState2[1];\n var _React$useState3 = React.useState(props.rows),\n _React$useState4 = _slicedToArray(_React$useState3, 2),\n rowsState = _React$useState4[0],\n setRowsState = _React$useState4[1];\n var _React$useState5 = React.useState(props.sortField),\n _React$useState6 = _slicedToArray(_React$useState5, 2),\n sortFieldState = _React$useState6[0],\n setSortFieldState = _React$useState6[1];\n var _React$useState7 = React.useState(props.sortOrder),\n _React$useState8 = _slicedToArray(_React$useState7, 2),\n sortOrderState = _React$useState8[0],\n setSortOrderState = _React$useState8[1];\n var _React$useState9 = React.useState(props.multiSortMeta),\n _React$useState10 = _slicedToArray(_React$useState9, 2),\n multiSortMetaState = _React$useState10[0],\n setMultiSortMetaState = _React$useState10[1];\n var _React$useState11 = React.useState(props.filters),\n _React$useState12 = _slicedToArray(_React$useState11, 2),\n filtersState = _React$useState12[0],\n setFiltersState = _React$useState12[1];\n var _React$useState13 = React.useState([]),\n _React$useState14 = _slicedToArray(_React$useState13, 2),\n columnOrderState = _React$useState14[0],\n setColumnOrderState = _React$useState14[1];\n var _React$useState15 = React.useState(null),\n _React$useState16 = _slicedToArray(_React$useState15, 2),\n groupRowsSortMetaState = _React$useState16[0],\n setGroupRowsSortMetaState = _React$useState16[1];\n var _React$useState17 = React.useState({}),\n _React$useState18 = _slicedToArray(_React$useState17, 2),\n editingMetaState = _React$useState18[0],\n setEditingMetaState = _React$useState18[1];\n var _React$useState19 = React.useState(null),\n _React$useState20 = _slicedToArray(_React$useState19, 2),\n attributeSelectorState = _React$useState20[0],\n setAttributeSelectorState = _React$useState20[1];\n var _React$useState21 = React.useState(props.rows),\n _React$useState22 = _slicedToArray(_React$useState21, 2),\n d_rowsState = _React$useState22[0],\n setD_rowsState = _React$useState22[1];\n var _React$useState23 = React.useState({}),\n _React$useState24 = _slicedToArray(_React$useState23, 2),\n d_filtersState = _React$useState24[0],\n setD_filtersState = _React$useState24[1];\n var elementRef = React.useRef(null);\n var tableRef = React.useRef(null);\n var wrapperRef = React.useRef(null);\n var bodyRef = React.useRef(null);\n var frozenBodyRef = React.useRef(null);\n var virtualScrollerRef = React.useRef(null);\n var reorderIndicatorUpRef = React.useRef(null);\n var reorderIndicatorDownRef = React.useRef(null);\n var colReorderIconWidth = React.useRef(null);\n var colReorderIconHeight = React.useRef(null);\n var resizeHelperRef = React.useRef(null);\n var draggedColumnElement = React.useRef(null);\n var draggedColumn = React.useRef(null);\n var dropPosition = React.useRef(null);\n var styleElement = React.useRef(null);\n var responsiveStyleElement = React.useRef(null);\n var columnWidthsState = React.useRef(null);\n var tableWidthState = React.useRef(null);\n var resizeColumn = React.useRef(null);\n var resizeColumnElement = React.useRef(null);\n var columnResizing = React.useRef(false);\n var lastResizeHelperX = React.useRef(null);\n var columnSortable = React.useRef(false);\n var columnSortFunction = React.useRef(null);\n var columnField = React.useRef(null);\n var filterTimeout = React.useRef(null);\n if (props.rows !== d_rowsState && !props.onPage) {\n setRowsState(props.rows);\n setD_rowsState(props.rows);\n }\n var _useEventListener = useEventListener({\n type: 'mousemove',\n listener: function listener(event) {\n if (columnResizing.current) {\n onColumnResize(event);\n }\n }\n }),\n _useEventListener2 = _slicedToArray(_useEventListener, 2),\n bindDocumentMouseMoveListener = _useEventListener2[0],\n unbindDocumentMouseMoveListener = _useEventListener2[1];\n var _useEventListener3 = useEventListener({\n type: 'mouseup',\n listener: function listener() {\n if (columnResizing.current) {\n columnResizing.current = false;\n onColumnResizeEnd();\n }\n }\n }),\n _useEventListener4 = _slicedToArray(_useEventListener3, 2),\n bindDocumentMouseUpListener = _useEventListener4[0],\n unbindDocumentMouseUpListener = _useEventListener4[1];\n var isCustomStateStorage = function isCustomStateStorage() {\n return props.stateStorage === 'custom';\n };\n var isStateful = function isStateful() {\n return props.stateKey != null || isCustomStateStorage();\n };\n var isVirtualScrollerDisabled = function isVirtualScrollerDisabled() {\n return ObjectUtils.isEmpty(props.virtualScrollerOptions) || !props.scrollable;\n };\n var isEquals = function isEquals(data1, data2) {\n return props.compareSelectionBy === 'equals' ? data1 === data2 : ObjectUtils.equals(data1, data2, props.dataKey);\n };\n var hasFilter = function hasFilter() {\n return ObjectUtils.isNotEmpty(getFilters()) || props.globalFilter;\n };\n var getFirst = function getFirst() {\n return props.onPage ? props.first : firstState;\n };\n var getRows = function getRows() {\n return props.onPage ? props.rows : rowsState;\n };\n var getSortField = function getSortField() {\n return props.onSort ? props.sortField : sortFieldState;\n };\n var getSortOrder = function getSortOrder() {\n return props.onSort ? props.sortOrder : sortOrderState;\n };\n var getMultiSortMeta = function getMultiSortMeta() {\n return (props.onSort ? props.multiSortMeta : multiSortMetaState) || [];\n };\n var getFilters = function getFilters() {\n return props.onFilter ? props.filters : filtersState;\n };\n var getColumnProp = function getColumnProp(col, prop) {\n return col.props[prop];\n };\n var getColumns = function getColumns(ignoreReorderable) {\n var columns = React.Children.toArray(props.children);\n if (!columns) {\n return null;\n }\n if (!ignoreReorderable && props.reorderableColumns && columnOrderState) {\n var orderedColumns = columnOrderState.reduce(function (arr, columnKey) {\n var column = findColumnByKey(columns, columnKey);\n column && arr.push(column);\n return arr;\n }, []);\n return [].concat(_toConsumableArray(orderedColumns), _toConsumableArray(columns.filter(function (col) {\n return orderedColumns.indexOf(col) < 0;\n })));\n }\n return columns;\n };\n var getStorage = function getStorage() {\n switch (props.stateStorage) {\n case 'local':\n return window.localStorage;\n case 'session':\n return window.sessionStorage;\n case 'custom':\n return null;\n default:\n throw new Error(props.stateStorage + ' is not a valid value for the state storage, supported values are \"local\", \"session\" and \"custom\".');\n }\n };\n var saveState = function saveState() {\n var state = {};\n if (props.paginator) {\n state.first = getFirst();\n state.rows = getRows();\n }\n var sortField = getSortField();\n if (sortField) {\n state.sortField = sortField;\n state.sortOrder = getSortOrder();\n }\n var multiSortMeta = getMultiSortMeta();\n if (multiSortMeta) {\n state.multiSortMeta = multiSortMeta;\n }\n if (hasFilter()) {\n state.filters = getFilters();\n }\n if (props.resizableColumns) {\n saveColumnWidths(state);\n }\n if (props.reorderableColumns) {\n state.columnOrder = columnOrderState;\n }\n if (props.expandedRows) {\n state.expandedRows = props.expandedRows;\n }\n if (props.selection && props.onSelectionChange) {\n state.selection = props.selection;\n }\n if (isCustomStateStorage()) {\n if (props.customSaveState) {\n props.customSaveState(state);\n }\n } else {\n var storage = getStorage();\n if (ObjectUtils.isNotEmpty(state)) {\n storage.setItem(props.stateKey, JSON.stringify(state));\n }\n }\n if (props.onStateSave) {\n props.onStateSave(state);\n }\n };\n var clearState = function clearState() {\n var storage = getStorage();\n if (storage && props.stateKey) {\n storage.removeItem(props.stateKey);\n }\n };\n var restoreState = function restoreState() {\n var restoredState = {};\n if (isCustomStateStorage()) {\n if (props.customRestoreState) {\n restoredState = props.customRestoreState();\n }\n } else {\n var storage = getStorage();\n var stateString = storage.getItem(props.stateKey);\n var dateFormat = /\\d{4}-\\d{2}-\\d{2}T\\d{2}:\\d{2}:\\d{2}.\\d{3}Z/;\n var reviver = function reviver(key, value) {\n return typeof value === 'string' && dateFormat.test(value) ? new Date(value) : value;\n };\n if (stateString) {\n restoredState = JSON.parse(stateString, reviver);\n }\n }\n _restoreState(restoredState);\n };\n var restoreTableState = function restoreTableState(restoredState) {\n _restoreState(restoredState);\n };\n var _restoreState = function _restoreState() {\n var restoredState = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};\n if (ObjectUtils.isNotEmpty(restoredState)) {\n if (props.paginator) {\n if (props.onPage) {\n var getOnPageParams = function getOnPageParams(first, rows) {\n var totalRecords = getTotalRecords(processedData());\n var pageCount = Math.ceil(totalRecords / rows) || 1;\n var page = Math.floor(first / rows);\n return {\n first: first,\n rows: rows,\n page: page,\n pageCount: pageCount\n };\n };\n props.onPage(createEvent(getOnPageParams(restoredState.first, restoredState.rows)));\n } else {\n setFirstState(restoredState.first);\n setRowsState(restoredState.rows);\n }\n }\n if (restoredState.sortField) {\n if (props.onSort) {\n props.onSort(createEvent({\n sortField: restoredState.sortField,\n sortOrder: restoredState.sortOrder\n }));\n } else {\n setSortFieldState(restoredState.sortField);\n setSortOrderState(restoredState.sortOrder);\n }\n }\n if (restoredState.multiSortMeta) {\n if (props.onSort) {\n props.onSort(createEvent({\n multiSortMeta: restoredState.multiSortMeta\n }));\n } else {\n setMultiSortMetaState(restoredState.multiSortMeta);\n }\n }\n if (restoredState.filters) {\n setD_filtersState(cloneFilters(restoredState.filters));\n if (props.onFilter) {\n props.onFilter(createEvent({\n filters: restoredState.filters\n }));\n } else {\n setFiltersState(cloneFilters(restoredState.filters));\n }\n }\n if (props.resizableColumns) {\n columnWidthsState.current = restoredState.columnWidths;\n tableWidthState.current = restoredState.tableWidth;\n restoreColumnWidths();\n }\n if (props.reorderableColumns) {\n setColumnOrderState(restoredState.columnOrder);\n }\n if (restoredState.expandedRows && props.onRowToggle) {\n props.onRowToggle({\n data: restoredState.expandedRows\n });\n }\n if (restoredState.selection && props.onSelectionChange) {\n props.onSelectionChange({\n value: restoredState.selection\n });\n }\n if (props.onStateRestore) {\n props.onStateRestore(restoredState);\n }\n }\n };\n var saveColumnWidths = function saveColumnWidths(state) {\n var widths = [];\n var headers = DomHandler.find(elementRef.current, '.p-datatable-thead > tr > th');\n headers.forEach(function (header) {\n return widths.push(DomHandler.getOuterWidth(header));\n });\n state.columnWidths = widths.join(',');\n if (props.columnResizeMode === 'expand') {\n state.tableWidth = DomHandler.getOuterWidth(tableRef.current) + 'px';\n }\n };\n var restoreColumnWidths = function restoreColumnWidths() {\n if (columnWidthsState.current) {\n var widths = columnWidthsState.current.split(',');\n if (props.columnResizeMode === 'expand' && tableWidthState.current) {\n tableRef.current.style.width = tableWidthState.current;\n tableRef.current.style.minWidth = tableWidthState.current;\n elementRef.current.style.width = tableWidthState.current;\n }\n if (ObjectUtils.isNotEmpty(widths)) {\n createStyleElement();\n var innerHTML = '';\n widths.forEach(function (width, index) {\n var style = props.scrollable ? \"flex: 1 1 \".concat(width, \"px !important\") : \"width: \".concat(width, \"px !important\");\n innerHTML += \"\\n .p-datatable[\".concat(attributeSelectorState, \"] .p-datatable-thead > tr > th:nth-child(\").concat(index + 1, \"),\\n .p-datatable[\").concat(attributeSelectorState, \"] .p-datatable-tbody > tr > td:nth-child(\").concat(index + 1, \"),\\n .p-datatable[\").concat(attributeSelectorState, \"] .p-datatable-tfoot > tr > td:nth-child(\").concat(index + 1, \") {\\n \").concat(style, \"\\n }\\n \");\n });\n styleElement.current.innerHTML = innerHTML;\n }\n }\n };\n var findParentHeader = function findParentHeader(element) {\n if (element.nodeName === 'TH') {\n return element;\n } else {\n var parent = element.parentElement;\n while (parent.nodeName !== 'TH') {\n parent = parent.parentElement;\n if (!parent) break;\n }\n return parent;\n }\n };\n var getGroupRowSortField = function getGroupRowSortField() {\n return props.sortMode === 'single' ? props.sortField : groupRowsSortMetaState ? groupRowsSortMetaState.field : null;\n };\n var getSelectableData = function getSelectableData(val) {\n if (props.showSelectionElement || props.isDataSelectable) {\n return val.filter(function (data, index) {\n var isSelectable = true;\n if (props.showSelectionElement) isSelectable = props.showSelectionElement({\n rowIndex: index,\n props: props\n });\n if (props.isDataSelectable && isSelectable) isSelectable = props.isDataSelectable({\n data: data,\n index: index\n });\n return isSelectable;\n });\n }\n return val;\n };\n var allRowsSelected = function allRowsSelected(processedData) {\n if (props.onSelectAllChange) {\n return props.selectAll;\n } else {\n var _data = props.selectionPageOnly ? dataToRender(processedData) : processedData;\n var val = props.frozenValue ? [].concat(_toConsumableArray(props.frozenValue), _toConsumableArray(_data)) : _data;\n var selectableVal = getSelectableData(val);\n return selectableVal && props.selection && selectableVal.every(function (sv) {\n return props.selection.some(function (s) {\n return isEquals(s, sv);\n });\n });\n }\n };\n var getSelectionModeInColumn = function getSelectionModeInColumn(columns) {\n if (columns) {\n var col = columns.find(function (c) {\n return !!c.props.selectionMode;\n });\n return col ? col.props.selectionMode : null;\n }\n return null;\n };\n var findColumnByKey = function findColumnByKey(columns, key) {\n return ObjectUtils.isNotEmpty(columns) ? columns.find(function (col) {\n return col.props.columnKey === key || col.props.field === key;\n }) : null;\n };\n var getTotalRecords = function getTotalRecords(data) {\n return props.lazy ? props.totalRecords : data ? data.length : 0;\n };\n var onEditingMetaChange = function onEditingMetaChange(e) {\n var rowData = e.rowData,\n field = e.field,\n editingKey = e.editingKey;\n e.rowIndex;\n var editing = e.editing;\n var editingMeta = _objectSpread({}, editingMetaState);\n var meta = editingMeta[editingKey];\n if (editing) {\n !meta && (meta = editingMeta[editingKey] = {\n data: _objectSpread({}, rowData),\n fields: []\n });\n meta['fields'].push(field);\n } else if (meta) {\n var fields = meta['fields'].filter(function (f) {\n return f !== field;\n });\n !fields.length ? delete editingMeta[editingKey] : meta['fields'] = fields;\n }\n setEditingMetaState(editingMeta);\n };\n var clearEditingMetaData = function clearEditingMetaData() {\n if (props.editMode && ObjectUtils.isNotEmpty(editingMetaState)) {\n setEditingMetaState({});\n }\n };\n var onColumnResizeStart = function onColumnResizeStart(e) {\n var event = e.originalEvent,\n column = e.column;\n var containerLeft = DomHandler.getOffset(elementRef.current).left;\n resizeColumn.current = column;\n resizeColumnElement.current = event.currentTarget.parentElement;\n columnResizing.current = true;\n lastResizeHelperX.current = event.pageX - containerLeft + elementRef.current.scrollLeft;\n bindColumnResizeEvents();\n };\n var onColumnResize = function onColumnResize(event) {\n var containerLeft = DomHandler.getOffset(elementRef.current).left;\n DomHandler.addClass(elementRef.current, 'p-unselectable-text');\n resizeHelperRef.current.style.height = elementRef.current.offsetHeight + 'px';\n resizeHelperRef.current.style.top = 0 + 'px';\n resizeHelperRef.current.style.left = event.pageX - containerLeft + elementRef.current.scrollLeft + 'px';\n resizeHelperRef.current.style.display = 'block';\n };\n var onColumnResizeEnd = function onColumnResizeEnd() {\n var delta = resizeHelperRef.current.offsetLeft - lastResizeHelperX.current;\n var columnWidth = resizeColumnElement.current.offsetWidth;\n var newColumnWidth = columnWidth + delta;\n var minWidth = resizeColumnElement.current.style.minWidth || 15;\n if (columnWidth + delta > parseInt(minWidth, 10)) {\n if (props.columnResizeMode === 'fit') {\n var nextColumn = resizeColumnElement.current.nextElementSibling;\n var nextColumnWidth = nextColumn.offsetWidth - delta;\n if (newColumnWidth > 15 && nextColumnWidth > 15) {\n resizeTableCells(newColumnWidth, nextColumnWidth);\n }\n } else if (props.columnResizeMode === 'expand') {\n var tableWidth = tableRef.current.offsetWidth + delta + 'px';\n var updateTableWidth = function updateTableWidth(el) {\n !!el && (el.style.width = el.style.minWidth = tableWidth);\n };\n updateTableWidth(tableRef.current);\n if (!isVirtualScrollerDisabled()) {\n updateTableWidth(bodyRef.current);\n updateTableWidth(frozenBodyRef.current);\n if (wrapperRef.current) {\n updateTableWidth(DomHandler.findSingle(wrapperRef.current, '.p-virtualscroller-content'));\n }\n }\n resizeTableCells(newColumnWidth);\n }\n if (props.onColumnResizeEnd) {\n props.onColumnResizeEnd({\n element: resizeColumnElement.current,\n column: resizeColumn.current,\n delta: delta\n });\n }\n if (isStateful()) {\n saveState();\n }\n }\n resizeHelperRef.current.style.display = 'none';\n resizeColumn.current = null;\n resizeColumnElement.current = null;\n DomHandler.removeClass(elementRef.current, 'p-unselectable-text');\n unbindColumnResizeEvents();\n };\n var resizeTableCells = function resizeTableCells(newColumnWidth, nextColumnWidth) {\n var widths = [];\n var colIndex = DomHandler.index(resizeColumnElement.current);\n var headers = DomHandler.find(tableRef.current, '.p-datatable-thead > tr > th');\n headers.forEach(function (header) {\n return widths.push(DomHandler.getOuterWidth(header));\n });\n destroyStyleElement();\n createStyleElement();\n var innerHTML = '';\n widths.forEach(function (width, index) {\n var colWidth = index === colIndex ? newColumnWidth : nextColumnWidth && index === colIndex + 1 ? nextColumnWidth : width;\n var style = props.scrollable ? \"flex: 1 1 \".concat(colWidth, \"px !important\") : \"width: \".concat(colWidth, \"px !important\");\n innerHTML += \"\\n .p-datatable[\".concat(attributeSelectorState, \"] .p-datatable-thead > tr > th:nth-child(\").concat(index + 1, \"),\\n .p-datatable[\").concat(attributeSelectorState, \"] .p-datatable-tbody > tr > td:nth-child(\").concat(index + 1, \"),\\n .p-datatable[\").concat(attributeSelectorState, \"] .p-datatable-tfoot > tr > td:nth-child(\").concat(index + 1, \") {\\n \").concat(style, \"\\n }\\n \");\n });\n styleElement.current.innerHTML = innerHTML;\n };\n var bindColumnResizeEvents = function bindColumnResizeEvents() {\n bindDocumentMouseMoveListener();\n bindDocumentMouseUpListener();\n };\n var unbindColumnResizeEvents = function unbindColumnResizeEvents() {\n unbindDocumentMouseMoveListener();\n unbindDocumentMouseUpListener();\n };\n var onColumnHeaderMouseDown = function onColumnHeaderMouseDown(e) {\n DomHandler.clearSelection();\n var event = e.originalEvent,\n column = e.column;\n if (props.reorderableColumns && getColumnProp(column, 'reorderable') !== false && !getColumnProp(column, 'frozen')) {\n 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;\n }\n };\n var onColumnHeaderCheckboxChange = function onColumnHeaderCheckboxChange(e, processedData) {\n if (props.onSelectAllChange) {\n props.onSelectAllChange(e);\n } else {\n var originalEvent = e.originalEvent,\n checked = e.checked;\n var _data2 = props.selectionPageOnly ? dataToRender(processedData) : processedData;\n var selection = props.selectionPageOnly && props.selection ? props.selection.filter(function (s) {\n return !_data2.some(function (d) {\n return isEquals(s, d);\n });\n }) : [];\n if (checked) {\n selection = props.frozenValue ? [].concat(_toConsumableArray(selection), _toConsumableArray(props.frozenValue), _toConsumableArray(_data2)) : [].concat(_toConsumableArray(selection), _toConsumableArray(_data2));\n selection = getSelectableData(selection);\n props.onAllRowsSelect && props.onAllRowsSelect({\n originalEvent: originalEvent,\n data: selection,\n type: 'all'\n });\n } else {\n props.onAllRowsUnselect && props.onAllRowsUnselect({\n originalEvent: originalEvent,\n data: selection,\n type: 'all'\n });\n }\n if (props.onSelectionChange) {\n props.onSelectionChange({\n originalEvent: originalEvent,\n value: selection,\n type: 'all'\n });\n }\n }\n };\n var onColumnHeaderDragStart = function onColumnHeaderDragStart(e) {\n var event = e.originalEvent,\n column = e.column;\n if (columnResizing.current) {\n event.preventDefault();\n return;\n }\n if (!props.reorderableColumns) return;\n colReorderIconWidth.current = DomHandler.getHiddenElementOuterWidth(reorderIndicatorUpRef.current);\n colReorderIconHeight.current = DomHandler.getHiddenElementOuterHeight(reorderIndicatorUpRef.current);\n draggedColumn.current = column;\n draggedColumnElement.current = findParentHeader(event.currentTarget);\n event.dataTransfer.setData('text', 'b'); // Firefox requires this to make dragging possible\n };\n\n var onColumnHeaderDragOver = function onColumnHeaderDragOver(e) {\n var event = e.originalEvent,\n column = e.column;\n var dropHeader = findParentHeader(event.currentTarget);\n if (props.reorderableColumns && draggedColumnElement.current && dropHeader && !getColumnProp(column, 'frozen')) {\n event.preventDefault();\n if (draggedColumnElement.current !== dropHeader) {\n var containerOffset = DomHandler.getOffset(elementRef.current);\n var dropHeaderOffset = DomHandler.getOffset(dropHeader);\n var targetLeft = dropHeaderOffset.left - containerOffset.left;\n var columnCenter = dropHeaderOffset.left + dropHeader.offsetWidth / 2;\n reorderIndicatorUpRef.current.style.top = dropHeaderOffset.top - containerOffset.top - (colReorderIconHeight.current - 1) + 'px';\n reorderIndicatorDownRef.current.style.top = dropHeaderOffset.top - containerOffset.top + dropHeader.offsetHeight + 'px';\n if (event.pageX > columnCenter) {\n reorderIndicatorUpRef.current.style.left = targetLeft + dropHeader.offsetWidth - Math.ceil(colReorderIconWidth.current / 2) + 'px';\n reorderIndicatorDownRef.current.style.left = targetLeft + dropHeader.offsetWidth - Math.ceil(colReorderIconWidth.current / 2) + 'px';\n dropPosition.current = 1;\n } else {\n reorderIndicatorUpRef.current.style.left = targetLeft - Math.ceil(colReorderIconWidth.current / 2) + 'px';\n reorderIndicatorDownRef.current.style.left = targetLeft - Math.ceil(colReorderIconWidth.current / 2) + 'px';\n dropPosition.current = -1;\n }\n reorderIndicatorUpRef.current.style.display = 'block';\n reorderIndicatorDownRef.current.style.display = 'block';\n }\n }\n };\n var onColumnHeaderDragLeave = function onColumnHeaderDragLeave(e) {\n var event = e.originalEvent;\n if (props.reorderableColumns && draggedColumnElement.current) {\n event.preventDefault();\n reorderIndicatorUpRef.current.style.display = 'none';\n reorderIndicatorDownRef.current.style.display = 'none';\n }\n };\n var onColumnHeaderDrop = function onColumnHeaderDrop(e) {\n var event = e.originalEvent,\n column = e.column;\n event.preventDefault();\n if (draggedColumnElement.current) {\n var dragIndex = DomHandler.index(draggedColumnElement.current);\n var dropIndex = DomHandler.index(findParentHeader(event.currentTarget));\n var allowDrop = dragIndex !== dropIndex;\n if (allowDrop && (dropIndex - dragIndex === 1 && dropPosition.current === -1 || dragIndex - dropIndex === 1 && dropPosition.current === 1)) {\n allowDrop = false;\n }\n if (allowDrop) {\n var _columns = getColumns();\n var isSameColumn = function isSameColumn(col1, col2) {\n return col1.props.columnKey || col2.props.columnKey ? ObjectUtils.equals(col1.props, col2.props, 'columnKey') : ObjectUtils.equals(col1.props, col2.props, 'field');\n };\n var dragColIndex = _columns.findIndex(function (child) {\n return isSameColumn(child, draggedColumn.current);\n });\n var dropColIndex = _columns.findIndex(function (child) {\n return isSameColumn(child, column);\n });\n if (dropColIndex < dragColIndex && dropPosition.current === 1) {\n dropColIndex++;\n }\n if (dropColIndex > dragColIndex && dropPosition.current === -1) {\n dropColIndex--;\n }\n ObjectUtils.reorderArray(_columns, dragColIndex, dropColIndex);\n var columnOrder = _columns.reduce(function (orders, col) {\n orders.push(col.props.columnKey || col.props.field);\n return orders;\n }, []);\n setColumnOrderState(columnOrder);\n if (props.onColReorder) {\n props.onColReorder({\n originalEvent: event,\n dragIndex: dragColIndex,\n dropIndex: dropColIndex,\n columns: _columns\n });\n }\n }\n reorderIndicatorUpRef.current.style.display = 'none';\n reorderIndicatorDownRef.current.style.display = 'none';\n draggedColumnElement.current.draggable = false;\n draggedColumnElement.current = null;\n draggedColumn.current = null;\n dropPosition.current = null;\n }\n };\n var createStyleElement = function createStyleElement() {\n styleElement.current = DomHandler.createInlineStyle(PrimeReact.nonce);\n };\n var createResponsiveStyle = function createResponsiveStyle() {\n if (!responsiveStyleElement.current) {\n responsiveStyleElement.current = DomHandler.createInlineStyle(PrimeReact.nonce);\n var innerHTML = \"\\n@media screen and (max-width: \".concat(props.breakpoint, \") {\\n .p-datatable[\").concat(attributeSelectorState, \"] .p-datatable-thead > tr > th,\\n .p-datatable[\").concat(attributeSelectorState, \"] .p-datatable-tfoot > tr > td {\\n display: none !important;\\n }\\n\\n .p-datatable[\").concat(attributeSelectorState, \"] .p-datatable-tbody > tr > td {\\n display: flex;\\n width: 100% !important;\\n align-items: center;\\n justify-content: space-between;\\n }\\n\\n .p-datatable[\").concat(attributeSelectorState, \"] .p-datatable-tbody > tr > td:not(:last-child) {\\n border: 0 none;\\n }\\n\\n .p-datatable[\").concat(attributeSelectorState, \"].p-datatable-gridlines .p-datatable-tbody > tr > td:last-child {\\n border-top: 0;\\n border-right: 0;\\n border-left: 0;\\n }\\n\\n .p-datatable[\").concat(attributeSelectorState, \"] .p-datatable-tbody > tr > td > .p-column-title {\\n display: block;\\n }\\n}\\n\");\n responsiveStyleElement.current.innerHTML = innerHTML;\n }\n };\n var destroyResponsiveStyle = function destroyResponsiveStyle() {\n responsiveStyleElement.current = DomHandler.removeInlineStyle(responsiveStyleElement.current);\n };\n var destroyStyleElement = function destroyStyleElement() {\n styleElement.current = DomHandler.removeInlineStyle(styleElement.current);\n };\n var onPageChange = function onPageChange(e) {\n clearEditingMetaData();\n if (props.onPage) {\n props.onPage(createEvent(e));\n } else {\n setFirstState(e.first);\n setRowsState(e.rows);\n }\n if (props.onValueChange) {\n props.onValueChange(processedData());\n }\n };\n var onSortChange = function onSortChange(e) {\n clearEditingMetaData();\n var event = e.originalEvent,\n column = e.column,\n sortableDisabledFields = e.sortableDisabledFields;\n var sortField = column.props.sortField || column.props.field;\n var sortOrder = props.defaultSortOrder;\n var multiSortMeta;\n var eventMeta;\n columnSortable.current = column.props.sortable;\n columnSortFunction.current = column.props.sortFunction;\n columnField.current = sortField;\n if (props.sortMode === 'multiple') {\n var metaKey = event.metaKey || event.ctrlKey;\n multiSortMeta = _toConsumableArray(getMultiSortMeta());\n var sortMeta = multiSortMeta.find(function (sortMeta) {\n return sortMeta.field === sortField;\n });\n sortOrder = sortMeta ? getCalculatedSortOrder(sortMeta.order) : sortOrder;\n var newMetaData = {\n field: sortField,\n order: sortOrder\n };\n if (sortOrder) {\n multiSortMeta = metaKey ? multiSortMeta : multiSortMeta.filter(function (meta) {\n return sortableDisabledFields.some(function (field) {\n return field === meta.field;\n });\n });\n addSortMeta(newMetaData, multiSortMeta);\n } else if (props.removableSort) {\n removeSortMeta(newMetaData, multiSortMeta);\n }\n eventMeta = {\n multiSortMeta: multiSortMeta\n };\n } else {\n sortOrder = getSortField() === sortField ? getCalculatedSortOrder(getSortOrder()) : sortOrder;\n if (props.removableSort) {\n sortField = sortOrder ? sortField : null;\n }\n eventMeta = {\n sortField: sortField,\n sortOrder: sortOrder\n };\n }\n if (props.onSort) {\n props.onSort(createEvent(eventMeta));\n } else {\n setFirstState(0);\n setSortFieldState(eventMeta.sortField);\n setSortOrderState(eventMeta.sortOrder);\n setMultiSortMetaState(eventMeta.multiSortMeta);\n }\n if (props.onValueChange) {\n props.onValueChange(processedData({\n sortField: sortField,\n sortOrder: sortOrder,\n multiSortMeta: multiSortMeta\n }));\n }\n };\n var getCalculatedSortOrder = function getCalculatedSortOrder(currentOrder) {\n return props.removableSort ? props.defaultSortOrder === currentOrder ? currentOrder * -1 : 0 : currentOrder * -1;\n };\n var compareValuesOnSort = function compareValuesOnSort(value1, value2, order) {\n return ObjectUtils.sort(value1, value2, order, PrimeReact.locale, PrimeReact.nullSortOrder);\n };\n var addSortMeta = function addSortMeta(meta, multiSortMeta) {\n var index = multiSortMeta.findIndex(function (sortMeta) {\n return sortMeta.field === meta.field;\n });\n if (index >= 0) multiSortMeta[index] = meta;else multiSortMeta.push(meta);\n };\n var removeSortMeta = function removeSortMeta(meta, multiSortMeta) {\n var index = multiSortMeta.findIndex(function (sortMeta) {\n return sortMeta.field === meta.field;\n });\n if (index >= 0) {\n multiSortMeta.splice(index, 1);\n }\n multiSortMeta = multiSortMeta.length > 0 ? multiSortMeta : null;\n };\n var sortSingle = function sortSingle(data, field, order) {\n if (props.groupRowsBy && props.groupRowsBy === props.sortField) {\n var multiSortMeta = [{\n field: props.sortField,\n order: props.sortOrder || props.defaultSortOrder\n }];\n props.sortField !== field && multiSortMeta.push({\n field: field,\n order: order\n });\n return sortMultiple(data, multiSortMeta);\n }\n var value = _toConsumableArray(data);\n if (columnSortable.current && columnSortFunction.current) {\n value = columnSortFunction.current({\n data: data,\n field: field,\n order: order\n });\n } else {\n value.sort(function (data1, data2) {\n var value1 = ObjectUtils.resolveFieldData(data1, field);\n var value2 = ObjectUtils.resolveFieldData(data2, field);\n return compareValuesOnSort(value1, value2, order);\n });\n }\n return value;\n };\n var sortMultiple = function sortMultiple(data) {\n var multiSortMeta = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];\n if (props.groupRowsBy && (groupRowsSortMetaState || multiSortMeta.length && props.groupRowsBy === multiSortMeta[0].field)) {\n var groupRowsSortMeta = groupRowsSortMetaState;\n var firstSortMeta = multiSortMeta[0];\n if (!groupRowsSortMeta) {\n groupRowsSortMeta = firstSortMeta;\n setGroupRowsSortMetaState(groupRowsSortMeta);\n }\n if (firstSortMeta.field !== groupRowsSortMeta.field) {\n multiSortMeta = [groupRowsSortMeta].concat(_toConsumableArray(multiSortMeta));\n }\n }\n var value = _toConsumableArray(data);\n if (columnSortable.current && columnSortFunction.current) {\n var meta = multiSortMeta.find(function (meta) {\n return meta.field === columnField.current;\n });\n var field = columnField.current;\n var order = meta ? meta.order : props.defaultSortOrder;\n value = columnSortFunction.current({\n data: data,\n field: field,\n order: order,\n multiSortMeta: multiSortMeta\n });\n } else {\n value.sort(function (data1, data2) {\n return multisortField(data1, data2, multiSortMeta, 0);\n });\n }\n return value;\n };\n var multisortField = function multisortField(data1, data2, multiSortMeta, index) {\n var value1 = ObjectUtils.resolveFieldData(data1, multiSortMeta[index].field);\n var value2 = ObjectUtils.resolveFieldData(data2, multiSortMeta[index].field);\n\n // check if they are equal handling dates and locales\n if (ObjectUtils.compare(value1, value2, PrimeReact.locale) === 0) {\n return multiSortMeta.length - 1 > index ? multisortField(data1, data2, multiSortMeta, index + 1) : 0;\n }\n return compareValuesOnSort(value1, value2, multiSortMeta[index].order);\n };\n var onFilterChange = function onFilterChange(filters) {\n clearEditingMetaData();\n setD_filtersState(filters);\n };\n var onFilterApply = function onFilterApply(filtersToApply) {\n clearTimeout(filterTimeout.current);\n filterTimeout.current = setTimeout(function () {\n var filters = cloneFilters(filtersToApply || d_filtersState);\n if (props.onFilter) {\n props.onFilter(createEvent({\n filters: filters\n }));\n } else {\n setFirstState(0);\n setFiltersState(filters);\n }\n if (props.onValueChange) {\n props.onValueChange(processedData({\n filters: filters\n }));\n }\n }, props.filterDelay);\n };\n var filterLocal = function filterLocal(data, filters) {\n if (!data) return;\n filters = filters || {};\n var columns = getColumns();\n var filteredValue = [];\n var isGlobalFilter = filters['global'] || props.globalFilter;\n var globalFilterFieldsArray;\n if (isGlobalFilter) {\n globalFilterFieldsArray = props.globalFilterFields || columns.filter(function (col) {\n return !col.props.excludeGlobalFilter;\n }).map(function (col) {\n return col.props.filterField || col.props.field;\n });\n }\n for (var i = 0; i < data.length; i++) {\n var localMatch = true;\n var globalMatch = false;\n var localFiltered = false;\n for (var prop in filters) {\n if (Object.prototype.hasOwnProperty.call(filters, prop) && prop !== 'global') {\n localFiltered = true;\n var filterField = prop;\n var filterMeta = filters[filterField];\n if (filterMeta.operator) {\n for (var j = 0; j < filterMeta.constraints.length; j++) {\n var filterConstraint = filterMeta.constraints[j];\n localMatch = executeLocalFilter(filterField, data[i], filterConstraint, j);\n if (filterMeta.operator === FilterOperator.OR && localMatch || filterMeta.operator === FilterOperator.AND && !localMatch) {\n break;\n }\n }\n } else {\n localMatch = executeLocalFilter(filterField, data[i], filterMeta, 0);\n }\n if (!localMatch) {\n break;\n }\n }\n }\n if (isGlobalFilter && !globalMatch && globalFilterFieldsArray) {\n for (var _j = 0; _j < globalFilterFieldsArray.length; _j++) {\n var globalFilterField = globalFilterFieldsArray[_j];\n var matchMode = filters['global'] ? filters['global'].matchMode : props.globalFilterMatchMode;\n var value = filters['global'] ? filters['global'].value : props.globalFilter;\n globalMatch = FilterService.filters[matchMode](ObjectUtils.resolveFieldData(data[i], globalFilterField), value, props.filterLocale);\n if (globalMatch) {\n break;\n }\n }\n }\n var matches = void 0;\n if (isGlobalFilter) {\n matches = localFiltered ? localFiltered && localMatch && globalMatch : globalMatch;\n } else {\n matches = localFiltered && localMatch;\n }\n if (matches) {\n filteredValue.push(data[i]);\n }\n }\n if (filteredValue.length === props.value.length) {\n filteredValue = data;\n }\n return filteredValue;\n };\n var executeLocalFilter = function executeLocalFilter(field, rowData, filterMeta, index) {\n var filterValue = filterMeta.value;\n var filterMatchMode = filterMeta.matchMode === 'custom' ? \"custom_\".concat(field) : filterMeta.matchMode || FilterMatchMode.STARTS_WITH;\n var dataFieldValue = ObjectUtils.resolveFieldData(rowData, field);\n var filterConstraint = FilterService.filters[filterMatchMode];\n return ObjectUtils.isFunction(filterConstraint) && filterConstraint(dataFieldValue, filterValue, props.filterLocale, index);\n };\n var cloneFilters = function cloneFilters(filters) {\n filters = filters || props.filters;\n var cloned = {};\n if (filters) {\n Object.entries(filters).forEach(function (_ref) {\n var _ref2 = _slicedToArray(_ref, 2),\n prop = _ref2[0],\n value = _ref2[1];\n cloned[prop] = value.operator ? {\n operator: value.operator,\n constraints: value.constraints.map(function (constraint) {\n return _objectSpread({}, constraint);\n })\n } : _objectSpread({}, value);\n });\n } else {\n var _columns2 = getColumns();\n cloned = _columns2.reduce(function (filters, col) {\n var field = col.props.filterField || col.props.field;\n var filterFunction = col.props.filterFunction;\n var dataType = col.props.dataType;\n var matchMode = col.props.filterMatchMode || (PrimeReact.filterMatchModeOptions[dataType] ? PrimeReact.filterMatchModeOptions[dataType][0] : FilterMatchMode.STARTS_WITH);\n var constraint = {\n value: null,\n matchMode: matchMode\n };\n if (filterFunction) {\n FilterService.register(\"custom_\".concat(field), function () {\n for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {\n args[_key] = arguments[_key];\n }\n return filterFunction.apply(void 0, args.concat([{\n column: col\n }]));\n });\n }\n filters[field] = props.filterDisplay === 'menu' ? {\n operator: FilterOperator.AND,\n constraints: [constraint]\n } : constraint;\n return filters;\n }, {});\n }\n return cloned;\n };\n var filter = function filter(value, field, matchMode) {\n var index = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 0;\n var filters = _objectSpread({}, d_filtersState);\n var meta = filters[field];\n var constraint = meta && meta.operator ? meta.constraints[index] : meta;\n constraint = meta ? {\n value: value,\n matchMode: matchMode || constraint.matchMode\n } : {\n value: value,\n matchMode: matchMode\n };\n props.filterDisplay === 'menu' && meta && meta.operator ? filters[field].constraints[index] = constraint : filters[field] = constraint;\n setD_filtersState(filters);\n onFilterApply(filters);\n };\n var reset = function reset() {\n setD_rowsState(props.rows);\n setD_filtersState(cloneFilters(props.filters));\n setGroupRowsSortMetaState(null);\n setEditingMetaState({});\n if (!props.onPage) {\n setFirstState(props.first);\n setRowsState(props.rows);\n }\n if (!props.onSort) {\n setSortFieldState(props.sortField);\n setSortOrderState(props.sortOrder);\n setMultiSortMetaState(props.multiSortMeta);\n }\n if (!props.onFilter) {\n setFiltersState(props.filters);\n }\n resetColumnOrder();\n };\n var resetScroll = function resetScroll() {\n if (wrapperRef.current) {\n var scrollableContainer = !isVirtualScrollerDisabled() ? DomHandler.findSingle(wrapperRef.current, '.p-virtualscroller') : wrapperRef.current;\n scrollableContainer.scrollTo(0, 0);\n }\n };\n var resetColumnOrder = function resetColumnOrder() {\n var columns = getColumns(true);\n var columnOrder = [];\n if (columns) {\n columnOrder = columns.reduce(function (orders, col) {\n orders.push(col.props.columnKey || col.props.field);\n return orders;\n }, []);\n }\n setColumnOrderState(columnOrder);\n };\n var exportCSV = function exportCSV(options) {\n var data;\n var csv = \"\\uFEFF\";\n var columns = getColumns();\n if (options && options.selectionOnly) {\n data = props.selection || [];\n } else {\n data = [].concat(_toConsumableArray(props.frozenValue || []), _toConsumableArray(processedData() || []));\n }\n\n //headers\n columns.forEach(function (column, i) {\n var _column$props = column.props,\n field = _column$props.field,\n header = _column$props.header,\n exportable = _column$props.exportable;\n if (exportable && field) {\n csv += '\"' + (header || field) + '\"';\n if (i < columns.length - 1) {\n csv += props.csvSeparator;\n }\n }\n });\n\n //body\n data.forEach(function (record) {\n csv += '\\n';\n columns.forEach(function (column, i) {\n var _column$props2 = column.props,\n colField = _column$props2.field,\n exportField = _column$props2.exportField,\n exportable = _column$props2.exportable;\n var field = exportField || colField;\n if (exportable && field) {\n var cellData = ObjectUtils.resolveFieldData(record, field);\n if (cellData != null) {\n cellData = props.exportFunction ? props.exportFunction({\n data: cellData,\n field: field,\n rowData: record,\n column: column\n }) : String(cellData).replace(/\"/g, '\"\"');\n } else cellData = '';\n csv += '\"' + cellData + '\"';\n if (i < columns.length - 1) {\n csv += props.csvSeparator;\n }\n }\n });\n });\n DomHandler.exportCSV(csv, props.exportFilename);\n };\n var closeEditingCell = function closeEditingCell() {\n if (props.editMode !== 'row') {\n document.body.click();\n }\n };\n var createEvent = function createEvent(event) {\n return _objectSpread({\n first: getFirst(),\n rows: getRows(),\n sortField: getSortField(),\n sortOrder: getSortOrder(),\n multiSortMeta: getMultiSortMeta(),\n filters: getFilters()\n }, event);\n };\n var processedData = function processedData(localState) {\n var data = props.value || [];\n if (!props.lazy) {\n if (data && data.length) {\n var filters = localState && localState.filters || getFilters();\n var sortField = localState && localState.sortField || getSortField();\n var sortOrder = localState && localState.sortOrder || getSortOrder();\n var multiSortMeta = localState && localState.multiSortMeta || getMultiSortMeta();\n var _columns3 = getColumns();\n var sortColumn = _columns3.find(function (col) {\n return col.props.field === sortField;\n });\n if (sortColumn) {\n columnSortable.current = sortColumn.props.sortable;\n columnSortFunction.current = sortColumn.props.sortFunction;\n }\n if (ObjectUtils.isNotEmpty(filters) || props.globalFilter) {\n data = filterLocal(data, filters);\n }\n if (sortField || ObjectUtils.isNotEmpty(multiSortMeta)) {\n if (props.sortMode === 'single') data = sortSingle(data, sortField, sortOrder);else if (props.sortMode === 'multiple') data = sortMultiple(data, multiSortMeta);\n }\n }\n }\n return data;\n };\n var dataToRender = function dataToRender(data) {\n if (data && props.paginator) {\n var first = props.lazy ? 0 : getFirst();\n return data.slice(first, first + getRows());\n }\n return data;\n };\n useMountEffect(function () {\n setAttributeSelectorState(UniqueComponentId());\n setFiltersState(cloneFilters(props.filters));\n setD_filtersState(cloneFilters(props.filters));\n if (isStateful()) {\n restoreState();\n if (props.resizableColumns) {\n restoreColumnWidths();\n }\n }\n });\n useUpdateEffect(function () {\n elementRef.current.setAttribute(attributeSelectorState, '');\n if (props.responsiveLayout === 'stack' && !props.scrollable) {\n createResponsiveStyle();\n }\n }, [attributeSelectorState]);\n useUpdateEffect(function () {\n var filters = cloneFilters(props.filters);\n setFiltersState(filters);\n setD_filtersState(cloneFilters(props.filters));\n if (props.onValueChange) {\n props.onValueChange(processedData({\n filters: filters\n }));\n }\n }, [props.filters]);\n useUpdateEffect(function () {\n if (isStateful()) {\n saveState();\n }\n });\n useUpdateEffect(function () {\n destroyResponsiveStyle();\n if (props.responsiveLayout === 'stack' && !props.scrollable) {\n createResponsiveStyle();\n }\n }, [props.responsiveLayout, props.scrollable]);\n useUpdateEffect(function () {\n if (props.globalFilter) {\n filter(props.globalFilter, 'global', props.globalFilterMatchMode);\n }\n }, [props.globalFilter]);\n useUnmountEffect(function () {\n unbindColumnResizeEvents();\n destroyStyleElement();\n destroyResponsiveStyle();\n });\n React.useImperativeHandle(ref, function () {\n return {\n props: props,\n clearState: clearState,\n closeEditingCell: closeEditingCell,\n exportCSV: exportCSV,\n filter: filter,\n reset: reset,\n resetColumnOrder: resetColumnOrder,\n resetScroll: resetScroll,\n restoreColumnWidths: restoreColumnWidths,\n restoreState: restoreState,\n restoreTableState: restoreTableState,\n saveState: saveState,\n getElement: function getElement() {\n return elementRef.current;\n },\n getTable: function getTable() {\n return tableRef.current;\n },\n getVirtualScroller: function getVirtualScroller() {\n return virtualScrollerRef.current;\n }\n };\n });\n var createLoader = function createLoader() {\n if (props.loading) {\n var iconClassName = classNames('p-datatable-loading-icon pi-spin', props.loadingIcon);\n return /*#__PURE__*/React.createElement(\"div\", {\n className: \"p-datatable-loading-overlay p-component-overlay\"\n }, /*#__PURE__*/React.createElement(\"i\", {\n className: iconClassName\n }));\n }\n return null;\n };\n var createHeader = function createHeader() {\n if (props.header) {\n var _content = ObjectUtils.getJSXElement(props.header, {\n props: props\n });\n return /*#__PURE__*/React.createElement(\"div\", {\n className: \"p-datatable-header\"\n }, _content);\n }\n return null;\n };\n var createTableHeader = function createTableHeader(options, empty) {\n var sortField = getSortField();\n var sortOrder = getSortOrder();\n var multiSortMeta = _toConsumableArray(getMultiSortMeta());\n var groupRowSortField = getGroupRowSortField();\n var filters = d_filtersState;\n var filtersStore = !props.onFilter && props.filters || getFilters();\n var processedData = options.items,\n columns = options.columns;\n return /*#__PURE__*/React.createElement(TableHeader, {\n value: processedData,\n tableProps: props,\n columns: columns,\n tabIndex: props.tabIndex,\n empty: empty,\n headerColumnGroup: props.headerColumnGroup,\n resizableColumns: props.resizableColumns,\n onColumnResizeStart: onColumnResizeStart,\n onColumnResizerClick: props.onColumnResizerClick,\n onColumnResizerDoubleClick: props.onColumnResizerDoubleClick,\n sortMode: props.sortMode,\n sortField: sortField,\n sortOrder: sortOrder,\n multiSortMeta: multiSortMeta,\n groupRowsBy: props.groupRowsBy,\n groupRowSortField: groupRowSortField,\n onSortChange: onSortChange,\n filterDisplay: props.filterDisplay,\n filters: filters,\n filtersStore: filtersStore,\n onFilterChange: onFilterChange,\n onFilterApply: onFilterApply,\n showSelectAll: props.showSelectAll,\n allRowsSelected: allRowsSelected,\n onColumnCheckboxChange: onColumnHeaderCheckboxChange,\n onColumnMouseDown: onColumnHeaderMouseDown,\n onColumnDragStart: onColumnHeaderDragStart,\n onColumnDragOver: onColumnHeaderDragOver,\n onColumnDragLeave: onColumnHeaderDragLeave,\n onColumnDrop: onColumnHeaderDrop,\n rowGroupMode: props.rowGroupMode,\n reorderableColumns: props.reorderableColumns\n });\n };\n var createTableBody = function createTableBody(options, selectionModeInColumn, empty, isVirtualScrollerDisabled) {\n var first = getFirst();\n var rows = options.rows,\n columns = options.columns,\n contentRef = options.contentRef,\n className = options.className;\n options.itemSize;\n var frozenBody = props.frozenValue && /*#__PURE__*/React.createElement(TableBody, {\n ref: frozenBodyRef,\n value: props.frozenValue,\n className: \"p-datatable-frozen-tbody\",\n frozenRow: true,\n tableProps: props,\n tableSelector: attributeSelectorState,\n columns: columns,\n selectionModeInColumn: selectionModeInColumn,\n first: first,\n editingMeta: editingMetaState,\n onEditingMetaChange: onEditingMetaChange,\n tabIndex: props.tabIndex,\n onRowClick: props.onRowClick,\n onRowDoubleClick: props.onRowDoubleClick,\n onRowMouseEnter: props.onRowMouseEnter,\n onRowMouseLeave: props.onRowMouseLeave,\n onCellClick: props.onCellClick,\n selection: props.selection,\n onSelectionChange: props.onSelectionChange,\n lazy: props.lazy,\n paginator: props.paginator,\n onCellSelect: props.onCellSelect,\n onCellUnselect: props.onCellUnselect,\n onRowSelect: props.onRowSelect,\n onRowUnselect: props.onRowUnselect,\n dragSelection: props.dragSelection,\n onContextMenu: props.onContextMenu,\n onContextMenuSelectionChange: props.onContextMenuSelectionChange,\n metaKeySelection: props.metaKeySelection,\n selectionMode: props.selectionMode,\n cellSelection: props.cellSelection,\n contextMenuSelection: props.contextMenuSelection,\n dataKey: props.dataKey,\n expandedRows: props.expandedRows,\n onRowCollapse: props.onRowCollapse,\n onRowExpand: props.onRowExpand,\n onRowToggle: props.onRowToggle,\n editMode: props.editMode,\n editingRows: props.editingRows,\n onRowReorder: props.onRowReorder,\n reorderableRows: props.reorderableRows,\n scrollable: props.scrollable,\n rowGroupMode: props.rowGroupMode,\n groupRowsBy: props.groupRowsBy,\n expandableRowGroups: props.expandableRowGroups,\n loading: props.loading,\n emptyMessage: props.emptyMessage,\n rowGroupHeaderTemplate: props.rowGroupHeaderTemplate,\n rowExpansionTemplate: props.rowExpansionTemplate,\n rowGroupFooterTemplate: props.rowGroupFooterTemplate,\n onRowEditChange: props.onRowEditChange,\n compareSelectionBy: props.compareSelectionBy,\n selectOnEdit: props.selectOnEdit,\n onRowEditInit: props.onRowEditInit,\n rowEditValidator: props.rowEditValidator,\n onRowEditSave: props.onRowEditSave,\n onRowEditComplete: props.onRowEditComplete,\n onRowEditCancel: props.onRowEditCancel,\n cellClassName: props.cellClassName,\n responsiveLayout: props.responsiveLayout,\n selectionAutoFocus: props.selectionAutoFocus,\n isDataSelectable: props.isDataSelectable,\n showSelectionElement: props.showSelectionElement,\n showRowReorderElement: props.showRowReorderElement,\n expandedRowIcon: props.expandedRowIcon,\n collapsedRowIcon: props.collapsedRowIcon,\n rowClassName: props.rowClassName,\n virtualScrollerOptions: options,\n isVirtualScrollerDisabled: true\n });\n var body = /*#__PURE__*/React.createElement(TableBody, {\n ref: bodyRef,\n value: dataToRender(rows),\n className: className,\n empty: empty,\n frozenRow: false,\n tableProps: props,\n tableSelector: attributeSelectorState,\n columns: columns,\n selectionModeInColumn: selectionModeInColumn,\n first: first,\n editingMeta: editingMetaState,\n onEditingMetaChange: onEditingMetaChange,\n tabIndex: props.tabIndex,\n onRowClick: props.onRowClick,\n onRowDoubleClick: props.onRowDoubleClick,\n onRowMouseEnter: props.onRowMouseEnter,\n onRowMouseLeave: props.onRowMouseLeave,\n onCellClick: props.onCellClick,\n selection: props.selection,\n onSelectionChange: props.onSelectionChange,\n lazy: props.lazy,\n paginator: props.paginator,\n onCellSelect: props.onCellSelect,\n onCellUnselect: props.onCellUnselect,\n onRowSelect: props.onRowSelect,\n onRowUnselect: props.onRowUnselect,\n dragSelection: props.dragSelection,\n onContextMenu: props.onContextMenu,\n onContextMenuSelectionChange: props.onContextMenuSelectionChange,\n metaKeySelection: props.metaKeySelection,\n selectionMode: props.selectionMode,\n cellSelection: props.cellSelection,\n contextMenuSelection: props.contextMenuSelection,\n dataKey: props.dataKey,\n expandedRows: props.expandedRows,\n onRowCollapse: props.onRowCollapse,\n onRowExpand: props.onRowExpand,\n onRowToggle: props.onRowToggle,\n editMode: props.editMode,\n editingRows: props.editingRows,\n onRowReorder: props.onRowReorder,\n reorderableRows: props.reorderableRows,\n scrollable: props.scrollable,\n rowGroupMode: props.rowGroupMode,\n groupRowsBy: props.groupRowsBy,\n expandableRowGroups: props.expandableRowGroups,\n loading: props.loading,\n emptyMessage: props.emptyMessage,\n rowGroupHeaderTemplate: props.rowGroupHeaderTemplate,\n rowExpansionTemplate: props.rowExpansionTemplate,\n rowGroupFooterTemplate: props.rowGroupFooterTemplate,\n onRowEditChange: props.onRowEditChange,\n compareSelectionBy: props.compareSelectionBy,\n selectOnEdit: props.selectOnEdit,\n onRowEditInit: props.onRowEditInit,\n rowEditValidator: props.rowEditValidator,\n onRowEditSave: props.onRowEditSave,\n onRowEditComplete: props.onRowEditComplete,\n onRowEditCancel: props.onRowEditCancel,\n cellClassName: props.cellClassName,\n responsiveLayout: props.responsiveLayout,\n selectionAutoFocus: props.selectionAutoFocus,\n isDataSelectable: props.isDataSelectable,\n showSelectionElement: props.showSelectionElement,\n showRowReorderElement: props.showRowReorderElement,\n expandedRowIcon: props.expandedRowIcon,\n collapsedRowIcon: props.collapsedRowIcon,\n rowClassName: props.rowClassName,\n virtualScrollerContentRef: contentRef,\n virtualScrollerOptions: options,\n isVirtualScrollerDisabled: isVirtualScrollerDisabled\n });\n return /*#__PURE__*/React.createElement(React.Fragment, null, frozenBody, body);\n };\n var createTableFooter = function createTableFooter(options) {\n var columns = options.columns;\n return /*#__PURE__*/React.createElement(TableFooter, {\n tableProps: props,\n columns: columns,\n footerColumnGroup: props.footerColumnGroup\n });\n };\n var createContent = function createContent(processedData, columns, selectionModeInColumn, empty) {\n if (!columns) return;\n var _isVirtualScrollerDisabled = isVirtualScrollerDisabled();\n var virtualScrollerOptions = props.virtualScrollerOptions || {};\n return /*#__PURE__*/React.createElement(\"div\", {\n ref: wrapperRef,\n className: \"p-datatable-wrapper\",\n style: {\n maxHeight: _isVirtualScrollerDisabled ? props.scrollHeight : null\n }\n }, /*#__PURE__*/React.createElement(VirtualScroller, _extends({\n ref: virtualScrollerRef\n }, virtualScrollerOptions, {\n items: processedData,\n columns: columns,\n style: _objectSpread(_objectSpread({}, virtualScrollerOptions.style), {\n height: props.scrollHeight !== 'flex' ? props.scrollHeight : undefined\n }),\n scrollHeight: props.scrollHeight !== 'flex' ? undefined : '100%',\n disabled: _isVirtualScrollerDisabled,\n loaderDisabled: true,\n showSpacer: false,\n contentTemplate: function contentTemplate(options) {\n var ref = function ref(el) {\n tableRef.current = el;\n options.spacerRef && options.spacerRef(el);\n };\n var tableClassName = classNames('p-datatable-table', props.tableClassName);\n var tableHeader = createTableHeader(options, empty);\n var tableBody = createTableBody(options, selectionModeInColumn, empty, _isVirtualScrollerDisabled);\n var tableFooter = createTableFooter(options);\n return /*#__PURE__*/React.createElement(\"table\", {\n ref: ref,\n style: props.tableStyle,\n className: tableClassName,\n role: \"table\"\n }, tableHeader, tableBody, tableFooter);\n }\n })));\n };\n var createFooter = function createFooter() {\n if (props.footer) {\n var _content2 = ObjectUtils.getJSXElement(props.footer, {\n props: props\n });\n return /*#__PURE__*/React.createElement(\"div\", {\n className: \"p-datatable-footer\"\n }, _content2);\n }\n return null;\n };\n var createPaginator = function createPaginator(position, totalRecords) {\n var className = classNames('p-paginator-' + position, props.paginatorClassName);\n return /*#__PURE__*/React.createElement(Paginator, {\n first: getFirst(),\n rows: getRows(),\n pageLinkSize: props.pageLinkSize,\n className: className,\n onPageChange: onPageChange,\n template: props.paginatorTemplate,\n totalRecords: totalRecords,\n rowsPerPageOptions: props.rowsPerPageOptions,\n currentPageReportTemplate: props.currentPageReportTemplate,\n leftContent: props.paginatorLeft,\n rightContent: props.paginatorRight,\n alwaysShow: props.alwaysShowPaginator,\n dropdownAppendTo: props.paginatorDropdownAppendTo\n });\n };\n var createPaginatorTop = function createPaginatorTop(totalRecords) {\n if (props.paginator && props.paginatorPosition !== 'bottom') {\n return createPaginator('top', totalRecords);\n }\n return null;\n };\n var createPaginatorBottom = function createPaginatorBottom(totalRecords) {\n if (props.paginator && props.paginatorPosition !== 'top') {\n return createPaginator('bottom', totalRecords);\n }\n return null;\n };\n var createResizeHelper = function createResizeHelper() {\n if (props.resizableColumns) {\n return /*#__PURE__*/React.createElement(\"div\", {\n ref: resizeHelperRef,\n className: \"p-column-resizer-helper\",\n style: {\n display: 'none'\n }\n });\n }\n return null;\n };\n var createReorderIndicators = function createReorderIndicators() {\n if (props.reorderableColumns) {\n var style = {\n position: 'absolute',\n display: 'none'\n };\n return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(\"span\", {\n ref: reorderIndicatorUpRef,\n className: \"pi pi-arrow-down p-datatable-reorder-indicator-up\",\n style: style\n }), /*#__PURE__*/React.createElement(\"span\", {\n ref: reorderIndicatorDownRef,\n className: \"pi pi-arrow-up p-datatable-reorder-indicator-down\",\n style: style\n }));\n }\n return null;\n };\n var data = processedData();\n var columns = getColumns();\n var totalRecords = getTotalRecords(data);\n var empty = ObjectUtils.isEmpty(data);\n var selectionModeInColumn = getSelectionModeInColumn(columns);\n var selectable = props.selectionMode || selectionModeInColumn;\n var otherProps = ObjectUtils.findDiffKeys(props, DataTable.defaultProps);\n var className = classNames('p-datatable p-component', {\n 'p-datatable-hoverable-rows': props.rowHover,\n 'p-datatable-selectable': selectable && !props.cellSelection,\n 'p-datatable-selectable-cell': selectable && props.cellSelection,\n 'p-datatable-auto-layout': props.autoLayout,\n 'p-datatable-resizable': props.resizableColumns,\n 'p-datatable-resizable-fit': props.resizableColumns && props.columnResizeMode === 'fit',\n 'p-datatable-scrollable': props.scrollable,\n 'p-datatable-scrollable-vertical': props.scrollable && props.scrollDirection === 'vertical',\n 'p-datatable-scrollable-horizontal': props.scrollable && props.scrollDirection === 'horizontal',\n 'p-datatable-scrollable-both': props.scrollable && props.scrollDirection === 'both',\n 'p-datatable-flex-scrollable': props.scrollable && props.scrollHeight === 'flex',\n 'p-datatable-responsive-stack': props.responsiveLayout === 'stack',\n 'p-datatable-responsive-scroll': props.responsiveLayout === 'scroll',\n 'p-datatable-striped': props.stripedRows,\n 'p-datatable-gridlines': props.showGridlines,\n 'p-datatable-grouped-header': props.headerColumnGroup != null,\n 'p-datatable-grouped-footer': props.footerColumnGroup != null,\n 'p-datatable-sm': props.size === 'small',\n 'p-datatable-lg': props.size === 'large'\n }, props.className);\n var loader = createLoader();\n var header = createHeader();\n var paginatorTop = createPaginatorTop(totalRecords);\n var content = createContent(data, columns, selectionModeInColumn, empty);\n var paginatorBottom = createPaginatorBottom(totalRecords);\n var footer = createFooter();\n var resizeHelper = createResizeHelper();\n var reorderIndicators = createReorderIndicators();\n return /*#__PURE__*/React.createElement(\"div\", _extends({\n ref: elementRef,\n id: props.id,\n className: className,\n style: props.style\n }, otherProps, {\n \"data-scrollselectors\": \".p-datatable-wrapper\"\n }), loader, header, paginatorTop, content, paginatorBottom, footer, resizeHelper, reorderIndicators);\n});\nDataTable.displayName = 'DataTable';\nDataTable.defaultProps = {\n __TYPE: 'DataTable',\n alwaysShowPaginator: true,\n autoLayout: false,\n breakpoint: '960px',\n cellClassName: null,\n cellSelection: false,\n className: null,\n collapsedRowIcon: 'pi pi-chevron-right',\n columnResizeMode: 'fit',\n compareSelectionBy: 'deepEquals',\n contextMenuSelection: null,\n csvSeparator: ',',\n currentPageReportTemplate: '({currentPage} of {totalPages})',\n customRestoreState: null,\n customSaveState: null,\n dataKey: null,\n defaultSortOrder: 1,\n dragSelection: false,\n editMode: 'cell',\n editingRows: null,\n emptyMessage: null,\n expandableRowGroups: false,\n expandedRowIcon: 'pi pi-chevron-down',\n expandedRows: null,\n exportFilename: 'download',\n exportFunction: null,\n filterDelay: 300,\n filterDisplay: 'menu',\n filterLocale: undefined,\n filters: null,\n first: 0,\n footer: null,\n footerColumnGroup: null,\n frozenValue: null,\n frozenWidth: null,\n globalFilter: null,\n globalFilterFields: null,\n globalFilterMatchMode: FilterMatchMode.CONTAINS,\n groupRowsBy: null,\n header: null,\n headerColumnGroup: null,\n id: null,\n isDataSelectable: null,\n lazy: false,\n loading: false,\n loadingIcon: 'pi pi-spinner',\n metaKeySelection: true,\n multiSortMeta: null,\n onAllRowsSelect: null,\n onAllRowsUnselect: null,\n onCellClick: null,\n onCellSelect: null,\n onCellUnselect: null,\n onColReorder: null,\n onColumnResizeEnd: null,\n onColumnResizerClick: null,\n onColumnResizerDoubleClick: null,\n onContextMenu: null,\n onContextMenuSelectionChange: null,\n onFilter: null,\n onPage: null,\n onRowClick: null,\n onRowMouseEnter: null,\n onRowMouseLeave: null,\n onRowCollapse: null,\n onRowDoubleClick: null,\n onRowEditCancel: null,\n onRowEditChange: null,\n onRowEditComplete: null,\n onRowEditInit: null,\n onRowEditSave: null,\n onRowExpand: null,\n onRowReorder: null,\n onRowSelect: null,\n onRowToggle: null,\n onRowUnselect: null,\n onSelectAllChange: null,\n onSelectionChange: null,\n onSort: null,\n onStateRestore: null,\n onStateSave: null,\n onValueChange: null,\n pageLinkSize: 5,\n paginator: false,\n paginatorClassName: null,\n paginatorDropdownAppendTo: null,\n paginatorLeft: null,\n paginatorPosition: 'bottom',\n paginatorRight: null,\n paginatorTemplate: 'FirstPageLink PrevPageLink PageLinks NextPageLink LastPageLink RowsPerPageDropdown',\n removableSort: false,\n reorderableColumns: false,\n reorderableRows: false,\n resizableColumns: false,\n responsiveLayout: 'stack',\n rowClassName: null,\n rowEditValidator: null,\n rowExpansionTemplate: null,\n rowGroupFooterTemplate: null,\n rowGroupHeaderTemplate: null,\n rowGroupMode: null,\n rowHover: false,\n rows: null,\n rowsPerPageOptions: null,\n scrollDirection: 'vertical',\n scrollHeight: null,\n scrollable: false,\n selectAll: false,\n selectOnEdit: true,\n selection: null,\n selectionAriaLabel: null,\n selectionAutoFocus: true,\n selectionMode: null,\n selectionPageOnly: false,\n showGridlines: false,\n showRowReorderElement: null,\n showSelectAll: true,\n showSelectionElement: null,\n size: 'normal',\n sortField: null,\n sortMode: 'single',\n sortOrder: null,\n stateKey: null,\n stateStorage: 'session',\n stripedRows: false,\n style: null,\n tabIndex: 0,\n tableClassName: null,\n tableStyle: null,\n totalRecords: null,\n value: null,\n virtualScrollerOptions: null\n};\n\nexport { DataTable };\n","var Column = function Column() {};\nColumn.displayName = 'Column';\nColumn.defaultProps = {\n __TYPE: 'Column',\n align: null,\n alignFrozen: 'left',\n alignHeader: null,\n body: null,\n bodyClassName: null,\n bodyStyle: null,\n cellEditValidator: null,\n cellEditValidatorEvent: 'click',\n className: null,\n colSpan: null,\n columnKey: null,\n dataType: 'text',\n editor: null,\n excludeGlobalFilter: false,\n expander: false,\n exportField: null,\n exportable: true,\n field: null,\n filter: false,\n filterApply: null,\n filterClear: null,\n filterElement: null,\n filterField: null,\n filterFooter: null,\n filterFunction: null,\n filterHeader: null,\n filterHeaderClassName: null,\n filterHeaderStyle: null,\n filterMatchMode: null,\n filterMatchModeOptions: null,\n filterMaxLength: null,\n filterMenuClassName: null,\n filterMenuStyle: null,\n filterPlaceholder: null,\n filterType: 'text',\n footer: null,\n footerClassName: null,\n footerStyle: null,\n frozen: false,\n header: null,\n headerClassName: null,\n headerStyle: null,\n headerTooltip: null,\n headerTooltipOptions: null,\n hidden: false,\n maxConstraints: 2,\n onBeforeCellEditHide: null,\n onBeforeCellEditShow: null,\n onCellEditCancel: null,\n onCellEditComplete: null,\n onCellEditInit: null,\n onFilterApplyClick: null,\n onFilterClear: null,\n onFilterConstraintAdd: null,\n onFilterConstraintRemove: null,\n onFilterMatchModeChange: null,\n onFilterOperatorChange: null,\n reorderable: true,\n resizeable: true,\n rowEditor: false,\n rowReorder: false,\n rowReorderIcon: 'pi pi-bars',\n rowSpan: null,\n selectionMode: null,\n showAddButton: true,\n showApplyButton: true,\n showClearButton: true,\n showFilterMatchModes: true,\n showFilterMenu: true,\n showFilterMenuOptions: true,\n showFilterOperator: true,\n sortField: null,\n sortFunction: null,\n sortable: false,\n sortableDisabled: false,\n style: null\n};\n\nexport { Column };\n","import * as React from 'react';\nimport PrimeReact, { localeOptions, localeOption } from 'primereact/api';\nimport { Button } from 'primereact/button';\nimport { usePrevious, useOverlayListener, useMountEffect, useUpdateEffect, useUnmountEffect } from 'primereact/hooks';\nimport { InputText } from 'primereact/inputtext';\nimport { OverlayService } from 'primereact/overlayservice';\nimport { Ripple } from 'primereact/ripple';\nimport { UniqueComponentId, DomHandler, ObjectUtils, mask, ZIndexUtils, classNames } from 'primereact/utils';\nimport { CSSTransition } from 'primereact/csstransition';\nimport { Portal } from 'primereact/portal';\n\nfunction _typeof(obj) {\n \"@babel/helpers - typeof\";\n\n return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (obj) {\n return typeof obj;\n } : function (obj) {\n return obj && \"function\" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj;\n }, _typeof(obj);\n}\n\nfunction _toPrimitive(input, hint) {\n if (_typeof(input) !== \"object\" || input === null) return input;\n var prim = input[Symbol.toPrimitive];\n if (prim !== undefined) {\n var res = prim.call(input, hint || \"default\");\n if (_typeof(res) !== \"object\") return res;\n throw new TypeError(\"@@toPrimitive must return a primitive value.\");\n }\n return (hint === \"string\" ? String : Number)(input);\n}\n\nfunction _toPropertyKey(arg) {\n var key = _toPrimitive(arg, \"string\");\n return _typeof(key) === \"symbol\" ? key : String(key);\n}\n\nfunction _defineProperty(obj, key, value) {\n key = _toPropertyKey(key);\n if (key in obj) {\n Object.defineProperty(obj, key, {\n value: value,\n enumerable: true,\n configurable: true,\n writable: true\n });\n } else {\n obj[key] = value;\n }\n return obj;\n}\n\nfunction _extends() {\n _extends = Object.assign ? Object.assign.bind() : function (target) {\n for (var i = 1; i < arguments.length; i++) {\n var source = arguments[i];\n for (var key in source) {\n if (Object.prototype.hasOwnProperty.call(source, key)) {\n target[key] = source[key];\n }\n }\n }\n return target;\n };\n return _extends.apply(this, arguments);\n}\n\nfunction _arrayLikeToArray$1(arr, len) {\n if (len == null || len > arr.length) len = arr.length;\n for (var i = 0, arr2 = new Array(len); i < len; i++) {\n arr2[i] = arr[i];\n }\n return arr2;\n}\n\nfunction _arrayWithoutHoles(arr) {\n if (Array.isArray(arr)) return _arrayLikeToArray$1(arr);\n}\n\nfunction _iterableToArray(iter) {\n if (typeof Symbol !== \"undefined\" && iter[Symbol.iterator] != null || iter[\"@@iterator\"] != null) return Array.from(iter);\n}\n\nfunction _unsupportedIterableToArray$1(o, minLen) {\n if (!o) return;\n if (typeof o === \"string\") return _arrayLikeToArray$1(o, minLen);\n var n = Object.prototype.toString.call(o).slice(8, -1);\n if (n === \"Object\" && o.constructor) n = o.constructor.name;\n if (n === \"Map\" || n === \"Set\") return Array.from(o);\n if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray$1(o, minLen);\n}\n\nfunction _nonIterableSpread() {\n throw new TypeError(\"Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\");\n}\n\nfunction _toConsumableArray(arr) {\n return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray$1(arr) || _nonIterableSpread();\n}\n\nfunction _arrayWithHoles(arr) {\n if (Array.isArray(arr)) return arr;\n}\n\nfunction _iterableToArrayLimit(arr, i) {\n var _i = null == arr ? null : \"undefined\" != typeof Symbol && arr[Symbol.iterator] || arr[\"@@iterator\"];\n if (null != _i) {\n var _s,\n _e,\n _x,\n _r,\n _arr = [],\n _n = !0,\n _d = !1;\n try {\n if (_x = (_i = _i.call(arr)).next, 0 === i) {\n if (Object(_i) !== _i) return;\n _n = !1;\n } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0) {\n ;\n }\n } catch (err) {\n _d = !0, _e = err;\n } finally {\n try {\n if (!_n && null != _i[\"return\"] && (_r = _i[\"return\"](), Object(_r) !== _r)) return;\n } finally {\n if (_d) throw _e;\n }\n }\n return _arr;\n }\n}\n\nfunction _nonIterableRest() {\n throw new TypeError(\"Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\");\n}\n\nfunction _slicedToArray(arr, i) {\n return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray$1(arr, i) || _nonIterableRest();\n}\n\nvar CalendarPanel = /*#__PURE__*/React.forwardRef(function (props, ref) {\n var createElement = function createElement() {\n return /*#__PURE__*/React.createElement(CSSTransition, {\n nodeRef: ref,\n classNames: \"p-connected-overlay\",\n \"in\": props[\"in\"],\n timeout: {\n enter: 120,\n exit: 100\n },\n options: props.transitionOptions,\n unmountOnExit: true,\n onEnter: props.onEnter,\n onEntered: props.onEntered,\n onExit: props.onExit,\n onExited: props.onExited\n }, /*#__PURE__*/React.createElement(\"div\", {\n ref: ref,\n className: props.className,\n style: props.style,\n onClick: props.onClick,\n onMouseUp: props.onMouseUp\n }, props.children));\n };\n var element = createElement();\n return props.inline ? element : /*#__PURE__*/React.createElement(Portal, {\n element: element,\n appendTo: props.appendTo\n });\n});\nCalendarPanel.displayName = 'CalendarPanel';\n\nfunction _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; } } }; }\nfunction _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); }\nfunction _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; }\nvar Calendar = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (props, ref) {\n var _classNames;\n var _React$useState = React.useState(false),\n _React$useState2 = _slicedToArray(_React$useState, 2),\n focusedState = _React$useState2[0],\n setFocusedState = _React$useState2[1];\n var _React$useState3 = React.useState(false),\n _React$useState4 = _slicedToArray(_React$useState3, 2),\n overlayVisibleState = _React$useState4[0],\n setOverlayVisibleState = _React$useState4[1];\n var _React$useState5 = React.useState(null),\n _React$useState6 = _slicedToArray(_React$useState5, 2),\n viewDateState = _React$useState6[0],\n setViewDateState = _React$useState6[1];\n var elementRef = React.useRef(null);\n var overlayRef = React.useRef(null);\n var inputRef = React.useRef(props.inputRef);\n var navigation = React.useRef(null);\n var ignoreFocusFunctionality = React.useRef(false);\n var isKeydown = React.useRef(false);\n var timePickerTimer = React.useRef(null);\n var viewStateChanged = React.useRef(false);\n var touchUIMask = React.useRef(null);\n var overlayEventListener = React.useRef(null);\n var touchUIMaskClickListener = React.useRef(null);\n var isOverlayClicked = React.useRef(false);\n var ignoreMaskChange = React.useRef(false);\n var _React$useState7 = React.useState('date'),\n _React$useState8 = _slicedToArray(_React$useState7, 2),\n currentView = _React$useState8[0],\n setCurrentView = _React$useState8[1];\n var _React$useState9 = React.useState(null),\n _React$useState10 = _slicedToArray(_React$useState9, 2),\n currentMonth = _React$useState10[0],\n setCurrentMonth = _React$useState10[1];\n var _React$useState11 = React.useState(null),\n _React$useState12 = _slicedToArray(_React$useState11, 2),\n currentYear = _React$useState12[0],\n setCurrentYear = _React$useState12[1];\n var _React$useState13 = React.useState([]),\n _React$useState14 = _slicedToArray(_React$useState13, 2),\n yearOptions = _React$useState14[0],\n setYearOptions = _React$useState14[1];\n var previousValue = usePrevious(props.value);\n var visible = props.inline || (props.onVisibleChange ? props.visible : overlayVisibleState);\n var attributeSelector = UniqueComponentId();\n var _useOverlayListener = useOverlayListener({\n target: elementRef,\n overlay: overlayRef,\n listener: function listener(event, _ref) {\n var type = _ref.type,\n valid = _ref.valid;\n if (valid) {\n type === 'outside' ? !isOverlayClicked.current && !isNavIconClicked(event.target) && hide('outside') : hide();\n }\n isOverlayClicked.current = false;\n },\n when: !(props.touchUI || props.inline) && visible\n }),\n _useOverlayListener2 = _slicedToArray(_useOverlayListener, 2),\n bindOverlayListener = _useOverlayListener2[0],\n unbindOverlayListener = _useOverlayListener2[1];\n var getDateFormat = function getDateFormat() {\n return props.dateFormat || localeOption('dateFormat', props.locale);\n };\n var onInputFocus = function onInputFocus(event) {\n if (ignoreFocusFunctionality.current) {\n setFocusedState(true);\n ignoreFocusFunctionality.current = false;\n } else {\n if (props.showOnFocus && !visible) {\n show();\n }\n setFocusedState(true);\n props.onFocus && props.onFocus(event);\n }\n };\n var onInputBlur = function onInputBlur(event) {\n setFocusedState(false);\n !props.keepInvalid && updateInputfield(props.value);\n props.onBlur && props.onBlur(event);\n };\n var onInputKeyDown = function onInputKeyDown(event) {\n isKeydown.current = true;\n switch (event.which) {\n //escape\n case 27:\n {\n hide();\n break;\n }\n\n //tab\n case 9:\n {\n visible && trapFocus(event);\n props.touchUI && disableModality();\n break;\n }\n }\n };\n var onUserInput = function onUserInput(event) {\n // IE 11 Workaround for input placeholder\n if (!isKeydown.current) {\n return;\n }\n isKeydown.current = false;\n updateValueOnInput(event, event.target.value);\n props.onInput && props.onInput(event);\n };\n var updateValueOnInput = function updateValueOnInput(event, rawValue) {\n try {\n var value = parseValueFromString(rawValue);\n if (isValidSelection(value)) {\n updateModel(event, value);\n updateViewDate(event, value.length ? value[0] : value);\n }\n } catch (err) {\n //invalid date\n var _value = props.keepInvalid ? rawValue : null;\n updateModel(event, _value);\n }\n };\n var reFocusInputField = function reFocusInputField() {\n if (!props.inline && inputRef.current) {\n ignoreFocusFunctionality.current = true;\n DomHandler.focus(inputRef.current);\n }\n };\n var isValidSelection = function isValidSelection(value) {\n var isValid = true;\n if (isSingleSelection()) {\n if (!(isSelectable(value.getDate(), value.getMonth(), value.getFullYear(), false) && isSelectableTime(value))) {\n isValid = false;\n }\n } else if (value.every(function (v) {\n return isSelectable(v.getDate(), v.getMonth(), v.getFullYear(), false) && isSelectableTime(v);\n })) {\n if (isRangeSelection()) {\n isValid = value.length > 1 && value[1] > value[0] ? true : false;\n }\n }\n return isValid;\n };\n var onButtonClick = function onButtonClick() {\n visible ? hide() : show();\n };\n var onPrevButtonClick = function onPrevButtonClick(event) {\n navigation.current = {\n backward: true,\n button: true\n };\n navBackward(event);\n };\n var onNextButtonClick = function onNextButtonClick(event) {\n navigation.current = {\n backward: false,\n button: true\n };\n navForward(event);\n };\n var onContainerButtonKeydown = function onContainerButtonKeydown(event) {\n switch (event.which) {\n //tab\n case 9:\n trapFocus(event);\n break;\n\n //escape\n case 27:\n hide(null, reFocusInputField);\n event.preventDefault();\n break;\n }\n };\n var trapFocus = function trapFocus(event) {\n event.preventDefault();\n var focusableElements = DomHandler.getFocusableElements(overlayRef.current);\n if (focusableElements && focusableElements.length > 0) {\n if (!document.activeElement) {\n focusableElements[0].focus();\n } else {\n var focusedIndex = focusableElements.indexOf(document.activeElement);\n if (event.shiftKey) {\n if (focusedIndex === -1 || focusedIndex === 0) focusableElements[focusableElements.length - 1].focus();else focusableElements[focusedIndex - 1].focus();\n } else {\n if (focusedIndex === -1 || focusedIndex === focusableElements.length - 1) focusableElements[0].focus();else focusableElements[focusedIndex + 1].focus();\n }\n }\n }\n };\n var updateFocus = function updateFocus() {\n if (navigation.current) {\n if (navigation.current.button) {\n initFocusableCell();\n if (navigation.current.backward) DomHandler.findSingle(overlayRef.current, '.p-datepicker-prev').focus();else DomHandler.findSingle(overlayRef.current, '.p-datepicker-next').focus();\n } else {\n var cell;\n if (navigation.current.backward) {\n var cells = DomHandler.find(overlayRef.current, '.p-datepicker-calendar td span:not(.p-disabled)');\n cell = cells[cells.length - 1];\n } else {\n cell = DomHandler.findSingle(overlayRef.current, '.p-datepicker-calendar td span:not(.p-disabled)');\n }\n if (cell) {\n cell.tabIndex = '0';\n cell.focus();\n }\n }\n navigation.current = null;\n } else {\n initFocusableCell();\n }\n };\n var initFocusableCell = function initFocusableCell() {\n var cell;\n if (props.view === 'month') {\n var cells = DomHandler.find(overlayRef.current, '.p-monthpicker .p-monthpicker-month');\n var selectedCell = DomHandler.findSingle(overlayRef.current, '.p-monthpicker .p-monthpicker-month.p-highlight');\n cells.forEach(function (cell) {\n return cell.tabIndex = -1;\n });\n cell = selectedCell || cells[0];\n } else {\n cell = DomHandler.findSingle(overlayRef.current, 'span.p-highlight');\n if (!cell) {\n var todayCell = DomHandler.findSingle(overlayRef.current, 'td.p-datepicker-today span:not(.p-disabled)');\n cell = todayCell || DomHandler.findSingle(overlayRef.current, '.p-datepicker-calendar td span:not(.p-disabled)');\n }\n }\n if (cell) {\n cell.tabIndex = '0';\n }\n };\n var navBackward = function navBackward(event) {\n if (props.disabled) {\n event.preventDefault();\n return;\n }\n var newViewDate = new Date(getViewDate().getTime());\n newViewDate.setDate(1);\n if (currentView === 'date') {\n if (newViewDate.getMonth() === 0) {\n newViewDate.setMonth(11);\n newViewDate.setFullYear(decrementYear());\n setCurrentMonth(11);\n } else {\n newViewDate.setMonth(newViewDate.getMonth() - 1);\n setCurrentMonth(function (prevState) {\n return prevState - 1;\n });\n }\n } else if (currentView === 'month') {\n var newYear = newViewDate.getFullYear() - 1;\n if (props.yearNavigator) {\n var minYear = parseInt(props.yearRange.split(':')[0], 10);\n if (newYear < minYear) {\n newYear = minYear;\n }\n }\n newViewDate.setFullYear(newYear);\n }\n if (currentView === 'month') {\n newViewDate.setFullYear(decrementYear());\n } else if (currentView === 'year') {\n newViewDate.setFullYear(decrementDecade());\n }\n updateViewDate(event, newViewDate);\n event.preventDefault();\n };\n var navForward = function navForward(event) {\n if (props.disabled) {\n event.preventDefault();\n return;\n }\n var newViewDate = new Date(getViewDate().getTime());\n newViewDate.setDate(1);\n if (currentView === 'date') {\n if (newViewDate.getMonth() === 11) {\n newViewDate.setMonth(0);\n newViewDate.setFullYear(incrementYear());\n setCurrentMonth(0);\n } else {\n newViewDate.setMonth(newViewDate.getMonth() + 1);\n setCurrentMonth(function (prevState) {\n return prevState + 1;\n });\n }\n } else if (currentView === 'month') {\n var newYear = newViewDate.getFullYear() + 1;\n if (props.yearNavigator) {\n var maxYear = parseInt(props.yearRange.split(':')[1], 10);\n if (newYear > maxYear) {\n newYear = maxYear;\n }\n }\n newViewDate.setFullYear(newYear);\n }\n if (currentView === 'month') {\n newViewDate.setFullYear(incrementYear());\n } else if (currentView === 'year') {\n newViewDate.setFullYear(incrementDecade());\n }\n updateViewDate(event, newViewDate);\n event.preventDefault();\n };\n var populateYearOptions = function populateYearOptions(start, end) {\n var _yearOptions = [];\n for (var i = start; i <= end; i++) {\n yearOptions.push(i);\n }\n setYearOptions(_yearOptions);\n };\n var decrementYear = function decrementYear() {\n var _currentYear = currentYear - 1;\n setCurrentYear(_currentYear);\n if (props.yearNavigator && _currentYear < yearOptions[0]) {\n var difference = yearOptions[yearOptions.length - 1] - yearOptions[0];\n populateYearOptions(yearOptions[0] - difference, yearOptions[yearOptions.length - 1] - difference);\n }\n return _currentYear;\n };\n var incrementYear = function incrementYear() {\n var _currentYear = currentYear + 1;\n setCurrentYear(_currentYear);\n if (props.yearNavigator && _currentYear.current > yearOptions[yearOptions.length - 1]) {\n var difference = yearOptions[yearOptions.length - 1] - yearOptions[0];\n populateYearOptions(yearOptions[0] + difference, yearOptions[yearOptions.length - 1] + difference);\n }\n return _currentYear;\n };\n var onMonthDropdownChange = function onMonthDropdownChange(event, value) {\n var currentViewDate = getViewDate();\n var newViewDate = new Date(currentViewDate.getTime());\n newViewDate.setMonth(parseInt(value, 10));\n updateViewDate(event, newViewDate);\n };\n var onYearDropdownChange = function onYearDropdownChange(event, value) {\n var currentViewDate = getViewDate();\n var newViewDate = new Date(currentViewDate.getTime());\n newViewDate.setFullYear(parseInt(value, 10));\n updateViewDate(event, newViewDate);\n };\n var onTodayButtonClick = function onTodayButtonClick(event) {\n var today = new Date();\n var dateMeta = {\n day: today.getDate(),\n month: today.getMonth(),\n year: today.getFullYear(),\n today: true,\n selectable: true\n };\n var timeMeta = {\n hours: today.getHours(),\n minutes: today.getMinutes(),\n seconds: today.getSeconds(),\n milliseconds: today.getMilliseconds()\n };\n updateViewDate(event, today);\n onDateSelect(event, dateMeta, timeMeta);\n props.onTodayButtonClick && props.onTodayButtonClick(event);\n };\n var onClearButtonClick = function onClearButtonClick(event) {\n updateModel(event, null);\n updateInputfield(null);\n hide();\n props.onClearButtonClick && props.onClearButtonClick(event);\n };\n var onPanelClick = function onPanelClick(event) {\n if (!props.inline) {\n OverlayService.emit('overlay-click', {\n originalEvent: event,\n target: elementRef.current\n });\n }\n };\n var onPanelMouseUp = function onPanelMouseUp(event) {\n onPanelClick(event);\n };\n var onTimePickerElementMouseDown = function onTimePickerElementMouseDown(event, type, direction) {\n if (!props.disabled) {\n repeat(event, null, type, direction);\n event.preventDefault();\n }\n };\n var onTimePickerElementMouseUp = function onTimePickerElementMouseUp() {\n if (!props.disabled) {\n clearTimePickerTimer();\n }\n };\n var onTimePickerElementMouseLeave = function onTimePickerElementMouseLeave() {\n if (!props.disabled) {\n clearTimePickerTimer();\n }\n };\n var repeat = function repeat(event, interval, type, direction) {\n clearTimePickerTimer();\n timePickerTimer.current = setTimeout(function () {\n repeat(event, 100, type, direction);\n }, interval || 500);\n switch (type) {\n case 0:\n if (direction === 1) incrementHour(event);else decrementHour(event);\n break;\n case 1:\n if (direction === 1) incrementMinute(event);else decrementMinute(event);\n break;\n case 2:\n if (direction === 1) incrementSecond(event);else decrementSecond(event);\n break;\n case 3:\n if (direction === 1) incrementMilliSecond(event);else decrementMilliSecond(event);\n break;\n }\n };\n var clearTimePickerTimer = function clearTimePickerTimer() {\n if (timePickerTimer.current) {\n clearTimeout(timePickerTimer.current);\n }\n };\n var incrementHour = function incrementHour(event) {\n var currentTime = getCurrentDateTime();\n var currentHour = currentTime.getHours();\n var newHour = currentHour + props.stepHour;\n newHour = newHour >= 24 ? newHour - 24 : newHour;\n if (validateHour(newHour, currentTime)) {\n if (props.maxDate && props.maxDate.toDateString() === currentTime.toDateString() && props.maxDate.getHours() === newHour) {\n if (props.maxDate.getMinutes() < currentTime.getMinutes()) {\n if (props.maxDate.getSeconds() < currentTime.getSeconds()) {\n if (props.maxDate.getMilliseconds() < currentTime.getMilliseconds()) {\n updateTime(event, newHour, props.maxDate.getMinutes(), props.maxDate.getSeconds(), props.maxDate.getMilliseconds());\n } else {\n updateTime(event, newHour, props.maxDate.getMinutes(), props.maxDate.getSeconds(), currentTime.getMilliseconds());\n }\n } else {\n updateTime(event, newHour, props.maxDate.getMinutes(), currentTime.getSeconds(), currentTime.getMilliseconds());\n }\n } else if (props.maxDate.getMinutes() === currentTime.getMinutes()) {\n if (props.maxDate.getSeconds() < currentTime.getSeconds()) {\n if (props.maxDate.getMilliseconds() < currentTime.getMilliseconds()) {\n updateTime(event, newHour, props.maxDate.getMinutes(), props.maxDate.getSeconds(), props.maxDate.getMilliseconds());\n } else {\n updateTime(event, newHour, props.maxDate.getMinutes(), props.maxDate.getSeconds(), currentTime.getMilliseconds());\n }\n } else {\n updateTime(event, newHour, props.maxDate.getMinutes(), currentTime.getSeconds(), currentTime.getMilliseconds());\n }\n } else {\n updateTime(event, newHour, currentTime.getMinutes(), currentTime.getSeconds(), currentTime.getMilliseconds());\n }\n } else {\n updateTime(event, newHour, currentTime.getMinutes(), currentTime.getSeconds(), currentTime.getMilliseconds());\n }\n }\n event.preventDefault();\n };\n var decrementHour = function decrementHour(event) {\n var currentTime = getCurrentDateTime();\n var currentHour = currentTime.getHours();\n var newHour = currentHour - props.stepHour;\n newHour = newHour < 0 ? newHour + 24 : newHour;\n if (validateHour(newHour, currentTime)) {\n if (props.minDate && props.minDate.toDateString() === currentTime.toDateString() && props.minDate.getHours() === newHour) {\n if (props.minDate.getMinutes() > currentTime.getMinutes()) {\n if (props.minDate.getSeconds() > currentTime.getSeconds()) {\n if (props.minDate.getMilliseconds() > currentTime.getMilliseconds()) {\n updateTime(event, newHour, props.minDate.getMinutes(), props.minDate.getSeconds(), props.minDate.getMilliseconds());\n } else {\n updateTime(event, newHour, props.minDate.getMinutes(), props.minDate.getSeconds(), currentTime.getMilliseconds());\n }\n } else {\n updateTime(event, newHour, props.minDate.getMinutes(), currentTime.getSeconds(), currentTime.getMilliseconds());\n }\n } else if (props.minDate.getMinutes() === currentTime.getMinutes()) {\n if (props.minDate.getSeconds() > currentTime.getSeconds()) {\n if (props.minDate.getMilliseconds() > currentTime.getMilliseconds()) {\n updateTime(event, newHour, props.minDate.getMinutes(), props.minDate.getSeconds(), props.minDate.getMilliseconds());\n } else {\n updateTime(event, newHour, props.minDate.getMinutes(), props.minDate.getSeconds(), currentTime.getMilliseconds());\n }\n } else {\n updateTime(event, newHour, props.minDate.getMinutes(), currentTime.getSeconds(), currentTime.getMilliseconds());\n }\n } else {\n updateTime(event, newHour, currentTime.getMinutes(), currentTime.getSeconds(), currentTime.getMilliseconds());\n }\n } else {\n updateTime(event, newHour, currentTime.getMinutes(), currentTime.getSeconds(), currentTime.getMilliseconds());\n }\n }\n event.preventDefault();\n };\n var doStepMinute = function doStepMinute(currentMinute, step) {\n if (props.stepMinute <= 1) {\n return step ? currentMinute + step : currentMinute;\n }\n if (!step) {\n step = props.stepMinute;\n if (currentMinute % step === 0) {\n return currentMinute;\n }\n }\n return Math.floor((currentMinute + step) / step) * step;\n };\n var incrementMinute = function incrementMinute(event) {\n var currentTime = getCurrentDateTime();\n var currentMinute = currentTime.getMinutes();\n var newMinute = doStepMinute(currentMinute, props.stepMinute);\n newMinute = newMinute > 59 ? newMinute - 60 : newMinute;\n if (validateMinute(newMinute, currentTime)) {\n if (props.maxDate && props.maxDate.toDateString() === currentTime.toDateString() && props.maxDate.getMinutes() === newMinute) {\n if (props.maxDate.getSeconds() < currentTime.getSeconds()) {\n if (props.maxDate.getMilliseconds() < currentTime.getMilliseconds()) {\n updateTime(event, currentTime.getHours(), newMinute, props.maxDate.getSeconds(), props.maxDate.getMilliseconds());\n } else {\n updateTime(event, currentTime.getHours(), newMinute, props.maxDate.getSeconds(), currentTime.getMilliseconds());\n }\n } else {\n updateTime(event, currentTime.getHours(), newMinute, currentTime.getSeconds(), currentTime.getMilliseconds());\n }\n } else {\n updateTime(event, currentTime.getHours(), newMinute, currentTime.getSeconds(), currentTime.getMilliseconds());\n }\n }\n event.preventDefault();\n };\n var decrementMinute = function decrementMinute(event) {\n var currentTime = getCurrentDateTime();\n var currentMinute = currentTime.getMinutes();\n var newMinute = doStepMinute(currentMinute, -props.stepMinute);\n newMinute = newMinute < 0 ? newMinute + 60 : newMinute;\n if (validateMinute(newMinute, currentTime)) {\n if (props.minDate && props.minDate.toDateString() === currentTime.toDateString() && props.minDate.getMinutes() === newMinute) {\n if (props.minDate.getSeconds() > currentTime.getSeconds()) {\n if (props.minDate.getMilliseconds() > currentTime.getMilliseconds()) {\n updateTime(event, currentTime.getHours(), newMinute, props.minDate.getSeconds(), props.minDate.getMilliseconds());\n } else {\n updateTime(event, currentTime.getHours(), newMinute, props.minDate.getSeconds(), currentTime.getMilliseconds());\n }\n } else {\n updateTime(event, currentTime.getHours(), newMinute, currentTime.getSeconds(), currentTime.getMilliseconds());\n }\n } else {\n updateTime(event, currentTime.getHours(), newMinute, currentTime.getSeconds(), currentTime.getMilliseconds());\n }\n }\n event.preventDefault();\n };\n var incrementSecond = function incrementSecond(event) {\n var currentTime = getCurrentDateTime();\n var currentSecond = currentTime.getSeconds();\n var newSecond = currentSecond + props.stepSecond;\n newSecond = newSecond > 59 ? newSecond - 60 : newSecond;\n if (validateSecond(newSecond, currentTime)) {\n if (props.maxDate && props.maxDate.toDateString() === currentTime.toDateString() && props.maxDate.getSeconds() === newSecond) {\n if (props.maxDate.getMilliseconds() < currentTime.getMilliseconds()) {\n updateTime(event, currentTime.getHours(), currentTime.getMinutes(), newSecond, props.maxDate.getMilliseconds());\n } else {\n updateTime(event, currentTime.getHours(), currentTime.getMinutes(), newSecond, currentTime.getMilliseconds());\n }\n } else {\n updateTime(event, currentTime.getHours(), currentTime.getMinutes(), newSecond, currentTime.getMilliseconds());\n }\n }\n event.preventDefault();\n };\n var decrementSecond = function decrementSecond(event) {\n var currentTime = getCurrentDateTime();\n var currentSecond = currentTime.getSeconds();\n var newSecond = currentSecond - props.stepSecond;\n newSecond = newSecond < 0 ? newSecond + 60 : newSecond;\n if (validateSecond(newSecond, currentTime)) {\n if (props.minDate && props.minDate.toDateString() === currentTime.toDateString() && props.minDate.getSeconds() === newSecond) {\n if (props.minDate.getMilliseconds() > currentTime.getMilliseconds()) {\n updateTime(event, currentTime.getHours(), currentTime.getMinutes(), newSecond, props.minDate.getMilliseconds());\n } else {\n updateTime(event, currentTime.getHours(), currentTime.getMinutes(), newSecond, currentTime.getMilliseconds());\n }\n } else {\n updateTime(event, currentTime.getHours(), currentTime.getMinutes(), newSecond, currentTime.getMilliseconds());\n }\n }\n event.preventDefault();\n };\n var incrementMilliSecond = function incrementMilliSecond(event) {\n var currentTime = getCurrentDateTime();\n var currentMillisecond = currentTime.getMilliseconds();\n var newMillisecond = currentMillisecond + props.stepMillisec;\n newMillisecond = newMillisecond > 999 ? newMillisecond - 1000 : newMillisecond;\n if (validateMillisecond(newMillisecond, currentTime)) {\n updateTime(event, currentTime.getHours(), currentTime.getMinutes(), currentTime.getSeconds(), newMillisecond);\n }\n event.preventDefault();\n };\n var decrementMilliSecond = function decrementMilliSecond(event) {\n var currentTime = getCurrentDateTime();\n var currentMillisecond = currentTime.getMilliseconds();\n var newMillisecond = currentMillisecond - props.stepMillisec;\n newMillisecond = newMillisecond < 0 ? newMillisecond + 999 : newMillisecond;\n if (validateMillisecond(newMillisecond, currentTime)) {\n updateTime(event, currentTime.getHours(), currentTime.getMinutes(), currentTime.getSeconds(), newMillisecond);\n }\n event.preventDefault();\n };\n var toggleAmPm = function toggleAmPm(event) {\n var currentTime = getCurrentDateTime();\n var currentHour = currentTime.getHours();\n var newHour = currentHour >= 12 ? currentHour - 12 : currentHour + 12;\n if (validateHour(convertTo24Hour(newHour, !(currentHour > 11)), currentTime)) {\n updateTime(event, newHour, currentTime.getMinutes(), currentTime.getSeconds(), currentTime.getMilliseconds());\n }\n event.preventDefault();\n };\n var getViewDate = function getViewDate(date) {\n var propValue = props.value;\n var viewDate = date || (props.onViewDateChange ? props.viewDate : viewDateState);\n if (Array.isArray(propValue)) {\n propValue = propValue[0];\n }\n return viewDate && isValidDate(viewDate) ? viewDate : propValue && isValidDate(propValue) ? propValue : new Date();\n };\n var getCurrentDateTime = function getCurrentDateTime() {\n if (isSingleSelection()) {\n return props.value && props.value instanceof Date ? props.value : getViewDate();\n } else if (isMultipleSelection()) {\n if (props.value && props.value.length) {\n return props.value[props.value.length - 1];\n }\n } else if (isRangeSelection()) {\n if (props.value && props.value.length) {\n var startDate = props.value[0];\n var endDate = props.value[1];\n return endDate || startDate;\n }\n }\n return new Date();\n };\n var isValidDate = function isValidDate(date) {\n return date instanceof Date && !isNaN(date);\n };\n var convertTo24Hour = function convertTo24Hour(hour, pm) {\n if (props.hourFormat == '12') {\n return hour === 12 ? pm ? 12 : 0 : pm ? hour + 12 : hour;\n }\n return hour;\n };\n var validateHour = function validateHour(hour, value) {\n var valid = true;\n var valueDateString = value ? value.toDateString() : null;\n if (props.minDate && valueDateString && props.minDate.toDateString() === valueDateString) {\n if (props.minDate.getHours() > hour) {\n valid = false;\n }\n }\n if (props.maxDate && valueDateString && props.maxDate.toDateString() === valueDateString) {\n if (props.maxDate.getHours() < hour) {\n valid = false;\n }\n }\n return valid;\n };\n var validateMinute = function validateMinute(minute, value) {\n var valid = true;\n var valueDateString = value ? value.toDateString() : null;\n if (props.minDate && valueDateString && props.minDate.toDateString() === valueDateString) {\n if (value.getHours() === props.minDate.getHours()) {\n if (props.minDate.getMinutes() > minute) {\n valid = false;\n }\n }\n }\n if (props.maxDate && valueDateString && props.maxDate.toDateString() === valueDateString) {\n if (value.getHours() === props.maxDate.getHours()) {\n if (props.maxDate.getMinutes() < minute) {\n valid = false;\n }\n }\n }\n return valid;\n };\n var validateSecond = function validateSecond(second, value) {\n var valid = true;\n var valueDateString = value ? value.toDateString() : null;\n if (props.minDate && valueDateString && props.minDate.toDateString() === valueDateString) {\n if (value.getHours() === props.minDate.getHours() && value.getMinutes() === props.minDate.getMinutes()) {\n if (props.minDate.getSeconds() > second) {\n valid = false;\n }\n }\n }\n if (props.maxDate && valueDateString && props.maxDate.toDateString() === valueDateString) {\n if (value.getHours() === props.maxDate.getHours() && value.getMinutes() === props.maxDate.getMinutes()) {\n if (props.maxDate.getSeconds() < second) {\n valid = false;\n }\n }\n }\n return valid;\n };\n var validateMillisecond = function validateMillisecond(millisecond, value) {\n var valid = true;\n var valueDateString = value ? value.toDateString() : null;\n if (props.minDate && valueDateString && props.minDate.toDateString() === valueDateString) {\n if (value.getHours() === props.minDate.getHours() && value.getSeconds() === props.minDate.getSeconds() && value.getMinutes() === props.minDate.getMinutes()) {\n if (props.minDate.getMilliseconds() > millisecond) {\n valid = false;\n }\n }\n }\n if (props.maxDate && valueDateString && props.maxDate.toDateString() === valueDateString) {\n if (value.getHours() === props.maxDate.getHours() && value.getSeconds() === props.maxDate.getSeconds() && value.getMinutes() === props.maxDate.getMinutes()) {\n if (props.maxDate.getMilliseconds() < millisecond) {\n valid = false;\n }\n }\n }\n return valid;\n };\n var validateDate = function validateDate(value) {\n if (props.yearNavigator) {\n var viewYear = value.getFullYear();\n var minRangeYear = props.yearRange ? parseInt(props.yearRange.split(':')[0], 10) : null;\n var maxRangeYear = props.yearRange ? parseInt(props.yearRange.split(':')[1], 10) : null;\n var minYear = props.minDate && minRangeYear != null ? Math.max(props.minDate.getFullYear(), minRangeYear) : props.minDate || minRangeYear;\n var maxYear = props.maxDate && maxRangeYear != null ? Math.min(props.maxDate.getFullYear(), maxRangeYear) : props.maxDate || maxRangeYear;\n if (minYear && minYear > viewYear) {\n viewYear = minYear;\n }\n if (maxYear && maxYear < viewYear) {\n viewYear = maxYear;\n }\n value.setFullYear(viewYear);\n }\n if (props.monthNavigator && props.view !== 'month') {\n var viewMonth = value.getMonth();\n var viewMonthWithMinMax = parseInt(isInMinYear(value) && Math.max(props.minDate.getMonth(), viewMonth).toString() || isInMaxYear(value) && Math.min(props.maxDate.getMonth(), viewMonth).toString() || viewMonth);\n value.setMonth(viewMonthWithMinMax);\n }\n };\n var updateTime = function updateTime(event, hour, minute, second, millisecond) {\n var newDateTime = getCurrentDateTime();\n newDateTime.setHours(hour);\n newDateTime.setMinutes(minute);\n newDateTime.setSeconds(second);\n newDateTime.setMilliseconds(millisecond);\n if (isMultipleSelection()) {\n if (props.value && props.value.length) {\n var value = _toConsumableArray(props.value);\n value[value.length - 1] = newDateTime;\n newDateTime = value;\n } else {\n newDateTime = [newDateTime];\n }\n } else if (isRangeSelection()) {\n if (props.value && props.value.length) {\n var startDate = props.value[0];\n var endDate = props.value[1];\n newDateTime = endDate ? [startDate, newDateTime] : [newDateTime, null];\n } else {\n newDateTime = [newDateTime, null];\n }\n }\n updateModel(event, newDateTime);\n if (props.onSelect) {\n props.onSelect({\n originalEvent: event,\n value: newDateTime\n });\n }\n updateInputfield(newDateTime);\n };\n var updateViewDate = function updateViewDate(event, value) {\n validateDate(value);\n if (props.onViewDateChange) {\n props.onViewDateChange({\n originalEvent: event,\n value: value\n });\n } else {\n viewStateChanged.current = true;\n setViewDateState(value);\n }\n setCurrentMonth(value.getMonth());\n setCurrentYear(value.getFullYear());\n };\n var setNavigationState = function setNavigationState(newViewDate) {\n if (!props.showMinMaxRange || props.view !== 'date' || !overlayRef.current) {\n return;\n }\n var navPrev = DomHandler.findSingle(overlayRef.current, '.p-datepicker-prev');\n var navNext = DomHandler.findSingle(overlayRef.current, '.p-datepicker-next');\n if (props.disabled) {\n DomHandler.addClass(navPrev, 'p-disabled');\n DomHandler.addClass(navNext, 'p-disabled');\n return;\n }\n\n // previous (check first day of month at 00:00:00)\n if (props.minDate) {\n var firstDayOfMonth = new Date(newViewDate.getTime());\n if (firstDayOfMonth.getMonth() === 0) {\n firstDayOfMonth.setMonth(11, 1);\n firstDayOfMonth.setFullYear(firstDayOfMonth.getFullYear() - 1);\n } else {\n firstDayOfMonth.setMonth(firstDayOfMonth.getMonth() - 1, 1);\n }\n firstDayOfMonth.setHours(0);\n firstDayOfMonth.setMinutes(0);\n firstDayOfMonth.setSeconds(0);\n if (props.minDate > firstDayOfMonth) {\n DomHandler.addClass(navPrev, 'p-disabled');\n } else {\n DomHandler.removeClass(navPrev, 'p-disabled');\n }\n }\n\n // next (check last day of month at 11:59:59)\n if (props.maxDate) {\n var lastDayOfMonth = new Date(newViewDate.getTime());\n if (lastDayOfMonth.getMonth() === 11) {\n lastDayOfMonth.setMonth(0, 1);\n lastDayOfMonth.setFullYear(lastDayOfMonth.getFullYear() + 1);\n } else {\n lastDayOfMonth.setMonth(lastDayOfMonth.getMonth() + 1, 1);\n }\n lastDayOfMonth.setHours(0);\n lastDayOfMonth.setMinutes(0);\n lastDayOfMonth.setSeconds(0);\n lastDayOfMonth.setSeconds(-1);\n if (props.maxDate < lastDayOfMonth) {\n DomHandler.addClass(navNext, 'p-disabled');\n } else {\n DomHandler.removeClass(navNext, 'p-disabled');\n }\n }\n };\n var onDateCellKeydown = function onDateCellKeydown(event, date, groupIndex) {\n var cellContent = event.currentTarget;\n var cell = cellContent.parentElement;\n switch (event.which) {\n //down arrow\n case 40:\n {\n cellContent.tabIndex = '-1';\n var cellIndex = DomHandler.index(cell);\n var nextRow = cell.parentElement.nextElementSibling;\n if (nextRow) {\n var focusCell = nextRow.children[cellIndex].children[0];\n if (DomHandler.hasClass(focusCell, 'p-disabled')) {\n navigation.current = {\n backward: false\n };\n navForward(event);\n } else {\n nextRow.children[cellIndex].children[0].tabIndex = '0';\n nextRow.children[cellIndex].children[0].focus();\n }\n } else {\n navigation.current = {\n backward: false\n };\n navForward(event);\n }\n event.preventDefault();\n break;\n }\n\n //up arrow\n case 38:\n {\n cellContent.tabIndex = '-1';\n var _cellIndex = DomHandler.index(cell);\n var prevRow = cell.parentElement.previousElementSibling;\n if (prevRow) {\n var _focusCell = prevRow.children[_cellIndex].children[0];\n if (DomHandler.hasClass(_focusCell, 'p-disabled')) {\n navigation.current = {\n backward: true\n };\n navBackward(event);\n } else {\n _focusCell.tabIndex = '0';\n _focusCell.focus();\n }\n } else {\n navigation.current = {\n backward: true\n };\n navBackward(event);\n }\n event.preventDefault();\n break;\n }\n\n //left arrow\n case 37:\n {\n cellContent.tabIndex = '-1';\n var prevCell = cell.previousElementSibling;\n if (prevCell) {\n var _focusCell2 = prevCell.children[0];\n if (DomHandler.hasClass(_focusCell2, 'p-disabled')) {\n navigateToMonth(true, groupIndex, event);\n } else {\n _focusCell2.tabIndex = '0';\n _focusCell2.focus();\n }\n } else {\n navigateToMonth(true, groupIndex, event);\n }\n event.preventDefault();\n break;\n }\n\n //right arrow\n case 39:\n {\n cellContent.tabIndex = '-1';\n var nextCell = cell.nextElementSibling;\n if (nextCell) {\n var _focusCell3 = nextCell.children[0];\n if (DomHandler.hasClass(_focusCell3, 'p-disabled')) {\n navigateToMonth(false, groupIndex, event);\n } else {\n _focusCell3.tabIndex = '0';\n _focusCell3.focus();\n }\n } else {\n navigateToMonth(false, groupIndex, event);\n }\n event.preventDefault();\n break;\n }\n\n //enter\n case 13:\n {\n onDateSelect(event, date);\n event.preventDefault();\n break;\n }\n\n //escape\n case 27:\n {\n hide(null, reFocusInputField);\n event.preventDefault();\n break;\n }\n\n //tab\n case 9:\n {\n trapFocus(event);\n break;\n }\n }\n };\n var navigateToMonth = function navigateToMonth(prev, groupIndex, event) {\n if (prev) {\n if (props.numberOfMonths === 1 || groupIndex === 0) {\n navigation.current = {\n backward: true\n };\n navBackward(event);\n } else {\n var prevMonthContainer = overlayRef.current.children[groupIndex - 1];\n var cells = DomHandler.find(prevMonthContainer, '.p-datepicker-calendar td span:not(.p-disabled)');\n var focusCell = cells[cells.length - 1];\n focusCell.tabIndex = '0';\n focusCell.focus();\n }\n } else {\n if (props.numberOfMonths === 1 || groupIndex === props.numberOfMonths - 1) {\n navigation.current = {\n backward: false\n };\n navForward(event);\n } else {\n var nextMonthContainer = overlayRef.current.children[groupIndex + 1];\n var _focusCell4 = DomHandler.findSingle(nextMonthContainer, '.p-datepicker-calendar td span:not(.p-disabled)');\n _focusCell4.tabIndex = '0';\n _focusCell4.focus();\n }\n }\n };\n var onDateSelect = function onDateSelect(event, dateMeta, timeMeta) {\n if (props.disabled || !dateMeta.selectable) {\n event.preventDefault();\n return;\n }\n DomHandler.find(overlayRef.current, '.p-datepicker-calendar td span:not(.p-disabled)').forEach(function (cell) {\n return cell.tabIndex = -1;\n });\n event.currentTarget.focus();\n if (isMultipleSelection()) {\n if (isSelected(dateMeta)) {\n var value = props.value.filter(function (date, i) {\n return !isDateEquals(date, dateMeta);\n });\n updateModel(event, value);\n updateInputfield(value);\n } else if (!props.maxDateCount || !props.value || props.maxDateCount > props.value.length) {\n selectDate(event, dateMeta, timeMeta);\n }\n } else {\n selectDate(event, dateMeta, timeMeta);\n }\n if (!props.inline && isSingleSelection() && (!props.showTime || props.hideOnDateTimeSelect)) {\n setTimeout(function () {\n hide('dateselect');\n }, 100);\n if (touchUIMask.current) {\n disableModality();\n }\n }\n event.preventDefault();\n };\n var selectTime = function selectTime(date, timeMeta) {\n if (props.showTime) {\n var hours, minutes, seconds, milliseconds;\n if (timeMeta) {\n hours = timeMeta.hours;\n minutes = timeMeta.minutes;\n seconds = timeMeta.seconds;\n milliseconds = timeMeta.milliseconds;\n } else {\n var time = getCurrentDateTime();\n var _ref2 = [time.getHours(), time.getMinutes(), time.getSeconds(), time.getMilliseconds()];\n hours = _ref2[0];\n minutes = _ref2[1];\n seconds = _ref2[2];\n milliseconds = _ref2[3];\n }\n date.setHours(hours);\n date.setMinutes(minutes);\n date.setSeconds(seconds);\n date.setMilliseconds(milliseconds);\n }\n };\n var selectDate = function selectDate(event, dateMeta, timeMeta) {\n var date = new Date(dateMeta.year, dateMeta.month, dateMeta.day);\n selectTime(date, timeMeta);\n if (props.minDate && props.minDate > date) {\n date = props.minDate;\n }\n if (props.maxDate && props.maxDate < date) {\n date = props.maxDate;\n }\n var selectedValues = date;\n if (isSingleSelection()) {\n updateModel(event, date);\n } else if (isMultipleSelection()) {\n selectedValues = props.value ? [].concat(_toConsumableArray(props.value), [date]) : [date];\n updateModel(event, selectedValues);\n } else if (isRangeSelection()) {\n if (props.value && props.value.length) {\n var startDate = props.value[0];\n var endDate = props.value[1];\n if (!endDate) {\n if (date.getTime() >= startDate.getTime()) {\n endDate = date;\n } else {\n endDate = startDate;\n startDate = date;\n }\n } else {\n startDate = date;\n endDate = null;\n }\n selectedValues = [startDate, endDate];\n updateModel(event, selectedValues);\n } else {\n selectedValues = [date, null];\n updateModel(event, selectedValues);\n }\n }\n if (props.onSelect) {\n props.onSelect({\n originalEvent: event,\n value: date\n });\n }\n updateInputfield(selectedValues);\n };\n var decrementDecade = function decrementDecade() {\n var _currentYear = currentYear - 10;\n setCurrentYear(_currentYear);\n return _currentYear;\n };\n var incrementDecade = function incrementDecade() {\n var _currentYear = currentYear + 10;\n setCurrentYear(_currentYear);\n return _currentYear;\n };\n var switchToMonthView = function switchToMonthView(event) {\n setCurrentView('month');\n event.preventDefault();\n };\n var switchToYearView = function switchToYearView(event) {\n setCurrentView('year');\n event.preventDefault();\n };\n var onMonthSelect = function onMonthSelect(event, month) {\n if (props.view === 'month') {\n onDateSelect(event, {\n year: currentYear,\n month: month,\n day: 1,\n selectable: true\n });\n event.preventDefault();\n } else {\n setCurrentMonth(month);\n createMonthsMeta(month, currentYear);\n var currentDate = new Date(getCurrentDateTime().getTime());\n currentDate.setDate(1); // #2948 always set to 1st of month\n currentDate.setMonth(month);\n currentDate.setYear(currentYear);\n setViewDateState(currentDate);\n setCurrentView('date');\n props.onMonthChange && props.onMonthChange({\n month: month + 1,\n year: currentYear\n });\n }\n };\n var onYearSelect = function onYearSelect(event, year) {\n if (props.view === 'year') {\n onDateSelect(event, {\n year: year,\n month: 0,\n day: 1,\n selectable: true\n });\n } else {\n setCurrentYear(year);\n setCurrentView('month');\n props.onMonthChange && props.onMonthChange({\n month: currentMonth + 1,\n year: year\n });\n }\n };\n var updateModel = function updateModel(event, value) {\n if (props.onChange) {\n var newValue = value && value instanceof Date ? new Date(value.getTime()) : value;\n viewStateChanged.current = true;\n props.onChange({\n originalEvent: event,\n value: newValue,\n stopPropagation: function stopPropagation() {},\n preventDefault: function preventDefault() {},\n target: {\n name: props.name,\n id: props.id,\n value: newValue\n }\n });\n }\n };\n var show = function show(type) {\n if (props.onVisibleChange) {\n props.onVisibleChange({\n visible: true,\n type: type\n });\n } else {\n setOverlayVisibleState(true);\n overlayEventListener.current = function (e) {\n if (!isOutsideClicked(e)) {\n isOverlayClicked.current = true;\n }\n };\n OverlayService.on('overlay-click', overlayEventListener.current);\n }\n };\n var hide = function hide(type, callback) {\n var _hideCallback = function _hideCallback() {\n viewStateChanged.current = false;\n ignoreFocusFunctionality.current = false;\n isOverlayClicked.current = false;\n callback && callback();\n OverlayService.off('overlay-click', overlayEventListener.current);\n overlayEventListener.current = null;\n };\n props.touchUI && disableModality();\n if (props.onVisibleChange) {\n props.onVisibleChange({\n visible: false,\n type: type,\n callback: _hideCallback\n });\n } else {\n setOverlayVisibleState(false);\n _hideCallback();\n }\n };\n var onOverlayEnter = function onOverlayEnter() {\n if (props.autoZIndex) {\n var key = props.touchUI ? 'modal' : 'overlay';\n ZIndexUtils.set(key, overlayRef.current, PrimeReact.autoZIndex, props.baseZIndex || PrimeReact.zIndex[key]);\n }\n alignOverlay();\n };\n var onOverlayEntered = function onOverlayEntered() {\n bindOverlayListener();\n props.onShow && props.onShow();\n };\n var onOverlayExit = function onOverlayExit() {\n unbindOverlayListener();\n };\n var onOverlayExited = function onOverlayExited() {\n ZIndexUtils.clear(overlayRef.current);\n props.onHide && props.onHide();\n };\n var appendDisabled = function appendDisabled() {\n return props.appendTo === 'self' || props.inline;\n };\n var alignOverlay = function alignOverlay() {\n if (props.touchUI) {\n enableModality();\n } else if (overlayRef && overlayRef.current && inputRef && inputRef.current) {\n DomHandler.alignOverlay(overlayRef.current, inputRef.current, props.appendTo || PrimeReact.appendTo);\n if (appendDisabled()) {\n DomHandler.relativePosition(overlayRef.current, inputRef.current);\n } else {\n if (currentView === 'date') {\n overlayRef.current.style.width = DomHandler.getOuterWidth(overlayRef.current) + 'px';\n overlayRef.current.style.minWidth = DomHandler.getOuterWidth(inputRef.current) + 'px';\n } else {\n overlayRef.current.style.width = DomHandler.getOuterWidth(inputRef.current) + 'px';\n }\n DomHandler.absolutePosition(overlayRef.current, inputRef.current);\n }\n }\n };\n var enableModality = function enableModality() {\n if (!touchUIMask.current) {\n touchUIMask.current = document.createElement('div');\n touchUIMask.current.style.zIndex = String(ZIndexUtils.get(overlayRef.current) - 1);\n DomHandler.addMultipleClasses(touchUIMask.current, 'p-component-overlay p-datepicker-mask p-datepicker-mask-scrollblocker p-component-overlay-enter');\n touchUIMaskClickListener.current = function () {\n disableModality();\n hide();\n };\n touchUIMask.current.addEventListener('click', touchUIMaskClickListener.current);\n document.body.appendChild(touchUIMask.current);\n DomHandler.addClass(document.body, 'p-overflow-hidden');\n }\n };\n var disableModality = function disableModality() {\n if (touchUIMask.current) {\n DomHandler.addClass(touchUIMask.current, 'p-component-overlay-leave');\n touchUIMask.current.addEventListener('animationend', function () {\n destroyMask();\n });\n }\n };\n var destroyMask = function destroyMask() {\n if (touchUIMask.current) {\n touchUIMask.current.removeEventListener('click', touchUIMaskClickListener.current);\n touchUIMaskClickListener.current = null;\n document.body.removeChild(touchUIMask.current);\n touchUIMask.current = null;\n }\n var bodyChildren = document.body.children;\n var hasBlockerMasks;\n for (var i = 0; i < bodyChildren.length; i++) {\n var bodyChild = bodyChildren[i];\n if (DomHandler.hasClass(bodyChild, 'p-datepicker-mask-scrollblocker')) {\n hasBlockerMasks = true;\n break;\n }\n }\n if (!hasBlockerMasks) {\n DomHandler.removeClass(document.body, 'p-overflow-hidden');\n }\n };\n var isOutsideClicked = function isOutsideClicked(event) {\n return elementRef.current && !(elementRef.current.isSameNode(event.target) || isNavIconClicked(event.target) || elementRef.current.contains(event.target) || overlayRef.current && overlayRef.current.contains(event.target));\n };\n var isNavIconClicked = function isNavIconClicked(target) {\n 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');\n };\n var getFirstDayOfMonthIndex = function getFirstDayOfMonthIndex(month, year) {\n var day = new Date();\n day.setDate(1);\n day.setMonth(month);\n day.setFullYear(year);\n var dayIndex = day.getDay() + getSundayIndex();\n return dayIndex >= 7 ? dayIndex - 7 : dayIndex;\n };\n var getDaysCountInMonth = function getDaysCountInMonth(month, year) {\n return 32 - daylightSavingAdjust(new Date(year, month, 32)).getDate();\n };\n var getDaysCountInPrevMonth = function getDaysCountInPrevMonth(month, year) {\n var prev = getPreviousMonthAndYear(month, year);\n return getDaysCountInMonth(prev.month, prev.year);\n };\n var daylightSavingAdjust = function daylightSavingAdjust(date) {\n if (!date) {\n return null;\n }\n date.setHours(date.getHours() > 12 ? date.getHours() + 2 : 0);\n return date;\n };\n var getPreviousMonthAndYear = function getPreviousMonthAndYear(month, year) {\n var m, y;\n if (month === 0) {\n m = 11;\n y = year - 1;\n } else {\n m = month - 1;\n y = year;\n }\n return {\n month: m,\n year: y\n };\n };\n var getNextMonthAndYear = function getNextMonthAndYear(month, year) {\n var m, y;\n if (month === 11) {\n m = 0;\n y = year + 1;\n } else {\n m = month + 1;\n y = year;\n }\n return {\n month: m,\n year: y\n };\n };\n var getSundayIndex = function getSundayIndex() {\n var firstDayOfWeek = localeOption('firstDayOfWeek', props.locale);\n return firstDayOfWeek > 0 ? 7 - firstDayOfWeek : 0;\n };\n var createWeekDaysMeta = function createWeekDaysMeta() {\n var weekDays = [];\n var _localeOptions = localeOptions(props.locale),\n dayIndex = _localeOptions.firstDayOfWeek,\n dayNamesMin = _localeOptions.dayNamesMin;\n for (var i = 0; i < 7; i++) {\n weekDays.push(dayNamesMin[dayIndex]);\n dayIndex = dayIndex === 6 ? 0 : ++dayIndex;\n }\n return weekDays;\n };\n var createMonthsMeta = function createMonthsMeta(month, year) {\n var months = [];\n for (var i = 0; i < props.numberOfMonths; i++) {\n var m = month + i;\n var y = year;\n if (m > 11) {\n m = m % 11 - 1;\n y = year + 1;\n }\n months.push(createMonthMeta(m, y));\n }\n return months;\n };\n var createMonthMeta = function createMonthMeta(month, year) {\n var dates = [];\n var firstDay = getFirstDayOfMonthIndex(month, year);\n var daysLength = getDaysCountInMonth(month, year);\n var prevMonthDaysLength = getDaysCountInPrevMonth(month, year);\n var dayNo = 1;\n var today = new Date();\n var weekNumbers = [];\n var monthRows = Math.ceil((daysLength + firstDay) / 7);\n for (var i = 0; i < monthRows; i++) {\n var week = [];\n if (i === 0) {\n for (var j = prevMonthDaysLength - firstDay + 1; j <= prevMonthDaysLength; j++) {\n var prev = getPreviousMonthAndYear(month, year);\n week.push({\n day: j,\n month: prev.month,\n year: prev.year,\n otherMonth: true,\n today: isToday(today, j, prev.month, prev.year),\n selectable: isSelectable(j, prev.month, prev.year, true)\n });\n }\n var remainingDaysLength = 7 - week.length;\n for (var _j = 0; _j < remainingDaysLength; _j++) {\n week.push({\n day: dayNo,\n month: month,\n year: year,\n today: isToday(today, dayNo, month, year),\n selectable: isSelectable(dayNo, month, year, false)\n });\n dayNo++;\n }\n } else {\n for (var _j2 = 0; _j2 < 7; _j2++) {\n if (dayNo > daysLength) {\n var next = getNextMonthAndYear(month, year);\n week.push({\n day: dayNo - daysLength,\n month: next.month,\n year: next.year,\n otherMonth: true,\n today: isToday(today, dayNo - daysLength, next.month, next.year),\n selectable: isSelectable(dayNo - daysLength, next.month, next.year, true)\n });\n } else {\n week.push({\n day: dayNo,\n month: month,\n year: year,\n today: isToday(today, dayNo, month, year),\n selectable: isSelectable(dayNo, month, year, false)\n });\n }\n dayNo++;\n }\n }\n if (props.showWeek) {\n weekNumbers.push(getWeekNumber(new Date(week[0].year, week[0].month, week[0].day)));\n }\n dates.push(week);\n }\n return {\n month: month,\n year: year,\n dates: dates,\n weekNumbers: weekNumbers\n };\n };\n var getWeekNumber = function getWeekNumber(date) {\n var checkDate = new Date(date.getTime());\n checkDate.setDate(checkDate.getDate() + 4 - (checkDate.getDay() || 7));\n var time = checkDate.getTime();\n checkDate.setMonth(0);\n checkDate.setDate(1);\n return Math.floor(Math.round((time - checkDate.getTime()) / 86400000) / 7) + 1;\n };\n var isSelectable = function isSelectable(day, month, year, otherMonth) {\n var validMin = true;\n var validMax = true;\n var validDate = true;\n var validDay = true;\n var validMonth = true;\n if (props.minDate) {\n if (props.minDate.getFullYear() > year) {\n validMin = false;\n } else if (props.minDate.getFullYear() === year) {\n if (props.minDate.getMonth() > month) {\n validMin = false;\n } else if (props.minDate.getMonth() === month) {\n if (day > 0 && props.minDate.getDate() > day) {\n validMin = false;\n }\n }\n }\n }\n if (props.maxDate) {\n if (props.maxDate.getFullYear() < year) {\n validMax = false;\n } else if (props.maxDate.getFullYear() === year) {\n if (props.maxDate.getMonth() < month) {\n validMax = false;\n } else if (props.maxDate.getMonth() === month) {\n if (day > 0 && props.maxDate.getDate() < day) {\n validMax = false;\n }\n }\n }\n }\n if (props.disabledDates) {\n validDate = !isDateDisabled(day, month, year);\n }\n if (props.disabledDays) {\n validDay = !isDayDisabled(day, month, year);\n }\n if (props.selectOtherMonths === false && otherMonth) {\n validMonth = false;\n }\n return validMin && validMax && validDate && validDay && validMonth;\n };\n var isSelectableTime = function isSelectableTime(value) {\n var validMin = true;\n var validMax = true;\n if (props.minDate && props.minDate.toDateString() === value.toDateString()) {\n if (props.minDate.getHours() > value.getHours()) {\n validMin = false;\n } else if (props.minDate.getHours() === value.getHours()) {\n if (props.minDate.getMinutes() > value.getMinutes()) {\n validMin = false;\n } else if (props.minDate.getMinutes() === value.getMinutes()) {\n if (props.minDate.getSeconds() > value.getSeconds()) {\n validMin = false;\n } else if (props.minDate.getSeconds() === value.getSeconds()) {\n if (props.minDate.getMilliseconds() > value.getMilliseconds()) {\n validMin = false;\n }\n }\n }\n }\n }\n if (props.maxDate && props.maxDate.toDateString() === value.toDateString()) {\n if (props.maxDate.getHours() < value.getHours()) {\n validMax = false;\n } else if (props.maxDate.getHours() === value.getHours()) {\n if (props.maxDate.getMinutes() < value.getMinutes()) {\n validMax = false;\n } else if (props.maxDate.getMinutes() === value.getMinutes()) {\n if (props.maxDate.getSeconds() < value.getSeconds()) {\n validMax = false;\n } else if (props.maxDate.getSeconds() === value.getSeconds()) {\n if (props.maxDate.getMilliseconds() < value.getMilliseconds()) {\n validMax = false;\n }\n }\n }\n }\n }\n return validMin && validMax;\n };\n var isSelected = function isSelected(dateMeta) {\n if (props.value) {\n if (isSingleSelection()) {\n return isDateEquals(props.value, dateMeta);\n } else if (isMultipleSelection()) {\n var selected = false;\n var _iterator = _createForOfIteratorHelper(props.value),\n _step;\n try {\n for (_iterator.s(); !(_step = _iterator.n()).done;) {\n var date = _step.value;\n selected = isDateEquals(date, dateMeta);\n if (selected) {\n break;\n }\n }\n } catch (err) {\n _iterator.e(err);\n } finally {\n _iterator.f();\n }\n return selected;\n } else if (isRangeSelection()) {\n if (props.value[1]) return isDateEquals(props.value[0], dateMeta) || isDateEquals(props.value[1], dateMeta) || isDateBetween(props.value[0], props.value[1], dateMeta);else {\n return isDateEquals(props.value[0], dateMeta);\n }\n }\n } else {\n return false;\n }\n };\n var isComparable = function isComparable() {\n return props.value != null && typeof props.value !== 'string';\n };\n var isMonthSelected = function isMonthSelected(month) {\n if (isComparable()) {\n var value = isRangeSelection() ? props.value[0] : props.value;\n return !isMultipleSelection() ? value.getMonth() === month && value.getFullYear() === currentYear : false;\n }\n return false;\n };\n var isYearSelected = function isYearSelected(year) {\n if (isComparable()) {\n var value = isRangeSelection() ? props.value[0] : props.value;\n return !isMultipleSelection() && isComparable() ? value.getFullYear() === year : false;\n }\n return false;\n };\n var switchViewButtonDisabled = function switchViewButtonDisabled() {\n return props.numberOfMonths > 1 || props.disabled;\n };\n var isDateEquals = function isDateEquals(value, dateMeta) {\n if (value && value instanceof Date) return value.getDate() === dateMeta.day && value.getMonth() === dateMeta.month && value.getFullYear() === dateMeta.year;else return false;\n };\n var isDateBetween = function isDateBetween(start, end, dateMeta) {\n var between = false;\n if (start && end) {\n var date = new Date(dateMeta.year, dateMeta.month, dateMeta.day);\n return start.getTime() <= date.getTime() && end.getTime() >= date.getTime();\n }\n return between;\n };\n var isSingleSelection = function isSingleSelection() {\n return props.selectionMode === 'single';\n };\n var isRangeSelection = function isRangeSelection() {\n return props.selectionMode === 'range';\n };\n var isMultipleSelection = function isMultipleSelection() {\n return props.selectionMode === 'multiple';\n };\n var isToday = function isToday(today, day, month, year) {\n return today.getDate() === day && today.getMonth() === month && today.getFullYear() === year;\n };\n var isDateDisabled = function isDateDisabled(day, month, year) {\n return props.disabledDates ? props.disabledDates.some(function (d) {\n return d.getFullYear() === year && d.getMonth() === month && d.getDate() === day;\n }) : false;\n };\n var isDayDisabled = function isDayDisabled(day, month, year) {\n if (props.disabledDays) {\n var weekday = new Date(year, month, day);\n var weekdayNumber = weekday.getDay();\n return props.disabledDays.indexOf(weekdayNumber) !== -1;\n }\n return false;\n };\n var updateInputfield = function updateInputfield(value) {\n if (!inputRef.current) {\n return;\n }\n var formattedValue = '';\n if (value) {\n try {\n if (isSingleSelection()) {\n formattedValue = isValidDate(value) ? formatDateTime(value) : props.keepInvalid ? value : '';\n } else if (isMultipleSelection()) {\n for (var i = 0; i < value.length; i++) {\n var selectedValue = value[i];\n var dateAsString = isValidDate(selectedValue) ? formatDateTime(selectedValue) : '';\n formattedValue += dateAsString;\n if (i !== value.length - 1) {\n formattedValue += ', ';\n }\n }\n } else if (isRangeSelection()) {\n if (value && value.length) {\n var startDate = value[0];\n var endDate = value[1];\n formattedValue = isValidDate(startDate) ? formatDateTime(startDate) : '';\n if (endDate) {\n formattedValue += isValidDate(endDate) ? ' - ' + formatDateTime(endDate) : '';\n }\n }\n }\n } catch (err) {\n formattedValue = value;\n }\n }\n inputRef.current.value = formattedValue;\n };\n var formatDateTime = function formatDateTime(date) {\n if (props.formatDateTime) {\n return props.formatDateTime(date);\n }\n var formattedValue = null;\n if (date) {\n if (props.timeOnly) {\n formattedValue = formatTime(date);\n } else {\n formattedValue = formatDate(date, getDateFormat());\n if (props.showTime) {\n formattedValue += ' ' + formatTime(date);\n }\n }\n }\n return formattedValue;\n };\n var formatDate = function formatDate(date, format) {\n if (!date) {\n return '';\n }\n var iFormat;\n var lookAhead = function lookAhead(match) {\n var matches = iFormat + 1 < format.length && format.charAt(iFormat + 1) === match;\n if (matches) {\n iFormat++;\n }\n return matches;\n },\n formatNumber = function formatNumber(match, value, len) {\n var num = '' + value;\n if (lookAhead(match)) {\n while (num.length < len) {\n num = '0' + num;\n }\n }\n return num;\n },\n formatName = function formatName(match, value, shortNames, longNames) {\n return lookAhead(match) ? longNames[value] : shortNames[value];\n };\n var output = '';\n var literal = false;\n var _localeOptions2 = localeOptions(props.locale),\n dayNamesShort = _localeOptions2.dayNamesShort,\n dayNames = _localeOptions2.dayNames,\n monthNamesShort = _localeOptions2.monthNamesShort,\n monthNames = _localeOptions2.monthNames;\n if (date) {\n for (iFormat = 0; iFormat < format.length; iFormat++) {\n if (literal) {\n if (format.charAt(iFormat) === \"'\" && !lookAhead(\"'\")) {\n literal = false;\n } else {\n output += format.charAt(iFormat);\n }\n } else {\n switch (format.charAt(iFormat)) {\n case 'd':\n output += formatNumber('d', date.getDate(), 2);\n break;\n case 'D':\n output += formatName('D', date.getDay(), dayNamesShort, dayNames);\n break;\n case 'o':\n output += formatNumber('o', Math.round((new Date(date.getFullYear(), date.getMonth(), date.getDate()).getTime() - new Date(date.getFullYear(), 0, 0).getTime()) / 86400000), 3);\n break;\n case 'm':\n output += formatNumber('m', date.getMonth() + 1, 2);\n break;\n case 'M':\n output += formatName('M', date.getMonth(), monthNamesShort, monthNames);\n break;\n case 'y':\n output += lookAhead('y') ? date.getFullYear() : (date.getFullYear() % 100 < 10 ? '0' : '') + date.getFullYear() % 100;\n break;\n case '@':\n output += date.getTime();\n break;\n case '!':\n output += date.getTime() * 10000 + ticksTo1970;\n break;\n case \"'\":\n if (lookAhead(\"'\")) {\n output += \"'\";\n } else {\n literal = true;\n }\n break;\n default:\n output += format.charAt(iFormat);\n }\n }\n }\n }\n return output;\n };\n var formatTime = function formatTime(date) {\n if (!date) {\n return '';\n }\n var output = '';\n var hours = date.getHours();\n var minutes = date.getMinutes();\n var seconds = date.getSeconds();\n var milliseconds = date.getMilliseconds();\n if (props.hourFormat === '12' && hours > 11 && hours !== 12) {\n hours -= 12;\n }\n if (props.hourFormat === '12') {\n output += hours === 0 ? 12 : hours < 10 ? '0' + hours : hours;\n } else {\n output += hours < 10 ? '0' + hours : hours;\n }\n output += ':';\n output += minutes < 10 ? '0' + minutes : minutes;\n if (props.showSeconds) {\n output += ':';\n output += seconds < 10 ? '0' + seconds : seconds;\n }\n if (props.showMillisec) {\n output += '.';\n output += milliseconds < 100 ? (milliseconds < 10 ? '00' : '0') + milliseconds : milliseconds;\n }\n if (props.hourFormat === '12') {\n output += date.getHours() > 11 ? ' PM' : ' AM';\n }\n return output;\n };\n var parseValueFromString = function parseValueFromString(text) {\n if (!text || text.trim().length === 0) {\n return null;\n }\n var value;\n if (isSingleSelection()) {\n value = parseDateTime(text);\n } else if (isMultipleSelection()) {\n var tokens = text.split(',');\n value = [];\n var _iterator2 = _createForOfIteratorHelper(tokens),\n _step2;\n try {\n for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {\n var token = _step2.value;\n value.push(parseDateTime(token.trim()));\n }\n } catch (err) {\n _iterator2.e(err);\n } finally {\n _iterator2.f();\n }\n } else if (isRangeSelection()) {\n var _tokens = text.split(' - ');\n value = [];\n for (var i = 0; i < _tokens.length; i++) {\n value[i] = parseDateTime(_tokens[i].trim());\n }\n }\n return value;\n };\n var parseDateTime = function parseDateTime(text) {\n if (props.parseDateTime) {\n return props.parseDateTime(text);\n }\n var date;\n var parts = text.split(' ');\n if (props.timeOnly) {\n date = new Date();\n populateTime(date, parts[0], parts[1]);\n } else {\n if (props.showTime) {\n date = parseDate(parts[0], getDateFormat());\n populateTime(date, parts[1], parts[2]);\n } else {\n date = parseDate(text, getDateFormat());\n }\n }\n return date;\n };\n var populateTime = function populateTime(value, timeString, ampm) {\n if (props.hourFormat === '12' && ampm !== 'PM' && ampm !== 'AM') {\n throw new Error('Invalid Time');\n }\n var time = parseTime(timeString, ampm);\n value.setHours(time.hour);\n value.setMinutes(time.minute);\n value.setSeconds(time.second);\n value.setMilliseconds(time.millisecond);\n };\n var parseTime = function parseTime(value, ampm) {\n value = props.showMillisec ? value.replace('.', ':') : value;\n var tokens = value.split(':');\n var validTokenLength = props.showSeconds ? 3 : 2;\n validTokenLength = props.showMillisec ? validTokenLength + 1 : validTokenLength;\n if (tokens.length !== validTokenLength || tokens[0].length !== 2 || tokens[1].length !== 2 || props.showSeconds && tokens[2].length !== 2 || props.showMillisec && tokens[3].length !== 3) {\n throw new Error('Invalid time');\n }\n var h = parseInt(tokens[0], 10);\n var m = parseInt(tokens[1], 10);\n var s = props.showSeconds ? parseInt(tokens[2], 10) : null;\n var ms = props.showMillisec ? parseInt(tokens[3], 10) : null;\n 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)) {\n throw new Error('Invalid time');\n } else {\n if (props.hourFormat === '12' && h !== 12 && ampm === 'PM') {\n h += 12;\n }\n return {\n hour: h,\n minute: m,\n second: s,\n millisecond: ms\n };\n }\n };\n\n // Ported from jquery-ui datepicker parseDate\n var parseDate = function parseDate(value, format) {\n if (format == null || value == null) {\n throw new Error('Invalid arguments');\n }\n value = _typeof(value) === 'object' ? value.toString() : value + '';\n if (value === '') {\n return null;\n }\n var iFormat,\n dim,\n extra,\n iValue = 0,\n shortYearCutoff = typeof props.shortYearCutoff !== 'string' ? props.shortYearCutoff : new Date().getFullYear() % 100 + parseInt(props.shortYearCutoff, 10),\n year = -1,\n month = -1,\n day = -1,\n doy = -1,\n literal = false,\n date,\n lookAhead = function lookAhead(match) {\n var matches = iFormat + 1 < format.length && format.charAt(iFormat + 1) === match;\n if (matches) {\n iFormat++;\n }\n return matches;\n },\n getNumber = function getNumber(match) {\n var isDoubled = lookAhead(match),\n size = match === '@' ? 14 : match === '!' ? 20 : match === 'y' && isDoubled ? 4 : match === 'o' ? 3 : 2,\n minSize = match === 'y' ? size : 1,\n digits = new RegExp('^\\\\d{' + minSize + ',' + size + '}'),\n num = value.substring(iValue).match(digits);\n if (!num) {\n throw new Error('Missing number at position ' + iValue);\n }\n iValue += num[0].length;\n return parseInt(num[0], 10);\n },\n getName = function getName(match, shortNames, longNames) {\n var index = -1;\n var arr = lookAhead(match) ? longNames : shortNames;\n var names = [];\n for (var i = 0; i < arr.length; i++) {\n names.push([i, arr[i]]);\n }\n names.sort(function (a, b) {\n return -(a[1].length - b[1].length);\n });\n for (var _i = 0; _i < names.length; _i++) {\n var name = names[_i][1];\n if (value.substr(iValue, name.length).toLowerCase() === name.toLowerCase()) {\n index = names[_i][0];\n iValue += name.length;\n break;\n }\n }\n if (index !== -1) {\n return index + 1;\n } else {\n throw new Error('Unknown name at position ' + iValue);\n }\n },\n checkLiteral = function checkLiteral() {\n if (value.charAt(iValue) !== format.charAt(iFormat)) {\n throw new Error('Unexpected literal at position ' + iValue);\n }\n iValue++;\n };\n if (props.view === 'month') {\n day = 1;\n }\n var _localeOptions3 = localeOptions(props.locale),\n dayNamesShort = _localeOptions3.dayNamesShort,\n dayNames = _localeOptions3.dayNames,\n monthNamesShort = _localeOptions3.monthNamesShort,\n monthNames = _localeOptions3.monthNames;\n for (iFormat = 0; iFormat < format.length; iFormat++) {\n if (literal) {\n if (format.charAt(iFormat) === \"'\" && !lookAhead(\"'\")) {\n literal = false;\n } else {\n checkLiteral();\n }\n } else {\n switch (format.charAt(iFormat)) {\n case 'd':\n day = getNumber('d');\n break;\n case 'D':\n getName('D', dayNamesShort, dayNames);\n break;\n case 'o':\n doy = getNumber('o');\n break;\n case 'm':\n month = getNumber('m');\n break;\n case 'M':\n month = getName('M', monthNamesShort, monthNames);\n break;\n case 'y':\n year = getNumber('y');\n break;\n case '@':\n date = new Date(getNumber('@'));\n year = date.getFullYear();\n month = date.getMonth() + 1;\n day = date.getDate();\n break;\n case '!':\n date = new Date((getNumber('!') - ticksTo1970) / 10000);\n year = date.getFullYear();\n month = date.getMonth() + 1;\n day = date.getDate();\n break;\n case \"'\":\n if (lookAhead(\"'\")) {\n checkLiteral();\n } else {\n literal = true;\n }\n break;\n default:\n checkLiteral();\n }\n }\n }\n if (iValue < value.length) {\n extra = value.substr(iValue);\n if (!/^\\s+/.test(extra)) {\n throw new Error('Extra/unparsed characters found in date: ' + extra);\n }\n }\n if (year === -1) {\n year = new Date().getFullYear();\n } else if (year < 100) {\n year += new Date().getFullYear() - new Date().getFullYear() % 100 + (year <= shortYearCutoff ? 0 : -100);\n }\n if (doy > -1) {\n month = 1;\n day = doy;\n do {\n dim = getDaysCountInMonth(year, month - 1);\n if (day <= dim) {\n break;\n }\n month++;\n day -= dim;\n } while (true);\n }\n date = daylightSavingAdjust(new Date(year, month - 1, day));\n if (date.getFullYear() !== year || date.getMonth() + 1 !== month || date.getDate() !== day) {\n throw new Error('Invalid date'); // E.g. 31/02/00\n }\n\n return date;\n };\n var isInMinYear = function isInMinYear(viewDate) {\n return props.minDate && props.minDate.getFullYear() === viewDate.getFullYear();\n };\n var isInMaxYear = function isInMaxYear(viewDate) {\n return props.maxDate && props.maxDate.getFullYear() === viewDate.getFullYear();\n };\n React.useEffect(function () {\n ObjectUtils.combinedRefs(inputRef, props.inputRef);\n }, [inputRef, props.inputRef]);\n useMountEffect(function () {\n var unbindMaskEvents = null;\n var viewDate = getViewDate(props.viewDate);\n validateDate(viewDate);\n setViewDateState(viewDate);\n setCurrentMonth(viewDate.getMonth());\n setCurrentYear(viewDate.getFullYear());\n setCurrentView(props.view);\n if (props.inline) {\n overlayRef && overlayRef.current.setAttribute(attributeSelector, '');\n if (!props.disabled) {\n initFocusableCell();\n if (props.numberOfMonths === 1) {\n overlayRef.current.style.width = DomHandler.getOuterWidth(overlayRef.current) + 'px';\n }\n }\n } else if (props.mask) {\n unbindMaskEvents = mask(inputRef.current, {\n mask: props.mask,\n readOnly: props.readOnlyInput || props.disabled,\n onChange: function onChange(e) {\n !ignoreMaskChange.current && updateValueOnInput(e.originalEvent, e.value);\n ignoreMaskChange.current = false;\n },\n onBlur: function onBlur() {\n ignoreMaskChange.current = true;\n }\n }).unbindEvents;\n }\n if (props.value) {\n updateInputfield(props.value);\n setValue(props.value);\n }\n return function () {\n props.mask && unbindMaskEvents();\n };\n });\n useUpdateEffect(function () {\n setCurrentView(props.view);\n }, [props.view]);\n useUpdateEffect(function () {\n if (!props.onViewDateChange && !viewStateChanged.current) {\n setValue(props.value);\n }\n }, [props.onViewDateChange, props.value]);\n useUpdateEffect(function () {\n var newDate = props.value;\n if (previousValue !== newDate) {\n updateInputfield(newDate);\n\n // #3516 view date not updated when value set programatically\n if (!visible && newDate) {\n var viewDate = newDate;\n if (isMultipleSelection()) {\n if (newDate.length) {\n viewDate = newDate[newDate.length - 1];\n }\n } else if (isRangeSelection()) {\n if (newDate.length) {\n var startDate = newDate[0];\n var endDate = newDate[1];\n viewDate = endDate || startDate;\n }\n }\n if (viewDate instanceof Date) {\n validateDate(viewDate);\n setViewDateState(viewDate);\n setCurrentMonth(viewDate.getMonth());\n setCurrentYear(viewDate.getFullYear());\n }\n }\n }\n }, [props.value, visible]);\n useUpdateEffect(function () {\n updateInputfield(props.value);\n }, [props.dateFormat, props.hourFormat, props.timeOnly, props.showSeconds, props.showMillisec]);\n useUpdateEffect(function () {\n if (overlayRef.current) {\n setNavigationState(viewDateState);\n updateFocus();\n }\n });\n useUnmountEffect(function () {\n if (touchUIMask.current) {\n disableModality();\n touchUIMask.current = null;\n }\n ZIndexUtils.clear(overlayRef.current);\n });\n React.useImperativeHandle(ref, function () {\n return {\n props: props,\n show: show,\n hide: hide,\n getCurrentDateTime: getCurrentDateTime,\n getViewDate: getViewDate,\n updateViewDate: updateViewDate,\n getElement: function getElement() {\n return elementRef.current;\n },\n getOverlay: function getOverlay() {\n return overlayRef.current;\n },\n getInput: function getInput() {\n return inputRef.current;\n }\n };\n });\n var setValue = function setValue(propValue) {\n if (Array.isArray(propValue)) {\n propValue = propValue[0];\n }\n var prevPropValue = previousValue;\n if (Array.isArray(prevPropValue)) {\n prevPropValue = prevPropValue[0];\n }\n if (!prevPropValue && propValue || propValue && propValue instanceof Date && propValue.getTime() !== prevPropValue.getTime()) {\n var viewDate = props.viewDate && isValidDate(props.viewDate) ? props.viewDate : propValue && isValidDate(propValue) ? propValue : new Date();\n validateDate(viewDate);\n setViewDateState(viewDate);\n viewStateChanged.current = true;\n }\n };\n var createBackwardNavigator = function createBackwardNavigator(isVisible) {\n var navigatorProps = isVisible ? {\n onClick: onPrevButtonClick,\n onKeyDown: function onKeyDown(e) {\n return onContainerButtonKeydown(e);\n }\n } : {\n style: {\n visibility: 'hidden'\n }\n };\n return /*#__PURE__*/React.createElement(\"button\", _extends({\n type: \"button\",\n className: \"p-datepicker-prev\"\n }, navigatorProps), /*#__PURE__*/React.createElement(\"span\", {\n className: \"p-datepicker-prev-icon pi pi-chevron-left\"\n }), /*#__PURE__*/React.createElement(Ripple, null));\n };\n var createForwardNavigator = function createForwardNavigator(isVisible) {\n var navigatorProps = isVisible ? {\n onClick: onNextButtonClick,\n onKeyDown: function onKeyDown(e) {\n return onContainerButtonKeydown(e);\n }\n } : {\n style: {\n visibility: 'hidden'\n }\n };\n return /*#__PURE__*/React.createElement(\"button\", _extends({\n type: \"button\",\n className: \"p-datepicker-next\"\n }, navigatorProps), /*#__PURE__*/React.createElement(\"span\", {\n className: \"p-datepicker-next-icon pi pi-chevron-right\"\n }), /*#__PURE__*/React.createElement(Ripple, null));\n };\n var createTitleMonthElement = function createTitleMonthElement(month) {\n var monthNames = localeOption('monthNames', props.locale);\n if (props.monthNavigator && props.view !== 'month') {\n var viewDate = getViewDate();\n var viewMonth = viewDate.getMonth();\n var displayedMonthOptions = monthNames.map(function (month, index) {\n return (!isInMinYear(viewDate) || index >= props.minDate.getMonth()) && (!isInMaxYear(viewDate) || index <= props.maxDate.getMonth()) ? {\n label: month,\n value: index,\n index: index\n } : null;\n }).filter(function (option) {\n return !!option;\n });\n var displayedMonthNames = displayedMonthOptions.map(function (option) {\n return option.label;\n });\n var _content = /*#__PURE__*/React.createElement(\"select\", {\n className: \"p-datepicker-month\",\n onChange: function onChange(e) {\n return onMonthDropdownChange(e, e.target.value);\n },\n value: viewMonth\n }, displayedMonthOptions.map(function (option) {\n return /*#__PURE__*/React.createElement(\"option\", {\n key: option.label,\n value: option.value\n }, option.label);\n }));\n if (props.monthNavigatorTemplate) {\n var defaultContentOptions = {\n onChange: onMonthDropdownChange,\n className: 'p-datepicker-month',\n value: viewMonth,\n names: displayedMonthNames,\n options: displayedMonthOptions,\n element: _content,\n props: props\n };\n return ObjectUtils.getJSXElement(props.monthNavigatorTemplate, defaultContentOptions);\n }\n return _content;\n }\n return currentView === 'date' && /*#__PURE__*/React.createElement(\"button\", {\n className: \"p-datepicker-month p-link\",\n onClick: switchToMonthView,\n disabled: switchViewButtonDisabled()\n }, monthNames[month]);\n };\n var createTitleYearElement = function createTitleYearElement() {\n if (props.yearNavigator) {\n var _yearOptions2 = [];\n var years = props.yearRange.split(':');\n var yearStart = parseInt(years[0], 10);\n var yearEnd = parseInt(years[1], 10);\n for (var i = yearStart; i <= yearEnd; i++) {\n _yearOptions2.push(i);\n }\n var viewDate = getViewDate();\n var viewYear = viewDate.getFullYear();\n var displayedYearNames = _yearOptions2.filter(function (year) {\n return !(props.minDate && props.minDate.getFullYear() > year) && !(props.maxDate && props.maxDate.getFullYear() < year);\n });\n var _content2 = /*#__PURE__*/React.createElement(\"select\", {\n className: \"p-datepicker-year\",\n onChange: function onChange(e) {\n return onYearDropdownChange(e, e.target.value);\n },\n value: viewYear\n }, displayedYearNames.map(function (year) {\n return /*#__PURE__*/React.createElement(\"option\", {\n key: year,\n value: year\n }, year);\n }));\n if (props.yearNavigatorTemplate) {\n var options = displayedYearNames.map(function (name, i) {\n return {\n label: name,\n value: name,\n index: i\n };\n });\n var defaultContentOptions = {\n onChange: onYearDropdownChange,\n className: 'p-datepicker-year',\n value: viewYear,\n names: displayedYearNames,\n options: options,\n element: _content2,\n props: props\n };\n return ObjectUtils.getJSXElement(props.yearNavigatorTemplate, defaultContentOptions);\n }\n return _content2;\n }\n return currentView !== 'year' && /*#__PURE__*/React.createElement(\"button\", {\n className: \"p-datepicker-year p-link\",\n onClick: switchToYearView,\n disabled: switchViewButtonDisabled()\n }, currentYear);\n };\n var createTitleDecadeElement = function createTitleDecadeElement() {\n var years = yearPickerValues();\n if (currentView === 'year') {\n return /*#__PURE__*/React.createElement(\"span\", {\n className: \"p-datepicker-decade\"\n }, props.decadeTemplate ? props.decadeTemplate(years) : /*#__PURE__*/React.createElement(\"span\", null, \"\".concat(yearPickerValues()[0], \" - \").concat(yearPickerValues()[yearPickerValues().length - 1])));\n }\n return null;\n };\n var createTitle = function createTitle(monthMetaData) {\n var month = createTitleMonthElement(monthMetaData.month);\n var year = createTitleYearElement(monthMetaData.year);\n var decade = createTitleDecadeElement();\n return /*#__PURE__*/React.createElement(\"div\", {\n className: \"p-datepicker-title\"\n }, month, year, decade);\n };\n var createDayNames = function createDayNames(weekDays) {\n var dayNames = weekDays.map(function (weekDay, index) {\n return /*#__PURE__*/React.createElement(\"th\", {\n key: \"\".concat(weekDay, \"-\").concat(index),\n scope: \"col\"\n }, /*#__PURE__*/React.createElement(\"span\", null, weekDay));\n });\n if (props.showWeek) {\n var weekHeader = /*#__PURE__*/React.createElement(\"th\", {\n scope: \"col\",\n key: \"wn\",\n className: \"p-datepicker-weekheader p-disabled\"\n }, /*#__PURE__*/React.createElement(\"span\", null, localeOption('weekHeader', props.locale)));\n return [weekHeader].concat(_toConsumableArray(dayNames));\n }\n return dayNames;\n };\n var createDateCellContent = function createDateCellContent(date, className, groupIndex) {\n var content = props.dateTemplate ? props.dateTemplate(date) : date.day;\n return /*#__PURE__*/React.createElement(\"span\", {\n className: className,\n onClick: function onClick(e) {\n return onDateSelect(e, date);\n },\n onKeyDown: function onKeyDown(e) {\n return onDateCellKeydown(e, date, groupIndex);\n }\n }, content, /*#__PURE__*/React.createElement(Ripple, null));\n };\n var createWeek = function createWeek(weekDates, weekNumber, groupIndex) {\n var week = weekDates.map(function (date) {\n var selected = isSelected(date);\n var cellClassName = classNames({\n 'p-datepicker-other-month': date.otherMonth,\n 'p-datepicker-today': date.today\n });\n var dateClassName = classNames({\n 'p-highlight': selected,\n 'p-disabled': !date.selectable\n });\n var content = date.otherMonth && !props.showOtherMonths ? null : createDateCellContent(date, dateClassName, groupIndex);\n return /*#__PURE__*/React.createElement(\"td\", {\n key: date.day,\n className: cellClassName\n }, content);\n });\n if (props.showWeek) {\n var weekNumberCell = /*#__PURE__*/React.createElement(\"td\", {\n key: 'wn' + weekNumber,\n className: \"p-datepicker-weeknumber\"\n }, /*#__PURE__*/React.createElement(\"span\", {\n className: \"p-disabled\"\n }, weekNumber));\n return [weekNumberCell].concat(_toConsumableArray(week));\n }\n return week;\n };\n var createDates = function createDates(monthMetaData, groupIndex) {\n return monthMetaData.dates.map(function (weekDates, index) {\n return /*#__PURE__*/React.createElement(\"tr\", {\n key: index\n }, createWeek(weekDates, monthMetaData.weekNumbers[index], groupIndex));\n });\n };\n var createDateViewGrid = function createDateViewGrid(monthMetaData, weekDays, groupIndex) {\n var dayNames = createDayNames(weekDays);\n var dates = createDates(monthMetaData, groupIndex);\n return currentView === 'date' && /*#__PURE__*/React.createElement(\"div\", {\n className: \"p-datepicker-calendar-container\"\n }, /*#__PURE__*/React.createElement(\"table\", {\n className: \"p-datepicker-calendar\"\n }, /*#__PURE__*/React.createElement(\"thead\", null, /*#__PURE__*/React.createElement(\"tr\", null, dayNames)), /*#__PURE__*/React.createElement(\"tbody\", null, dates)));\n };\n var createMonth = function createMonth(monthMetaData, index) {\n var weekDays = createWeekDaysMeta();\n var backwardNavigator = createBackwardNavigator(index === 0);\n var forwardNavigator = createForwardNavigator(props.numberOfMonths === 1 || index === props.numberOfMonths - 1);\n var title = createTitle(monthMetaData);\n var dateViewGrid = createDateViewGrid(monthMetaData, weekDays, index);\n var header = props.headerTemplate ? props.headerTemplate() : null;\n return /*#__PURE__*/React.createElement(\"div\", {\n key: monthMetaData.month,\n className: \"p-datepicker-group\"\n }, /*#__PURE__*/React.createElement(\"div\", {\n className: \"p-datepicker-header\"\n }, header, backwardNavigator, title, forwardNavigator), dateViewGrid);\n };\n var createMonths = function createMonths(monthsMetaData) {\n var groups = monthsMetaData.map(createMonth);\n return /*#__PURE__*/React.createElement(\"div\", {\n className: \"p-datepicker-group-container\"\n }, groups);\n };\n var createDateView = function createDateView() {\n var viewDate = getViewDate();\n var monthsMetaData = createMonthsMeta(viewDate.getMonth(), viewDate.getFullYear());\n var months = createMonths(monthsMetaData);\n return months;\n };\n var monthPickerValues = function monthPickerValues() {\n var monthPickerValues = [];\n var monthNamesShort = localeOption('monthNamesShort', props.locale);\n for (var i = 0; i <= 11; i++) {\n monthPickerValues.push(monthNamesShort[i]);\n }\n return monthPickerValues;\n };\n var yearPickerValues = function yearPickerValues() {\n var yearPickerValues = [];\n var base = currentYear - currentYear % 10;\n for (var i = 0; i < 10; i++) {\n yearPickerValues.push(base + i);\n }\n return yearPickerValues;\n };\n var createMonthYearView = function createMonthYearView() {\n var backwardNavigator = createBackwardNavigator(true);\n var forwardNavigator = createForwardNavigator(true);\n var yearElement = createTitleYearElement(getViewDate().getFullYear());\n var decade = createTitleDecadeElement();\n return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(\"div\", {\n className: \"p-datepicker-group-container\"\n }, /*#__PURE__*/React.createElement(\"div\", {\n className: \"p-datepicker-group\"\n }, /*#__PURE__*/React.createElement(\"div\", {\n className: \"p-datepicker-header\"\n }, backwardNavigator, /*#__PURE__*/React.createElement(\"div\", {\n className: \"p-datepicker-title\"\n }, yearElement, decade), forwardNavigator))));\n };\n var createDatePicker = function createDatePicker() {\n if (!props.timeOnly) {\n if (props.view === 'date') {\n return createDateView();\n } else {\n return createMonthYearView();\n }\n }\n return null;\n };\n var createHourPicker = function createHourPicker() {\n var currentTime = getCurrentDateTime();\n var hour = currentTime.getHours();\n if (props.hourFormat === '12') {\n if (hour === 0) hour = 12;else if (hour > 11 && hour !== 12) hour = hour - 12;\n }\n var hourDisplay = hour < 10 ? '0' + hour : hour;\n return /*#__PURE__*/React.createElement(\"div\", {\n className: \"p-hour-picker\"\n }, /*#__PURE__*/React.createElement(\"button\", {\n type: \"button\",\n className: \"p-link\",\n onMouseDown: function onMouseDown(e) {\n return onTimePickerElementMouseDown(e, 0, 1);\n },\n onMouseUp: onTimePickerElementMouseUp,\n onMouseLeave: onTimePickerElementMouseLeave,\n onKeyDown: function onKeyDown(e) {\n return onContainerButtonKeydown(e);\n }\n }, /*#__PURE__*/React.createElement(\"span\", {\n className: \"pi pi-chevron-up\"\n }), /*#__PURE__*/React.createElement(Ripple, null)), /*#__PURE__*/React.createElement(\"span\", null, hourDisplay), /*#__PURE__*/React.createElement(\"button\", {\n type: \"button\",\n className: \"p-link\",\n onMouseDown: function onMouseDown(e) {\n return onTimePickerElementMouseDown(e, 0, -1);\n },\n onMouseUp: onTimePickerElementMouseUp,\n onMouseLeave: onTimePickerElementMouseLeave,\n onKeyDown: function onKeyDown(e) {\n return onContainerButtonKeydown(e);\n }\n }, /*#__PURE__*/React.createElement(\"span\", {\n className: \"pi pi-chevron-down\"\n }), /*#__PURE__*/React.createElement(Ripple, null)));\n };\n var createMinutePicker = function createMinutePicker() {\n var currentTime = getCurrentDateTime();\n var minute = currentTime.getMinutes();\n var minuteDisplay = minute < 10 ? '0' + minute : minute;\n return /*#__PURE__*/React.createElement(\"div\", {\n className: \"p-minute-picker\"\n }, /*#__PURE__*/React.createElement(\"button\", {\n type: \"button\",\n className: \"p-link\",\n onMouseDown: function onMouseDown(e) {\n return onTimePickerElementMouseDown(e, 1, 1);\n },\n onMouseUp: onTimePickerElementMouseUp,\n onMouseLeave: onTimePickerElementMouseLeave,\n onKeyDown: function onKeyDown(e) {\n return onContainerButtonKeydown(e);\n }\n }, /*#__PURE__*/React.createElement(\"span\", {\n className: \"pi pi-chevron-up\"\n }), /*#__PURE__*/React.createElement(Ripple, null)), /*#__PURE__*/React.createElement(\"span\", null, minuteDisplay), /*#__PURE__*/React.createElement(\"button\", {\n type: \"button\",\n className: \"p-link\",\n onMouseDown: function onMouseDown(e) {\n return onTimePickerElementMouseDown(e, 1, -1);\n },\n onMouseUp: onTimePickerElementMouseUp,\n onMouseLeave: onTimePickerElementMouseLeave,\n onKeyDown: function onKeyDown(e) {\n return onContainerButtonKeydown(e);\n }\n }, /*#__PURE__*/React.createElement(\"span\", {\n className: \"pi pi-chevron-down\"\n }), /*#__PURE__*/React.createElement(Ripple, null)));\n };\n var createSecondPicker = function createSecondPicker() {\n if (props.showSeconds) {\n var currentTime = getCurrentDateTime();\n var second = currentTime.getSeconds();\n var secondDisplay = second < 10 ? '0' + second : second;\n return /*#__PURE__*/React.createElement(\"div\", {\n className: \"p-second-picker\"\n }, /*#__PURE__*/React.createElement(\"button\", {\n type: \"button\",\n className: \"p-link\",\n onMouseDown: function onMouseDown(e) {\n return onTimePickerElementMouseDown(e, 2, 1);\n },\n onMouseUp: onTimePickerElementMouseUp,\n onMouseLeave: onTimePickerElementMouseLeave,\n onKeyDown: function onKeyDown(e) {\n return onContainerButtonKeydown(e);\n }\n }, /*#__PURE__*/React.createElement(\"span\", {\n className: \"pi pi-chevron-up\"\n }), /*#__PURE__*/React.createElement(Ripple, null)), /*#__PURE__*/React.createElement(\"span\", null, secondDisplay), /*#__PURE__*/React.createElement(\"button\", {\n type: \"button\",\n className: \"p-link\",\n onMouseDown: function onMouseDown(e) {\n return onTimePickerElementMouseDown(e, 2, -1);\n },\n onMouseUp: onTimePickerElementMouseUp,\n onMouseLeave: onTimePickerElementMouseLeave,\n onKeyDown: function onKeyDown(e) {\n return onContainerButtonKeydown(e);\n }\n }, /*#__PURE__*/React.createElement(\"span\", {\n className: \"pi pi-chevron-down\"\n }), /*#__PURE__*/React.createElement(Ripple, null)));\n }\n return null;\n };\n var createMiliSecondPicker = function createMiliSecondPicker() {\n if (props.showMillisec) {\n var currentTime = getCurrentDateTime();\n var millisecond = currentTime.getMilliseconds();\n var millisecondDisplay = millisecond < 100 ? (millisecond < 10 ? '00' : '0') + millisecond : millisecond;\n return /*#__PURE__*/React.createElement(\"div\", {\n className: \"p-millisecond-picker\"\n }, /*#__PURE__*/React.createElement(\"button\", {\n type: \"button\",\n className: \"p-link\",\n onMouseDown: function onMouseDown(e) {\n return onTimePickerElementMouseDown(e, 3, 1);\n },\n onMouseUp: onTimePickerElementMouseUp,\n onMouseLeave: onTimePickerElementMouseLeave,\n onKeyDown: function onKeyDown(e) {\n return onContainerButtonKeydown(e);\n }\n }, /*#__PURE__*/React.createElement(\"span\", {\n className: \"pi pi-chevron-up\"\n }), /*#__PURE__*/React.createElement(Ripple, null)), /*#__PURE__*/React.createElement(\"span\", null, millisecondDisplay), /*#__PURE__*/React.createElement(\"button\", {\n type: \"button\",\n className: \"p-link\",\n onMouseDown: function onMouseDown(e) {\n return onTimePickerElementMouseDown(e, 3, -1);\n },\n onMouseUp: onTimePickerElementMouseUp,\n onMouseLeave: onTimePickerElementMouseLeave,\n onKeyDown: function onKeyDown(e) {\n return onContainerButtonKeydown(e);\n }\n }, /*#__PURE__*/React.createElement(\"span\", {\n className: \"pi pi-chevron-down\"\n }), /*#__PURE__*/React.createElement(Ripple, null)));\n }\n return null;\n };\n var createAmPmPicker = function createAmPmPicker() {\n if (props.hourFormat === '12') {\n var currentTime = getCurrentDateTime();\n var hour = currentTime.getHours();\n var display = hour > 11 ? 'PM' : 'AM';\n return /*#__PURE__*/React.createElement(\"div\", {\n className: \"p-ampm-picker\"\n }, /*#__PURE__*/React.createElement(\"button\", {\n type: \"button\",\n className: \"p-link\",\n onClick: toggleAmPm\n }, /*#__PURE__*/React.createElement(\"span\", {\n className: \"pi pi-chevron-up\"\n }), /*#__PURE__*/React.createElement(Ripple, null)), /*#__PURE__*/React.createElement(\"span\", null, display), /*#__PURE__*/React.createElement(\"button\", {\n type: \"button\",\n className: \"p-link\",\n onClick: toggleAmPm\n }, /*#__PURE__*/React.createElement(\"span\", {\n className: \"pi pi-chevron-down\"\n }), /*#__PURE__*/React.createElement(Ripple, null)));\n }\n return null;\n };\n var createSeparator = function createSeparator(separator) {\n return /*#__PURE__*/React.createElement(\"div\", {\n className: \"p-separator\"\n }, /*#__PURE__*/React.createElement(\"span\", null, separator));\n };\n var createTimePicker = function createTimePicker() {\n if ((props.showTime || props.timeOnly) && currentView === 'date') {\n return /*#__PURE__*/React.createElement(\"div\", {\n className: \"p-timepicker\"\n }, createHourPicker(), createSeparator(':'), createMinutePicker(), props.showSeconds && createSeparator(':'), createSecondPicker(), props.showMillisec && createSeparator('.'), createMiliSecondPicker(), props.hourFormat === '12' && createSeparator(':'), createAmPmPicker());\n }\n return null;\n };\n var createInputElement = function createInputElement() {\n if (!props.inline) {\n return /*#__PURE__*/React.createElement(InputText, {\n ref: inputRef,\n id: props.inputId,\n name: props.name,\n type: \"text\",\n className: props.inputClassName,\n style: props.inputStyle,\n readOnly: props.readOnlyInput,\n disabled: props.disabled,\n required: props.required,\n autoComplete: \"off\",\n placeholder: props.placeholder,\n tabIndex: props.tabIndex,\n onInput: onUserInput,\n onFocus: onInputFocus,\n onBlur: onInputBlur,\n onKeyDown: onInputKeyDown,\n \"aria-labelledby\": props.ariaLabelledBy,\n inputMode: props.inputMode,\n tooltip: props.tooltip,\n tooltipOptions: props.tooltipOptions\n });\n }\n return null;\n };\n var createButton = function createButton() {\n if (props.showIcon) {\n return /*#__PURE__*/React.createElement(Button, {\n type: \"button\",\n icon: props.icon,\n onClick: onButtonClick,\n tabIndex: \"-1\",\n disabled: props.disabled,\n className: \"p-datepicker-trigger\"\n });\n }\n return null;\n };\n var createContent = function createContent() {\n var input = createInputElement();\n var button = createButton();\n if (props.iconPos === 'left') {\n return /*#__PURE__*/React.createElement(React.Fragment, null, button, input);\n }\n return /*#__PURE__*/React.createElement(React.Fragment, null, input, button);\n };\n var createButtonBar = function createButtonBar() {\n if (props.showButtonBar) {\n var todayClassName = classNames('p-button-text', props.todayButtonClassName);\n var clearClassName = classNames('p-button-text', props.clearButtonClassName);\n var _localeOptions4 = localeOptions(props.locale),\n today = _localeOptions4.today,\n clear = _localeOptions4.clear;\n return /*#__PURE__*/React.createElement(\"div\", {\n className: \"p-datepicker-buttonbar\"\n }, /*#__PURE__*/React.createElement(Button, {\n type: \"button\",\n label: today,\n onClick: onTodayButtonClick,\n onKeyDown: function onKeyDown(e) {\n return onContainerButtonKeydown(e);\n },\n className: todayClassName\n }), /*#__PURE__*/React.createElement(Button, {\n type: \"button\",\n label: clear,\n onClick: onClearButtonClick,\n onKeyDown: function onKeyDown(e) {\n return onContainerButtonKeydown(e);\n },\n className: clearClassName\n }));\n }\n return null;\n };\n var createFooter = function createFooter() {\n if (props.footerTemplate) {\n var _content3 = props.footerTemplate();\n return /*#__PURE__*/React.createElement(\"div\", {\n className: \"p-datepicker-footer\"\n }, _content3);\n }\n return null;\n };\n var createMonthPicker = function createMonthPicker() {\n if (currentView === 'month') {\n return /*#__PURE__*/React.createElement(\"div\", {\n className: \"p-monthpicker\"\n }, monthPickerValues().map(function (m, i) {\n return /*#__PURE__*/React.createElement(\"span\", {\n onClick: function onClick(event) {\n return onMonthSelect(event, i);\n },\n key: \"month\".concat(i + 1),\n className: classNames('p-monthpicker-month', {\n 'p-highlight': isMonthSelected(i),\n 'p-disabled': !isSelectable(0, i, currentYear)\n })\n }, m);\n }));\n }\n return null;\n };\n var createYearPicker = function createYearPicker() {\n if (currentView === 'year') {\n return /*#__PURE__*/React.createElement(\"div\", {\n className: \"p-yearpicker\"\n }, yearPickerValues().map(function (y, i) {\n return /*#__PURE__*/React.createElement(\"span\", {\n onClick: function onClick(event) {\n return onYearSelect(event, y);\n },\n key: \"year\".concat(i + 1),\n className: classNames('p-yearpicker-year', {\n 'p-highlight': isYearSelected(y),\n 'p-disabled': !isSelectable(0, 0, y)\n })\n }, y);\n }));\n }\n return null;\n };\n var otherProps = ObjectUtils.findDiffKeys(props, Calendar.defaultProps);\n 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));\n var panelClassName = classNames('p-datepicker p-component', props.panelClassName, {\n 'p-datepicker-inline': props.inline,\n 'p-disabled': props.disabled,\n 'p-datepicker-timeonly': props.timeOnly,\n 'p-datepicker-multiple-month': props.numberOfMonths > 1,\n 'p-datepicker-monthpicker': currentView === 'month',\n 'p-datepicker-touch-ui': props.touchUI\n });\n var content = createContent();\n var datePicker = createDatePicker();\n var timePicker = createTimePicker();\n var buttonBar = createButtonBar();\n var footer = createFooter();\n var monthPicker = createMonthPicker();\n var yearPicker = createYearPicker();\n return /*#__PURE__*/React.createElement(\"span\", _extends({\n ref: elementRef,\n id: props.id,\n className: className,\n style: props.style\n }, otherProps), content, /*#__PURE__*/React.createElement(CalendarPanel, {\n ref: overlayRef,\n className: panelClassName,\n style: props.panelStyle,\n appendTo: props.appendTo,\n inline: props.inline,\n onClick: onPanelClick,\n onMouseUp: onPanelMouseUp,\n \"in\": visible,\n onEnter: onOverlayEnter,\n onEntered: onOverlayEntered,\n onExit: onOverlayExit,\n onExited: onOverlayExited,\n transitionOptions: props.transitionOptions\n }, datePicker, timePicker, monthPicker, yearPicker, buttonBar, footer));\n}));\nCalendar.displayName = 'Calendar';\nCalendar.defaultProps = {\n __TYPE: 'Calendar',\n appendTo: null,\n ariaLabelledBy: null,\n autoZIndex: true,\n baseZIndex: 0,\n className: null,\n clearButtonClassName: 'p-button-secondary',\n dateFormat: null,\n dateTemplate: null,\n decadeTemplate: null,\n disabled: false,\n disabledDates: null,\n disabledDays: null,\n footerTemplate: null,\n headerTemplate: null,\n hideOnDateTimeSelect: false,\n hourFormat: '24',\n icon: 'pi pi-calendar',\n iconPos: 'right',\n id: null,\n inline: false,\n inputClassName: null,\n inputId: null,\n inputMode: 'none',\n inputRef: null,\n inputStyle: null,\n keepInvalid: false,\n locale: null,\n mask: null,\n maxDate: null,\n maxDateCount: null,\n minDate: null,\n monthNavigator: false,\n monthNavigatorTemplate: null,\n name: null,\n numberOfMonths: 1,\n onBlur: null,\n onChange: null,\n onClearButtonClick: null,\n onFocus: null,\n onHide: null,\n onInput: null,\n onMonthChange: null,\n onSelect: null,\n onShow: null,\n onTodayButtonClick: null,\n onViewDateChange: null,\n onVisibleChange: null,\n panelClassName: null,\n panelStyle: null,\n placeholder: null,\n readOnlyInput: false,\n required: false,\n selectOtherMonths: false,\n selectionMode: 'single',\n shortYearCutoff: '+10',\n showButtonBar: false,\n showIcon: false,\n showMillisec: false,\n showMinMaxRange: false,\n showOnFocus: true,\n showOtherMonths: true,\n showSeconds: false,\n showTime: false,\n showWeek: false,\n stepHour: 1,\n stepMillisec: 1,\n stepMinute: 1,\n stepSecond: 1,\n style: null,\n tabIndex: null,\n timeOnly: false,\n todayButtonClassName: 'p-button-secondary',\n tooltip: null,\n tooltipOptions: null,\n touchUI: false,\n transitionOptions: null,\n value: null,\n view: 'date',\n viewDate: null,\n visible: false,\n yearNavigator: false,\n yearNavigatorTemplate: null,\n yearRange: null\n};\n\nexport { Calendar };\n","import * as React from 'react';\nimport { ariaLabel } from 'primereact/api';\nimport { CSSTransition } from 'primereact/csstransition';\nimport { useMountEffect } from 'primereact/hooks';\nimport { UniqueComponentId, ObjectUtils, classNames, IconUtils } from 'primereact/utils';\n\nfunction _extends() {\n _extends = Object.assign ? Object.assign.bind() : function (target) {\n for (var i = 1; i < arguments.length; i++) {\n var source = arguments[i];\n for (var key in source) {\n if (Object.prototype.hasOwnProperty.call(source, key)) {\n target[key] = source[key];\n }\n }\n }\n return target;\n };\n return _extends.apply(this, arguments);\n}\n\nfunction _typeof(obj) {\n \"@babel/helpers - typeof\";\n\n return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (obj) {\n return typeof obj;\n } : function (obj) {\n return obj && \"function\" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj;\n }, _typeof(obj);\n}\n\nfunction _toPrimitive(input, hint) {\n if (_typeof(input) !== \"object\" || input === null) return input;\n var prim = input[Symbol.toPrimitive];\n if (prim !== undefined) {\n var res = prim.call(input, hint || \"default\");\n if (_typeof(res) !== \"object\") return res;\n throw new TypeError(\"@@toPrimitive must return a primitive value.\");\n }\n return (hint === \"string\" ? String : Number)(input);\n}\n\nfunction _toPropertyKey(arg) {\n var key = _toPrimitive(arg, \"string\");\n return _typeof(key) === \"symbol\" ? key : String(key);\n}\n\nfunction _defineProperty(obj, key, value) {\n key = _toPropertyKey(key);\n if (key in obj) {\n Object.defineProperty(obj, key, {\n value: value,\n enumerable: true,\n configurable: true,\n writable: true\n });\n } else {\n obj[key] = value;\n }\n return obj;\n}\n\nfunction _arrayLikeToArray(arr, len) {\n if (len == null || len > arr.length) len = arr.length;\n for (var i = 0, arr2 = new Array(len); i < len; i++) {\n arr2[i] = arr[i];\n }\n return arr2;\n}\n\nfunction _arrayWithoutHoles(arr) {\n if (Array.isArray(arr)) return _arrayLikeToArray(arr);\n}\n\nfunction _iterableToArray(iter) {\n if (typeof Symbol !== \"undefined\" && iter[Symbol.iterator] != null || iter[\"@@iterator\"] != null) return Array.from(iter);\n}\n\nfunction _unsupportedIterableToArray(o, minLen) {\n if (!o) return;\n if (typeof o === \"string\") return _arrayLikeToArray(o, minLen);\n var n = Object.prototype.toString.call(o).slice(8, -1);\n if (n === \"Object\" && o.constructor) n = o.constructor.name;\n if (n === \"Map\" || n === \"Set\") return Array.from(o);\n if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);\n}\n\nfunction _nonIterableSpread() {\n throw new TypeError(\"Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\");\n}\n\nfunction _toConsumableArray(arr) {\n return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread();\n}\n\nfunction _arrayWithHoles(arr) {\n if (Array.isArray(arr)) return arr;\n}\n\nfunction _iterableToArrayLimit(arr, i) {\n var _i = null == arr ? null : \"undefined\" != typeof Symbol && arr[Symbol.iterator] || arr[\"@@iterator\"];\n if (null != _i) {\n var _s,\n _e,\n _x,\n _r,\n _arr = [],\n _n = !0,\n _d = !1;\n try {\n if (_x = (_i = _i.call(arr)).next, 0 === i) {\n if (Object(_i) !== _i) return;\n _n = !1;\n } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0) {\n ;\n }\n } catch (err) {\n _d = !0, _e = err;\n } finally {\n try {\n if (!_n && null != _i[\"return\"] && (_r = _i[\"return\"](), Object(_r) !== _r)) return;\n } finally {\n if (_d) throw _e;\n }\n }\n return _arr;\n }\n}\n\nfunction _nonIterableRest() {\n throw new TypeError(\"Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\");\n}\n\nfunction _slicedToArray(arr, i) {\n return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();\n}\n\nfunction 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; }\nfunction _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; }\nvar AccordionTab = function AccordionTab() {};\nvar shouldUseTab = function shouldUseTab(tab) {\n return tab && tab.props.__TYPE === 'AccordionTab';\n};\nvar Accordion = /*#__PURE__*/React.forwardRef(function (props, ref) {\n var _React$useState = React.useState(props.id),\n _React$useState2 = _slicedToArray(_React$useState, 2),\n idState = _React$useState2[0],\n setIdState = _React$useState2[1];\n var _React$useState3 = React.useState(props.activeIndex),\n _React$useState4 = _slicedToArray(_React$useState3, 2),\n activeIndexState = _React$useState4[0],\n setActiveIndexState = _React$useState4[1];\n var elementRef = React.useRef(null);\n var activeIndex = props.onTabChange ? props.activeIndex : activeIndexState;\n var onTabHeaderClick = function onTabHeaderClick(event, tab, index) {\n if (!tab.props.disabled) {\n var selected = isSelected(index);\n var newActiveIndex = null;\n if (props.multiple) {\n var indexes = activeIndex || [];\n newActiveIndex = selected ? indexes.filter(function (i) {\n return i !== index;\n }) : [].concat(_toConsumableArray(indexes), [index]);\n } else {\n newActiveIndex = selected ? null : index;\n }\n var callback = selected ? props.onTabClose : props.onTabOpen;\n callback && callback({\n originalEvent: event,\n index: index\n });\n if (props.onTabChange) {\n props.onTabChange({\n originalEvent: event,\n index: newActiveIndex\n });\n } else {\n setActiveIndexState(newActiveIndex);\n }\n }\n event.preventDefault();\n };\n var isSelected = function isSelected(index) {\n return props.multiple ? activeIndex && activeIndex.some(function (i) {\n return i === index;\n }) : activeIndex === index;\n };\n React.useImperativeHandle(ref, function () {\n return {\n props: props,\n getElement: function getElement() {\n return elementRef.current;\n }\n };\n });\n useMountEffect(function () {\n if (!idState) {\n setIdState(UniqueComponentId());\n }\n });\n if (!idState) {\n return null;\n }\n var createTabHeader = function createTabHeader(tab, selected, index) {\n var style = _objectSpread(_objectSpread({}, tab.props.style || {}), tab.props.headerStyle || {});\n var className = classNames('p-accordion-header', {\n 'p-highlight': selected,\n 'p-disabled': tab.props.disabled\n }, tab.props.headerClassName, tab.props.className);\n var headerId = idState + '_header_' + index;\n var ariaControls = idState + '_content_' + index;\n var tabIndex = tab.props.disabled ? -1 : tab.props.tabIndex;\n var header = tab.props.headerTemplate ? ObjectUtils.getJSXElement(tab.props.headerTemplate, tab.props) : /*#__PURE__*/React.createElement(\"span\", {\n className: \"p-accordion-header-text\"\n }, tab.props.header);\n var icon = IconUtils.getJSXIcon(selected ? props.collapseIcon : props.expandIcon, {\n className: 'p-accordion-toggle-icon'\n }, {\n props: props,\n selected: selected\n });\n var label = selected ? ariaLabel('collapseLabel') : ariaLabel('expandLabel');\n return /*#__PURE__*/React.createElement(\"div\", {\n className: className,\n style: style\n }, /*#__PURE__*/React.createElement(\"a\", {\n href: '#' + ariaControls,\n id: headerId,\n className: \"p-accordion-header-link\",\n \"aria-controls\": ariaControls,\n role: \"tab\",\n \"aria-expanded\": selected,\n onClick: function onClick(e) {\n return onTabHeaderClick(e, tab, index);\n },\n tabIndex: tabIndex,\n \"aria-label\": label\n }, icon, header));\n };\n var createTabContent = function createTabContent(tab, selected, index) {\n var style = _objectSpread(_objectSpread({}, tab.props.style || {}), tab.props.contentStyle || {});\n var className = classNames('p-toggleable-content', tab.props.contentClassName, tab.props.className);\n var contentId = idState + '_content_' + index;\n var ariaLabelledby = idState + '_header_' + index;\n var contentRef = /*#__PURE__*/React.createRef();\n return /*#__PURE__*/React.createElement(CSSTransition, {\n nodeRef: contentRef,\n classNames: \"p-toggleable-content\",\n timeout: {\n enter: 1000,\n exit: 450\n },\n \"in\": selected,\n unmountOnExit: true,\n options: props.transitionOptions\n }, /*#__PURE__*/React.createElement(\"div\", {\n ref: contentRef,\n id: contentId,\n className: className,\n style: style,\n role: \"region\",\n \"aria-labelledby\": ariaLabelledby\n }, /*#__PURE__*/React.createElement(\"div\", {\n className: \"p-accordion-content\"\n }, tab.props.children)));\n };\n var createTab = function createTab(tab, index) {\n if (shouldUseTab(tab)) {\n var key = idState + '_' + index;\n var selected = isSelected(index);\n var _otherProps = ObjectUtils.findDiffKeys(tab.props, AccordionTab.defaultProps);\n var tabHeader = createTabHeader(tab, selected, index);\n var tabContent = createTabContent(tab, selected, index);\n var tabClassName = classNames('p-accordion-tab', {\n 'p-accordion-tab-active': selected\n });\n return /*#__PURE__*/React.createElement(\"div\", _extends({\n key: key,\n className: tabClassName\n }, _otherProps), tabHeader, tabContent);\n }\n return null;\n };\n var createTabs = function createTabs() {\n return React.Children.map(props.children, createTab);\n };\n var otherProps = ObjectUtils.findDiffKeys(props, Accordion.defaultProps);\n var className = classNames('p-accordion p-component', props.className);\n var tabs = createTabs();\n return /*#__PURE__*/React.createElement(\"div\", _extends({\n id: idState,\n ref: elementRef,\n className: className,\n style: props.style\n }, otherProps), tabs);\n});\nAccordionTab.displayName = 'AccordionTab';\nAccordionTab.defaultProps = {\n __TYPE: 'AccordionTab',\n className: null,\n contentClassName: null,\n contentStyle: null,\n disabled: false,\n header: null,\n headerClassName: null,\n headerStyle: null,\n headerTemplate: null,\n style: null,\n tabIndex: 0\n};\nAccordion.displayName = 'Accordion';\nAccordion.defaultProps = {\n __TYPE: 'Accordion',\n id: null,\n activeIndex: null,\n className: null,\n style: null,\n multiple: false,\n expandIcon: 'pi pi-chevron-right',\n collapseIcon: 'pi pi-chevron-down',\n transitionOptions: null,\n onTabOpen: null,\n onTabClose: null,\n onTabChange: null\n};\n\nexport { Accordion, AccordionTab };\n","import React from \"react\";\nimport { formatNumberWithCommas } from \"../utils/Utils\";\n\nfunction RenderCurrency({ value, currencySymbol = \"\" }) {\n const className = currencySymbol?.length > 2 ? \"text-sm font-normal\" : \"\";\n return (\n <>\n
{currencySymbol} \n {formatNumberWithCommas(value)}\n \n );\n}\nexport default RenderCurrency;\n","import * as React from 'react';\nimport { ariaLabel } from 'primereact/api';\nimport { useMountEffect, useUpdateEffect } from 'primereact/hooks';\nimport { Ripple } from 'primereact/ripple';\nimport { UniqueComponentId, ObjectUtils, classNames, DomHandler } from 'primereact/utils';\n\nfunction _extends() {\n _extends = Object.assign ? Object.assign.bind() : function (target) {\n for (var i = 1; i < arguments.length; i++) {\n var source = arguments[i];\n for (var key in source) {\n if (Object.prototype.hasOwnProperty.call(source, key)) {\n target[key] = source[key];\n }\n }\n }\n return target;\n };\n return _extends.apply(this, arguments);\n}\n\nfunction _typeof(obj) {\n \"@babel/helpers - typeof\";\n\n return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (obj) {\n return typeof obj;\n } : function (obj) {\n return obj && \"function\" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj;\n }, _typeof(obj);\n}\n\nfunction _toPrimitive(input, hint) {\n if (_typeof(input) !== \"object\" || input === null) return input;\n var prim = input[Symbol.toPrimitive];\n if (prim !== undefined) {\n var res = prim.call(input, hint || \"default\");\n if (_typeof(res) !== \"object\") return res;\n throw new TypeError(\"@@toPrimitive must return a primitive value.\");\n }\n return (hint === \"string\" ? String : Number)(input);\n}\n\nfunction _toPropertyKey(arg) {\n var key = _toPrimitive(arg, \"string\");\n return _typeof(key) === \"symbol\" ? key : String(key);\n}\n\nfunction _defineProperty(obj, key, value) {\n key = _toPropertyKey(key);\n if (key in obj) {\n Object.defineProperty(obj, key, {\n value: value,\n enumerable: true,\n configurable: true,\n writable: true\n });\n } else {\n obj[key] = value;\n }\n return obj;\n}\n\nfunction _arrayLikeToArray(arr, len) {\n if (len == null || len > arr.length) len = arr.length;\n for (var i = 0, arr2 = new Array(len); i < len; i++) {\n arr2[i] = arr[i];\n }\n return arr2;\n}\n\nfunction _arrayWithoutHoles(arr) {\n if (Array.isArray(arr)) return _arrayLikeToArray(arr);\n}\n\nfunction _iterableToArray(iter) {\n if (typeof Symbol !== \"undefined\" && iter[Symbol.iterator] != null || iter[\"@@iterator\"] != null) return Array.from(iter);\n}\n\nfunction _unsupportedIterableToArray(o, minLen) {\n if (!o) return;\n if (typeof o === \"string\") return _arrayLikeToArray(o, minLen);\n var n = Object.prototype.toString.call(o).slice(8, -1);\n if (n === \"Object\" && o.constructor) n = o.constructor.name;\n if (n === \"Map\" || n === \"Set\") return Array.from(o);\n if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);\n}\n\nfunction _nonIterableSpread() {\n throw new TypeError(\"Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\");\n}\n\nfunction _toConsumableArray(arr) {\n return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread();\n}\n\nfunction _arrayWithHoles(arr) {\n if (Array.isArray(arr)) return arr;\n}\n\nfunction _iterableToArrayLimit(arr, i) {\n var _i = null == arr ? null : \"undefined\" != typeof Symbol && arr[Symbol.iterator] || arr[\"@@iterator\"];\n if (null != _i) {\n var _s,\n _e,\n _x,\n _r,\n _arr = [],\n _n = !0,\n _d = !1;\n try {\n if (_x = (_i = _i.call(arr)).next, 0 === i) {\n if (Object(_i) !== _i) return;\n _n = !1;\n } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0) {\n ;\n }\n } catch (err) {\n _d = !0, _e = err;\n } finally {\n try {\n if (!_n && null != _i[\"return\"] && (_r = _i[\"return\"](), Object(_r) !== _r)) return;\n } finally {\n if (_d) throw _e;\n }\n }\n return _arr;\n }\n}\n\nfunction _nonIterableRest() {\n throw new TypeError(\"Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\");\n}\n\nfunction _slicedToArray(arr, i) {\n return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();\n}\n\nfunction 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; }\nfunction _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; }\nvar TabPanel = function TabPanel() {};\nvar TabView = /*#__PURE__*/React.forwardRef(function (props, ref) {\n var _React$useState = React.useState(props.id),\n _React$useState2 = _slicedToArray(_React$useState, 2),\n idState = _React$useState2[0],\n setIdState = _React$useState2[1];\n var _React$useState3 = React.useState(true),\n _React$useState4 = _slicedToArray(_React$useState3, 2),\n backwardIsDisabledState = _React$useState4[0],\n setBackwardIsDisabledState = _React$useState4[1];\n var _React$useState5 = React.useState(false),\n _React$useState6 = _slicedToArray(_React$useState5, 2),\n forwardIsDisabledState = _React$useState6[0],\n setForwardIsDisabledState = _React$useState6[1];\n var _React$useState7 = React.useState([]),\n _React$useState8 = _slicedToArray(_React$useState7, 2),\n hiddenTabsState = _React$useState8[0],\n setHiddenTabsState = _React$useState8[1];\n var _React$useState9 = React.useState(props.activeIndex),\n _React$useState10 = _slicedToArray(_React$useState9, 2),\n activeIndexState = _React$useState10[0],\n setActiveIndexState = _React$useState10[1];\n var elementRef = React.useRef(null);\n var contentRef = React.useRef(null);\n var navRef = React.useRef(null);\n var inkbarRef = React.useRef(null);\n var prevBtnRef = React.useRef(null);\n var nextBtnRef = React.useRef(null);\n var tabsRef = React.useRef({});\n var activeIndex = props.onTabChange ? props.activeIndex : activeIndexState;\n var isSelected = function isSelected(index) {\n return index === activeIndex;\n };\n var shouldUseTab = function shouldUseTab(tab, index) {\n return tab && tab.props.__TYPE === 'TabPanel' && hiddenTabsState.every(function (_i) {\n return _i !== index;\n });\n };\n var findVisibleActiveTab = function findVisibleActiveTab(i) {\n var tabsInfo = React.Children.map(props.children, function (tab, index) {\n if (shouldUseTab(tab, index)) {\n return {\n tab: tab,\n index: index\n };\n }\n });\n return tabsInfo.find(function (_ref) {\n var tab = _ref.tab,\n index = _ref.index;\n return !tab.props.disabled && index >= i;\n }) || tabsInfo.reverse().find(function (_ref2) {\n var tab = _ref2.tab,\n index = _ref2.index;\n return !tab.props.disabled && i > index;\n });\n };\n var onTabHeaderClose = function onTabHeaderClose(event, index) {\n event.preventDefault();\n\n // give caller a chance to stop the selection\n if (props.onBeforeTabClose && props.onBeforeTabClose({\n originalEvent: event,\n index: index\n }) === false) {\n return;\n }\n setHiddenTabsState([].concat(_toConsumableArray(hiddenTabsState), [index]));\n if (props.onTabClose) {\n props.onTabClose({\n originalEvent: event,\n index: index\n });\n }\n };\n var onTabHeaderClick = function onTabHeaderClick(event, tab, index) {\n if (event) {\n event.preventDefault();\n }\n if (!tab.props.disabled) {\n // give caller a chance to stop the selection\n if (props.onBeforeTabChange && props.onBeforeTabChange({\n originalEvent: event,\n index: index\n }) === false) {\n return;\n }\n if (props.onTabChange) props.onTabChange({\n originalEvent: event,\n index: index\n });else setActiveIndexState(index);\n }\n updateScrollBar(index);\n };\n var _onKeyDown = function onKeyDown(event, tab, index) {\n if (event.code === 'Enter') {\n onTabHeaderClick(event, tab, index);\n }\n };\n var updateInkBar = function updateInkBar() {\n var tabHeader = tabsRef.current[\"tab_\".concat(activeIndex)];\n inkbarRef.current.style.width = DomHandler.getWidth(tabHeader) + 'px';\n inkbarRef.current.style.left = DomHandler.getOffset(tabHeader).left - DomHandler.getOffset(navRef.current).left + 'px';\n };\n var updateScrollBar = function updateScrollBar(index) {\n var tabHeader = tabsRef.current[\"tab_\".concat(index)];\n if (tabHeader && tabHeader.scrollIntoView) {\n tabHeader.scrollIntoView({\n block: 'nearest'\n });\n }\n };\n var updateButtonState = function updateButtonState() {\n var _contentRef$current = contentRef.current,\n scrollLeft = _contentRef$current.scrollLeft,\n scrollWidth = _contentRef$current.scrollWidth;\n var width = DomHandler.getWidth(contentRef.current);\n setBackwardIsDisabledState(scrollLeft === 0);\n setForwardIsDisabledState(scrollLeft === scrollWidth - width);\n };\n var onScroll = function onScroll(event) {\n props.scrollable && updateButtonState();\n event.preventDefault();\n };\n var getVisibleButtonWidths = function getVisibleButtonWidths() {\n return [prevBtnRef.current, nextBtnRef.current].reduce(function (acc, el) {\n return el ? acc + DomHandler.getWidth(el) : acc;\n }, 0);\n };\n var navBackward = function navBackward() {\n var width = DomHandler.getWidth(contentRef.current) - getVisibleButtonWidths();\n var pos = contentRef.current.scrollLeft - width;\n contentRef.current.scrollLeft = pos <= 0 ? 0 : pos;\n };\n var navForward = function navForward() {\n var width = DomHandler.getWidth(contentRef.current) - getVisibleButtonWidths();\n var pos = contentRef.current.scrollLeft + width;\n var lastPos = contentRef.current.scrollWidth - width;\n contentRef.current.scrollLeft = pos >= lastPos ? lastPos : pos;\n };\n var reset = function reset() {\n setBackwardIsDisabledState(true);\n setForwardIsDisabledState(false);\n setHiddenTabsState([]);\n if (props.onTabChange) props.onTabChange({\n index: activeIndex\n });else setActiveIndexState(props.activeIndex);\n };\n React.useEffect(function () {\n updateInkBar();\n });\n useMountEffect(function () {\n if (!idState) {\n setIdState(UniqueComponentId());\n }\n });\n useUpdateEffect(function () {\n if (ObjectUtils.isNotEmpty(hiddenTabsState)) {\n var tabInfo = findVisibleActiveTab(hiddenTabsState[hiddenTabsState.length - 1]);\n tabInfo && onTabHeaderClick(null, tabInfo.tab, tabInfo.index);\n }\n }, [hiddenTabsState]);\n useUpdateEffect(function () {\n updateScrollBar(props.activeIndex);\n }, [props.activeIndex]);\n React.useImperativeHandle(ref, function () {\n return {\n props: props,\n reset: reset,\n getElement: function getElement() {\n return elementRef.current;\n }\n };\n });\n var createTabHeader = function createTabHeader(tab, index) {\n var selected = isSelected(index);\n var _tab$props = tab.props,\n headerStyle = _tab$props.headerStyle,\n headerClassName = _tab$props.headerClassName,\n _style = _tab$props.style,\n _className = _tab$props.className,\n disabled = _tab$props.disabled,\n leftIcon = _tab$props.leftIcon,\n rightIcon = _tab$props.rightIcon,\n header = _tab$props.header,\n headerTemplate = _tab$props.headerTemplate,\n closable = _tab$props.closable;\n var style = _objectSpread(_objectSpread({}, headerStyle || {}), _style || {});\n var className = classNames('p-unselectable-text', {\n 'p-tabview-selected p-highlight': selected,\n 'p-disabled': disabled\n }, headerClassName, _className);\n var headerId = idState + '_header_' + index;\n var ariaControls = idState + '_content_' + index;\n var tabIndex = disabled ? null : 0;\n var leftIconElement = leftIcon && /*#__PURE__*/React.createElement(\"i\", {\n className: leftIcon\n });\n var titleElement = /*#__PURE__*/React.createElement(\"span\", {\n className: \"p-tabview-title\"\n }, header);\n var rightIconElement = rightIcon && /*#__PURE__*/React.createElement(\"i\", {\n className: rightIcon\n });\n var closableIconElement = closable && /*#__PURE__*/React.createElement(\"i\", {\n className: \"p-tabview-close pi pi-times\",\n onClick: function onClick(e) {\n return onTabHeaderClose(e, index);\n }\n });\n var content =\n /*#__PURE__*/\n // eslint-disable /\n React.createElement(\"a\", {\n role: \"tab\",\n className: \"p-tabview-nav-link\",\n onClick: function onClick(e) {\n return onTabHeaderClick(e, tab, index);\n },\n id: headerId,\n onKeyDown: function onKeyDown(e) {\n return _onKeyDown(e, tab, index);\n },\n \"aria-controls\": ariaControls,\n \"aria-selected\": selected,\n tabIndex: tabIndex\n }, leftIconElement, titleElement, rightIconElement, closableIconElement, /*#__PURE__*/React.createElement(Ripple, null))\n // eslint-enable /\n ;\n\n if (headerTemplate) {\n var defaultContentOptions = {\n className: 'p-tabview-nav-link',\n titleClassName: 'p-tabview-title',\n onClick: function onClick(e) {\n return onTabHeaderClick(e, tab, index);\n },\n onKeyDown: function onKeyDown(e) {\n return _onKeyDown(e, tab, index);\n },\n leftIconElement: leftIconElement,\n titleElement: titleElement,\n rightIconElement: rightIconElement,\n element: content,\n props: props,\n index: index,\n selected: selected,\n ariaControls: ariaControls\n };\n content = ObjectUtils.getJSXElement(headerTemplate, defaultContentOptions);\n }\n return /*#__PURE__*/React.createElement(\"li\", {\n ref: function ref(el) {\n return tabsRef.current[\"tab_\".concat(index)] = el;\n },\n className: className,\n style: style,\n role: \"presentation\"\n }, content);\n };\n var createTabHeaders = function createTabHeaders() {\n return React.Children.map(props.children, function (tab, index) {\n if (shouldUseTab(tab, index)) {\n return createTabHeader(tab, index);\n }\n });\n };\n var createNavigator = function createNavigator() {\n var headers = createTabHeaders();\n return /*#__PURE__*/React.createElement(\"div\", {\n ref: contentRef,\n id: idState,\n className: \"p-tabview-nav-content\",\n style: props.style,\n onScroll: onScroll\n }, /*#__PURE__*/React.createElement(\"ul\", {\n ref: navRef,\n className: \"p-tabview-nav\",\n role: \"tablist\"\n }, headers, /*#__PURE__*/React.createElement(\"li\", {\n ref: inkbarRef,\n className: \"p-tabview-ink-bar\"\n })));\n };\n var createContent = function createContent() {\n var className = classNames('p-tabview-panels', props.panelContainerClassName);\n var contents = React.Children.map(props.children, function (tab, index) {\n if (shouldUseTab(tab, index) && (!props.renderActiveOnly || isSelected(index))) {\n var selected = isSelected(index);\n var style = _objectSpread(_objectSpread({}, tab.props.contentStyle || {}), tab.props.style || {});\n var _className2 = classNames(tab.props.contentClassName, tab.props.className, 'p-tabview-panel', {\n 'p-hidden': !selected\n });\n var contentId = idState + '_content_' + index;\n var ariaLabelledBy = idState + '_header_' + index;\n var _otherProps = ObjectUtils.findDiffKeys(tab.props, TabPanel.defaultProps);\n return /*#__PURE__*/React.createElement(\"div\", _extends({}, _otherProps, {\n id: contentId,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-hidden\": !selected,\n className: _className2,\n style: style,\n role: \"tabpanel\"\n }), !props.renderActiveOnly ? tab.props.children : selected && tab.props.children);\n }\n });\n return /*#__PURE__*/React.createElement(\"div\", {\n className: className,\n style: props.panelContainerStyle\n }, contents);\n };\n var createPrevButton = function createPrevButton() {\n if (props.scrollable && !backwardIsDisabledState) {\n return /*#__PURE__*/React.createElement(\"button\", {\n ref: prevBtnRef,\n className: \"p-tabview-nav-prev p-tabview-nav-btn p-link\",\n onClick: navBackward,\n type: \"button\",\n \"aria-label\": ariaLabel('previousPageLabel')\n }, /*#__PURE__*/React.createElement(\"span\", {\n className: \"pi pi-chevron-left\"\n }), /*#__PURE__*/React.createElement(Ripple, null));\n }\n return null;\n };\n var createNextButton = function createNextButton() {\n if (props.scrollable && !forwardIsDisabledState) {\n return /*#__PURE__*/React.createElement(\"button\", {\n ref: nextBtnRef,\n className: \"p-tabview-nav-next p-tabview-nav-btn p-link\",\n onClick: navForward,\n type: \"button\",\n \"aria-label\": ariaLabel('nextPageLabel')\n }, /*#__PURE__*/React.createElement(\"span\", {\n className: \"pi pi-chevron-right\",\n \"aria-hidden\": \"true\"\n }), /*#__PURE__*/React.createElement(Ripple, null));\n }\n };\n var otherProps = ObjectUtils.findDiffKeys(props, TabView.defaultProps);\n var className = classNames('p-tabview p-component', {\n 'p-tabview-scrollable': props.scrollable\n }, props.className);\n var navigator = createNavigator();\n var content = createContent();\n var prevButton = createPrevButton();\n var nextButton = createNextButton();\n return /*#__PURE__*/React.createElement(\"div\", _extends({\n ref: elementRef,\n className: className\n }, otherProps), /*#__PURE__*/React.createElement(\"div\", {\n className: \"p-tabview-nav-container\"\n }, prevButton, navigator, nextButton), content);\n});\nTabPanel.displayName = 'TabPanel';\nTabPanel.defaultProps = {\n __TYPE: 'TabPanel',\n className: null,\n closable: false,\n contentClassName: null,\n contentStyle: null,\n disabled: false,\n header: null,\n headerClassName: null,\n headerStyle: null,\n headerTemplate: null,\n leftIcon: null,\n rightIcon: null,\n style: null\n};\nTabView.displayName = 'TabView';\nTabView.defaultProps = {\n __TYPE: 'TabView',\n id: null,\n activeIndex: 0,\n className: null,\n onBeforeTabChange: null,\n onBeforeTabClose: null,\n onTabChange: null,\n onTabClose: null,\n panelContainerClassName: null,\n panelContainerStyle: null,\n renderActiveOnly: true,\n scrollable: false,\n style: null\n};\n\nexport { TabPanel, TabView };\n","import React from \"react\";\nimport { Dropdown } from \"primereact/dropdown\";\n\nexport const template2 = {\n layout: \"CurrentPageReport RowsPerPageDropdown FirstPageLink PrevPageLink PageLinks NextPageLink LastPageLink\",\n RowsPerPageDropdown: (options) => {\n const dropdownOptions = [\n { label: 10, value: 10 },\n { label: 20, value: 20 },\n { label: 30, value: 30 },\n { label: 40, value: 40 },\n { label: 50, value: 50 }\n ];\n\n return (\n
\n \n \n \n \n );\n },\n CurrentPageReport: (options) => {\n return (\n
\n Showing {options.first} to {options.last} of {options.totalRecords} record{options.totalRecords > 1 ? \"s\" : \"\"}\n \n );\n }\n};\n","import React, { useState, useEffect, useRef } from 'react';\nimport { DataTable } from 'primereact/datatable';\nimport { Column } from 'primereact/column';\nimport { Toast } from 'primereact/toast';\nimport { Button } from 'primereact/button';\nimport { InputText } from 'primereact/inputtext';\nimport { BaseApiService } from '../utils/BaseApiService';\nimport { Dropdown } from 'primereact/dropdown';\nimport { UserSessionUtils } from '../utils/UserSessionUtils';\nimport { MAXIMUM_RECORDS_PER_PAGE } from '../constants/Constants';\nimport { Paginator } from 'primereact/paginator';\nimport { formatNumberWithCommas } from '../utils/Utils';\nimport { InputNumber } from 'primereact/inputnumber';\nimport { Calendar } from 'primereact/calendar';\nimport { Accordion, AccordionTab } from 'primereact/accordion';\nimport StatusSummary from '../components/StatusSummary';\nimport StorageParams from '../constants/StorageParams';\nimport RenderCurrency from '../components/RenderCurrency';\nimport { TabView, TabPanel } from 'primereact/tabview';\nimport { Dialog } from 'primereact/dialog';\nimport { template2 } from 'components/PaginatorTemplate';\n\nexport default function HeldSalesDesk() {\n const toast = useRef(null);\n const dt = useRef(null);\n\n const [heldTrans, setHeldTrans] = useState(JSON.parse(localStorage.getItem(StorageParams.HELD_TRANSACTIONS)) || []);\n const [limit, setLimit] = useState(0);\n const [isLoading, setIsLoading] = useState(false);\n const [first, setFirst] = useState(0);\n const [totalRecords, setTotalRecords] = useState(0);\n const [searchTerm, setSearchTerm] = useState('');\n const [deleteTransactionDialog, setDeleteTransactionDialog] = useState(false);\n const [income, setIncome] = useState(0);\n const [salesValue, setSalesValue] = useState(0);\n const [capital, setCapital] = useState(0);\n const [dates, setDates] = useState(null);\n const [activeIndex, setActiveIndex] = useState(0);\n const [shops, setShops] = useState([]);\n const [selectedTransaction, setSelectedTransaction] = useState(null);\n const [expandedRows, setExpandedRows] = useState(null);\n\n let offset = 0;\n const calendarRef = useRef(null);\n\n const fetchShops = async () => {\n let searchParameters = { offset: 0, limit: 0 };\n\n if (UserSessionUtils.getShopOwner()) {\n searchParameters.shopOwnerId = UserSessionUtils.getShopOwnerId();\n }\n\n if (UserSessionUtils.getShopAttendant()) {\n return;\n }\n await new BaseApiService('/shops')\n .getRequestWithJsonResponse(searchParameters)\n .then(async (response) => {\n if (response?.records?.length > 1) {\n setShops([{ name: 'All shops', id: UserSessionUtils.getShopOwnerId() }, ...response?.records.reverse()]);\n return;\n }\n setShops(response.records);\n })\n .catch((error) => {\n setIsLoading(false);\n });\n };\n\n const onPageChange = (e) => {\n offset = e.page * MAXIMUM_RECORDS_PER_PAGE;\n setFirst(e.first);\n setLimit(MAXIMUM_RECORDS_PER_PAGE);\n };\n\n useEffect(() => {\n if (!UserSessionUtils.getSuperAdmin()) {\n fetchShops();\n }\n }, []);\n\n useEffect(() => {}, [activeIndex]);\n\n const header = (\n \n
Shop Held Sales
\n
\n \n setDates(e.value)} placeholder=\"Date\" dateFormat=\"dd-M-yy\" />\n
\n \n
\n \n setSearchTerm(e.target.value)} />\n \n
\n \n
\n
\n );\n };\n\n const confirmDeleteLead = (data) => {\n setDeleteTransactionDialog(true);\n setSelectedTransaction(data);\n };\n\n const deleteTransaction = () => {\n let tempHeld = heldTrans.filter((transaction) => transaction.id !== selectedTransaction?.id);\n setHeldTrans([...tempHeld]);\n localStorage.setItem(StorageParams.HELD_TRANSACTIONS, JSON.stringify(tempHeld));\n setDeleteTransactionDialog(false);\n };\n\n const hideShopDialog = () => {\n setDeleteTransactionDialog(false);\n };\n\n const deleteTransactionDialogFooter = (\n <>\n \n \n \n );\n\n const rowExpansionTemplate = (data) => {\n return (\n \n
Cart Items for {data.clientName}
\n \n \n \n \n \n \n \n );\n };\n\n const dynamicTabs = () => {\n if (shops?.length > 1) {\n return (\n setActiveIndex(e.index)}>\n {shops.map((shop, index) => (\n \n ))}\n \n );\n }\n };\n\n const filterFunc = () => {\n let transactions;\n if (activeIndex === 0) {\n return (transactions = heldTrans.filter((transaction) => transaction.shopOwnerId === shops[activeIndex].id));\n } else if (shops?.length > 1) {\n return (transactions = heldTrans.filter((transaction) => transaction.shopId === shops[activeIndex].id));\n } else {\n return (transactions = heldTrans.filter((transaction) => transaction.shopId === shops[0].id));\n }\n };\n\n return (\n \n
\n
\n\n
\n
\n \n \n
\n \n \n
\n
\n \n \n
\n
\n \n \n
\n
\n
\n \n \n
\n
\n \n \n
\n
\n \n \n
\n
\n
\n \n \n
\n\n
\n \n \n
\n\n
\n \n \n
\n
\n \n \n
\n \n \n
\n
\n
\n
\n
\n
\n\n {header}\n\n
1 ? filterFunc() : heldTrans}\n dataKey=\"id\"\n rows={10}\n className=\"datatable-responsive\"\n emptyMessage=\"No held sales found.\"\n size=\"small\"\n onRowToggle={(e) => setExpandedRows(e.data)}\n expandedRows={expandedRows}\n rowExpansionTemplate={rowExpansionTemplate}\n >\n \n \n \n \n \n \n \n \n \n
\n
\n
\n\n
\n
\n
\n SN: {rowData.serialNumber}\n \n );\n };\n\n const phoneBodyTemplate = (rowData) => {\n return (\n <>\n Phone\n {rowData.phoneNumber}\n \n );\n };\n\n const createdByFullNameBodyTemplate = (rowData) => {\n return (\n <>\n Created by\n {rowData.createdByFullName}\n \n );\n };\n\n const dateCreatedBodyTemplate = (rowData) => {\n return (\n <>\n Date Created\n {toReadableDateTime(rowData.dateCreated)}\n \n );\n };\n\n const totalSuppliedShopsBodyTemplate = (rowData) => {\n return (\n <>\n Supplied shops\n \n // navigate('/administrator/shops', {\n // state: {\n // // ownerId: rowData.id,\n // // ownerName: rowData.firstName + ' ' + rowData.lastName\n // }\n // })\n // }\n />\n \n );\n };\n\n function checkNumericAttribute(value) {\n if (value === null || typeof value === \"undefined\") {\n return 0;\n } else {\n return value;\n }\n }\n\n const actionBodyTemplate = (rowData) => {\n return (\n \n
\n );\n };\n\n const header = (\n \n
Distributors
\n
\n \n setSearchTerm(e.target.value)} />\n \n
\n \n
\n \n 1 ? { display: \"inline-flex\" } : { display: \"none\" }}\n />\n
\n
\n
\n
\n
\n
\n \n \n
\n \n \n
\n
\n \n \n
\n
\n \n \n
\n
\n
\n \n \n
\n
\n \n \n
\n
\n \n \n
\n
\n \n \n
\n
\n
\n\n
setSelectedDistributors(e.value)}\n dataKey=\"id\"\n rows={10}\n className=\"datatable-responsive\"\n emptyMessage=\"No distributor found.\"\n header={header}\n size=\"small\"\n resizableColumns\n >\n {/* */}\n \n \n \n \n \n \n \n \n \n\n \n \n \n \n onInputChange(e, \"companyOrBusinessName\")}\n autoFocus\n />\n
\n\n Contact person
\n\n \n
\n \n onInputChange(e, \"firstName\")}\n required\n autoFocus\n className={classNames({\n \"p-invalid\": submitted && !distributor.firstName\n })}\n />\n {submitted && !distributor.firstName && First name is required.}\n
\n
\n \n onInputChange(e, \"lastName\")}\n required\n autoFocus\n className={classNames({\n \"p-invalid\": submitted && !distributor.lastName\n })}\n />\n {submitted && !distributor.lastName && Last name is required.}\n
\n
\n \n onInputChange(e, \"otherName\")} autoFocus />\n
\n
\n
\n
\n
onInputChange(e, \"phoneNumber\")}\n country={\"ug\"}\n inputProps={{\n required: true\n }}\n />\n {submitted && !distributor.phoneNumber && Phone is required.}\n \n
\n
\n
onInputChange(e, \"alternativePhoneNumber\")}\n country={\"ug\"}\n inputProps={{\n required: true\n }}\n />\n \n\n
\n \n onInputChange(e, \"email\")} autoFocus />\n
\n
\n \n setSelectedSupplier(e.target.value)}\n placeholder=\"Select Supplier\"\n maxSelectedLabels={3}\n />\n
\n \n \n
\n \n\n \n \n \n {distributor && (\n \n Are you sure you want to delete {distributor.fullName}?\n \n )}\n
\n \n\n \n \n \n {distributor && Are you sure you want to delete the selected distributors?}\n
\n \n \n